ContentPage

ContentPage loads one content item by its URL and lays out a whole article: breadcrumbs, the item through LocalizedContentView, previous and next links, a sidebar of categories and tags, optional share links and optional related items. Use it for a quick article page without assembling those parts yourself.

Usage

@page "/blog/{Slug}"
@using Osirion.Blazor.Cms.Web.Components

<ContentPage Path="@($"blog/{Slug}")" />

@code {
    [Parameter] public string? Slug { get; set; }
}

Path is the item's Url exactly as the provider stores it: no leading slash, no file extension, and for localized content no locale folder (blog/my-post). The match is exact, including case.

ContentPage writes nothing to the page head. To add SEO metadata, keep the loaded item and render a SeoMetadataRenderer for it:

@page "/blog/{Slug}"
@using Osirion.Blazor.Cms.Domain.Entities
@using Osirion.Blazor.Cms.Web.Components

@if (current is not null)
{
    <HeadContent>
        <SeoMetadataRenderer Content="@current" SchemaTypes="@(new[] { SchemaType.BlogPosting })" />
    </HeadContent>
}

<ContentPage Path="@($"blog/{Slug}")"
             ShowRelatedContent
             ShowShareLinks
             TagUrlFormatter="@(tag => $"/tag/{Uri.EscapeDataString(tag)}")"
             OnContentLoaded="@((ContentItem item) => current = item)" />

@code {
    [Parameter] public string? Slug { get; set; }

    private ContentItem? current;
}

Parameters

ShowMetadata, FeaturedImageCaption, ShowFooter, PreviousItemLabel, NextItemLabel and DirectoryUrlFormatter are declared but have no effect in the current markup. Style, Theme and unmatched attributes from the base class are not written to the markup either.

Behavior

• Rendering. Static SSR renders the finished article on the server; nothing needs script. A new Path clears the neighbors, related items and default share links the component loaded for the previous one.
• Body. The item is rendered by LocalizedContentView, so the body is sanitized, a header shows the title, author, date, reading time and featured image, and translation links appear when the item has translations.
• Sidebar. CategoriesList and TagCloud list every category and tag of the site, not only the item's, without counts.
• Share links. They open in a new tab with rel="noopener noreferrer". The default links carry the page's absolute URL without query string or fragment.
• Related items. The default link is the item's source path with .md removed; set ContentUrlFormatter when your routes differ.
• Security. FooterContent and each ShareLink.Icon are written as raw HTML without sanitizing. Never put user-supplied or content-supplied text in them.
• Errors. A provider failure is logged and the not-found state is shown.

Styling

The root element has the class osirion-content-page-container; the article is osirion-content-page with osirion-content-main, osirion-content-primary and osirion-content-sidebar. The other parts use osirion-content-share (osirion-content-share-link, plus osirion-content-share-{name} per link), osirion-content-custom-footer, osirion-content-related with osirion-content-related-grid, and osirion-content-not-found. Colors and spacing come from theme tokens such as --osirion-text-primary, --osirion-text-secondary and --osirion-border-color.

Related

• LocalizedContentView: the article inside the page
• ContentView: a single item without the page layout
• ContentBreadcrumbs: the breadcrumb trail
• SeoMetadataRenderer: head metadata for the item