Skip to content

5. Tag Helpers & Partial Views

Mark Downie edited this page Feb 28, 2021 · 7 revisions

In order to aid theme design DasBlog Core provides a series of components (Tag Helpers and Partial Views) that make it easier to layout themes.

We also use Razor, a markup syntax (supports C#) for embedding server-based code into web pages and serves as the primary mechanism for creating and editing themes. Check out what you can accomplish with Razor here.

The following is a list of the most useful DasBlog Core components.

Blog Post

Blog post layouts are defined by _BlogItem.cshtml and rely on a model (@model PostViewModel).

Tag Helper\Partial View Description
<post-title-link post=@Model /> Post title with a link to the post
<post-perma-link post="@Model" css="btn">
Read more...
</post-perma-link>
Read more text with a post link
<post-title post=@Model /> Post title text only
<post-content post="@Model" /> Post content
<post-content post="@Model" strip-html="true" /> Post content, strip HTML
<post-content post="@Model" content-length="200" /> Post content, restrict length
<post-created-date post="@Model" /> Post created date
<post-created-date post="@Model" date-time-format="MMMM dd, yyyy" /> Post created date with formatting
<post-categories-list post="@Model" >, </post-categories-list> List of categories associated with the post
<post-comment-link post="@Model" /> Link to the comment section

Comment

Tag Helper\Partial View Description
<partial name="_CommentBlockPartial" model="@Model.Comments" /> Displays comment section

Editing Posts

Edit/Delete tags should always be secured as defined here.

Tag Helper\Partial View Description
<post-edit-link post="@Model" /> Edit link
<post-delete-link post="@Model" /> Delete link

Social sharing

Tag Helper\Partial View Description
<post-to-twitter post="@Model">Twitter</post-to-twitter> Twitter share button
<post-to-facebook post="@Model">Facebook</post-to-facebook> Facebook share button

Site

Can be used For use in the _Layout.cshtml view...

Tag Helper\Partial View Description
@RenderBody() Renders the main portion of a content page (MVC).
<site-title /> Site title text
<site-description /> Site description text
<site-copyright /> Site copyright text
<site-search-box/> Site search box
<site-page-control view-context="@ViewContext" /> Page control (page/1, page/2, etc)

HTML head tag

Tag Helper\Partial View Description
<partial name="_HtmlHeadPartial" /> Contains site title, description, author, Microsummary, etc.
<partial name="_HtmlRSSPartial" /> Contains RSS URL and edit URI
<partial name="_TwitterCardPartial" /> Contains Twitter card meta tags
<partial name="_OpenGraphPartial" /> Contains Open Graph meta tag for the site
<partial name="_BlogPostingSchemaOrgPartial" /> Contains Open Graph meta tag for the blog post
<partial name="_HtmlThemePartial" /> References the site CSS and the Theme CSS

Securing tags

Tag Helper\Partial View Description
<div dasblog-authorized class="col-md-12 mb-6"></div> div and contents only gets displayed when logged in
<div dasblog-unauthorized class="col-md-12 mb-6"></div> div and contents only gets displayed when logged out
<div dasblog-roles="Admin" class="col-md-12 mb-6"></div> div and contents only gets displayed when logged in as Admin

Additional questions?

If you have additional questions or concerns please submit an issue.