-
Notifications
You must be signed in to change notification settings - Fork 61
Sandra Snow Themes
Sandra Snow themes live in the themes/ directory.
If you want to use a different theme from the default theme, change the "theme" configuration value in snow.config to "SnowByte" to change theme to the theme used by Sandra.Snow.Template.
If you want to make your own theme, we recommend copying and renaming the default theme directory and editing the templates to give your Sandra Snow blog your own unique look.
Sandra Snow uses the Nancy Razor View Engine to give you the opportunity to write your custom theme templates using the Razor syntax that is used by ASP.NET MVC (NOTE: the implementation may differ from the implementation used by ASP.NET MVC).
More information can be found here
The recommended file structure is:
.
|-- /_layouts
|-- default.cshtml
|-- post.cshtml [required]
|-- /images
|-- /javascripts
|--/ stylesheets
|-- about.cshtml
|-- archive.cshtml
|-- categories.cshtml
|-- category.cshtml
|-- drafts.cshtml
|-- index.cshtml [required]
/_layouts/post.cshtml and index.cshtml are currently the only files that are required.
This is the base template which contains all the standard bits of HTML that have to appear on every page - the <html>, <head> and <body> tags, as well as any other HTML that makes up repeated sections for the blog.
The default template contains the Razor expression @RenderBody to denote where the content from templates which use the default template goes.
Page templates then have:
@{
Layout = "default.cshtml"
}
at the top of the template to specify that they should use the default template, and that their content should be placed into the place in default.cshtml where @RenderBody is defined.
This is the homepage template, and uses default.cshtml. The homepage gets a paged list of posts that should be displayed, and index.cshtml defines how each post should be displayed.
The template uses the Razor expression
@inherits Nancy.ViewEngines.Razor.NancyRazorViewBase<Snow.ViewModels.ContentViewModel>
to define it's model and a @foreach helper to output the list of posts. This is followed by previous and next buttons to allow you to go to the previous and next pages (if more than 1 page of posts exists. Currently Sandra Snow displays 10 posts per page) using @Model.HasPreviousPage and @Model.HasNextPage helpers to determine which button to show.
This is the template for a single post, which also uses default.cshtml.
The post template defines it's model by the Razor expression
@inherits Nancy.ViewEngines.Razor.NancyRazorViewBase<Snow.ViewModels.PostViewModel>
and uses the @Model accessor to output the details of the post.
Create your own theme by either copying the default theme, or adding a new folder to the themes directory with the new name of your theme, i.e. my-awesome-sandra-theme (names should contain letters, number and hyphens only). Then add a new folder _layouts, and two empty files, /_layouts/post.cshtml and index.cshtml.
Congratulations, you have just created your first Sandra Snow theme. It won't do anything, but it's a valid theme none the less.
index.cshtml gets passed an object called ContentViewModel which can be used with a @foreach helper to output each post. E.g.
@foreach(var postPaged in Model.PostsPaged) {
// here we are within the context of a single post
// whatever you put here gets run for each post in Model.PostsPaged
}
@if (Model.HasPreviousPage) {
if (Model.PreviousPage == 1) {
// this would be a link to the homepage
}
else {
// this would be a link to the previous page
}
}
@if (Model.HasNextPage) {
// this would be a link to the next page
}
Once you're in the context of a single post, either when looping through the posts list on the homepage or inside post.cshtml you access to the properties of a post.
Currently these are:
- Title - post title
- Url - the relative URL for a post
- Content - post HTML
- Date - date post was published
- Author - post author
- ContentExcerpt - an excerpt of the full post that should be displayed on the homepage (see Description or Excerpt for more details)
- Series - a post that is part of a series of posts (see Series for more details)
- Categories - the tags of the post
- Published - the published state of a post (see Published for more details)
Each of these properties can be output by using the standard Razor expression, e.g. @Model.Title.