Add app name as value to page title in Blazor

Question

I’d like to add a custom value to the page title in my Blazor app.

I’m currently using the native <title></title> component which doesn’t pass any values other than each pages name.

I’d like to have a page title convention like this:

App name | page name

Answer 1

You can create your Custom component for title. Here's how you can do that.

1. Create a RazorComponent inside your application with below code.

<title>App Name | @Title</title>

@code {
    [Parameter, EditorRequired]
    public string Title { get; set; } = "";
}

2. Then you can use this component to set the title like this.

@page "/"
<CustomPageTitle Title="Page 1"></CustomPageTitle>

<h1>Hello World</h1>

3. You will get the required result.