Skip to main content
Home  › ... 2sxc Apps

Razor Page Service Tutorials

Tutorial Home
Base tag in header
#3 Page Icons for Favicon, Apple/Android
Meta and other Tags in header

IPageService AddIcon to Html Headers

This page sets various icon headers according to best practices.

Requirements
Resources

Info about the Base Class

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

This allows us to use Kit.Page to access IPageService without having to use GetService<>

Look at the html-header in the output-source to see the effect.
The following links will set different icons depending on what you need. 

@{
  // use url parameter to decide which icon(s) to show, and default to "set"
  var mode = CmsContext.Page.Parameters["mode"];

  // the icon we want to use for this page is this png file
  var iconUrl = App.Path + "/blade/assets/razor-blade-icon.png";

  // now add the headers depending on the demo you picked
  // in your code you would only use one of these
  if(mode == "one") {
    Kit.Page.AddIcon(iconUrl);
  } 
  else if (mode == "set") {
    Kit.Page.AddIconSet(iconUrl);
  } 
  else if (mode == "nofav") {
    Kit.Page.AddIconSet(iconUrl, favicon: false);
  }
  else if (mode == "pngfav") {
    Kit.Page.AddIconSet(iconUrl, favicon: iconUrl);
  }
}
Base tag in header
#3 Page Icons for Favicon, Apple/Android
Meta and other Tags in header

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 -->
IPageService AddIcon to Html Headers... <!-- unimportant stuff, hidden -->


@{
  // use url parameter to decide which icon(s) to show, and default to "set"
  var mode = CmsContext.Page.Parameters["mode"];

  // the icon we want to use for this page is this png file
  var iconUrl = App.Path + "/blade/assets/razor-blade-icon.png";

  // now add the headers depending on the demo you picked
  // in your code you would only use one of these
  if(mode == "one") {
    Kit.Page.AddIcon(iconUrl);
  } 
  else if (mode == "set") {
    Kit.Page.AddIconSet(iconUrl);
  } 
  else if (mode == "nofav") {
    Kit.Page.AddIconSet(iconUrl, favicon: false);
  }
  else if (mode == "pngfav") {
    Kit.Page.AddIconSet(iconUrl, favicon: iconUrl);
  }
}




<!-- unimportant stuff, hidden -->