Content Websites

In its simplest form Templates is just plain HTML marked up with variable place holders, coupled with partials just being HTML pages themselves and the intuitive Cascading Layout Selection and using Templates becomes a natural solution for building complete websites without any code.

The flexibility of Templates allows for several different solutions for generating websites:

Website Sub Directory

A lightweight solution that can be embedded in any existing ASP.NET or ASP.NET Core Web Application is to embed and maintain an entire Website in a stand-alone sub directory. To showcase an example we've ported the content in the .NET Core Razor Rockstars into the /usecases/rockstar-files sub directory with the entire website viewable from:

/rockstar-files

Porting an existing Razor Website

Porting an existing Razor Website is fairly straight-forward, to port Razor Rockstars we needed to rename all .cshtml files back to .html and replace all their C# code. Using /cobain page as an example we needed to replace:

@{
    Layout = "DeadLayout";
    ViewBag.Title = "Kurt Cobain";
}

To use the equivalent page metadata:

<!--
title: Kurt Cobain
-->

You won't need to specify a custom layout as Templates will automatically select the closest layout from the page at: /rockstar-files/dead/_layout.html. You'll also no longer need to maintain your Layout pages and partials in /Views/Shared separate from your views as they all get to all live cohesively in the same logical folder structure.

The declarative {{ page }} is used to embed a page in a layout instead of the imperative @RenderBody(). Likewise the syntax for partials changes to {{ "menu-alive" | partial }} from @Html.Partial("MenuAlive"). Templates also alleviates the need for bespoke partials like @Html.PartialMarkdown("Content") as it can instead leverage the flexibility of chaining existing filters to achieve the same result like {{ "content.md" | includeFile | markdown }}.

To get a feel for what an equivalent Razor Website looks like compared to Templates checkout:

type before after
Layout /Views/Shared/DeadLayout.cshtml /dead/_layout.html
Partial /Views/Shared/MenuAlive.cshtml /menu-alive.html
Page /alive/vedder/default.cshtml /alive/vedder/index.html

Embedding Remote Content

A useful alternative to embedding static file content in pages is to source the content from a external url. Using the includeUrlWithCache filter this is easy to do with great performance where you can embed remote url content, cache it for 1 minute and convert from markdown with:

{{ url | includeUrlWithCache | markdown }}

As seen in /grohl-url/index.html which is viewable at:

/rockstar-files/alive/grohl-url/

made with by ServiceStack