ASP.NET Core MVC / Razor Pages: Page Header
IPageLayout service can be used to set the page title, selected menu item and the breadcrumb items for a page. It's the theme's responsibility to render these on the page.
IPageLayout can be injected in any page/view to set the page header properties.
Page Title can be set as shown in the example below:
@inject IPageLayout PageLayout
PageLayout.Content.Title = "Book List";
- The Page Title is set to the HTML
titletag (in addition to the brand/application name).
- The theme may render the Page Title before the Page Content (not implemented by the Basic Theme).
The Basic Theme currently doesn't implement the breadcrumbs.
Breadcrumb items can be added to the
Example: Add Language Management to the breadcrumb items.
The theme then renders the breadcrumb. An example render result can be:
- The Home icon is rendered by default. Set
falseto hide it.
- Current Page name (got from the
PageLayout.Content.Title) is added as the last by default. Set
falseto hide it.
Any item that you add is inserted between Home and Current Page items. You can add as many item as you need.
BreadCrumb.Add(...) method gets three parameters:
text: The text to show for the breadcrumb item.
url(optional): A URL to navigate to, if the user clicks to the breadcrumb item.
icon(optional): An icon class (like
fas fa-user-tiefor Font-Awesome) to show with the
The Selected Menu Item
The Basic Theme currently doesn't implement the selected menu item since it is not applicable to the top menu which is the only option for the Basic Theme for now.
You can set the Menu Item name related to this page:
PageLayout.Content.MenuItemName = "BookStore.Books";
Menu item name should match a unique menu item name defined using the Navigation / Menu system. In this case, it is expected from the theme to make the menu item "active" in the main menu.
Thank you for your valuable feedback!
Please note that although we cannot respond to feedback, our team will use your comments to improve the experience.