Content Views

Content Views are the website pages, the views the user sees on the front end of the website and where you put all your HTML / styling etc.

Content Views Selection On Content

As you can see, on content, the user can only select a one View from whatever Content Views you have allowed them to choose from (See above)


public interface IContentView
{
    /// <summary>
    /// The Content that the View uses
    /// </summary>
    Models.Content? Content { get; set; }
    
    /// <summary>
    /// Language dicts for the currently set language
    /// </summary>
    Dictionary<string, string>? LanguageKeys { get; set; }
}

Example Of Content View

Remember, everything in Content Views are just Blazor. There is nothing specific to ZauberCMS, the whole point of this CMS to allow devs to build in Blazor

@using ZauberCMS.Web.Layouts
@implements ZauberCMS.Core.Content.Interfaces.IContentView

@* IMPORTANT: You must always set the layout you want to use, ZauberCMS expects one *@
@layout MainLayout

@* Pulling out the value of a textbox property by it's alias PageTitle *@
@* IContentViews use the default App.Razor built into ZauberCMS *@
@* So to get data into the <head> you can use two different ways *@
@* First way, is to use the built in Blazor PageTitle component *@
<PageTitle>@(Content!.GetValue<string>("PageTitle"))</PageTitle>

@* Pulling out the value of a textarea property by it's alias MetaDescription *@
@* Second way to get data into the head is to use SectionContent which is a Blazor feature  *@
<SectionContent SectionId="MainLayout.Sections.PageHeadContent">
    <meta name="description" content="@(Content!.GetValue<string>("MetaDescription"))">
</SectionContent>

@* Pulling out the value of a textbox property by it's alias Heading *@
<h1>@(Content!.GetValue<string>("Heading"))</h1>

@* Pulling out the value from the Radzen rich text editor property by it's alias Content *@
<div class="maincontent">
    @((MarkupString)(Content!.GetValue<string>("Content") ?? string.Empty))
</div>

@code {
    [Parameter] public Content? Content { get; set; }
    [Parameter] public Dictionary<string, string>? LanguageKeys { get; set; }
}

For further information about getting more data into your content views then click the link below

Querying Data

Remember: Content Views and the entire front end are rendered Static. Meaning that if you want interactivity in your Blazor components, you will need to explicitly add it. i.e. Adding the following in your components

@rendermode InteractiveServer
PreviousExtension MethodsNextCustom Components

Last updated