Razor Blade Tutorials

#4 Open-Graph headers for Social Media

RazorBlade add Open-Graph Headers

⚠️ WARNING: These examples only work in Dnn ☢️

2sxc 12 introduces the new PageService which also works in Oqtane 💧. We suggest you use that instead. 👉 See Razor Page Service
Note that to ensure this tutorial can run on all platforms, we've included some #if NETCOREAPP which changes what code runs on what platform.

Info about the Base Class

This tutorial inherits from the Custom.Hybrid.Razor14 base class.

This allows us to use Kit.Scrub to access IScrub without having to use GetService<>

This page sets various open-graph headers. Look at the resulting output-source to see the effect.

Requirements

2sxc 12.05

Resources

PageService

JSON-LD Headers for SEO

#4 Open-Graph headers for Social Media

Page Icons for Favicon, Apple/Android

Source Code of this file

Below you'll see the source code of the file. Note that we're just showing the main part, and hiding some parts of the file which are not relevant for understanding the essentials. Click to expand the code

@inherits Custom.Hybrid.Razor14
@using ToSic.Razor.Blade;
<!-- unimportant stuff, hidden -->
RazorBlade add Open-Graph Headers... <!-- unimportant stuff, hidden -->

@if(CmsContext.Platform.Name == "Oqtane") {
  @Html.Partial("../shared/_MessageOqtaneDisabled.cshtml")
} else {
  // note: 'og:' is auto-prefixed if not given in the key
  Kit.Page.AddOpenGraph("title", "Demo of OpenGraph headers");
  Kit.Page.AddOpenGraph("type", "website");
}

<!-- unimportant stuff, hidden -->