Content Views are used to display the content from your content types to the front end user of your website. A content type could have many content views, which in turn allows the user to select differed Views (Think templates) to render their content.
Content Views On A Content Type
Content Views Selection On Content
As you can see, on cotent, the user can only select a one View from whatever Content Views you have allowed them to choose from (See above)
IContentView
Any Blazor component that implements IContentView will be listed in the Allowed Views on the content type. They are very simple to create and only have a couple of properties (Both need to be parameters)
publicinterfaceIContentView{ /// <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
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