In Part Two, we displayed a nicely formatted publication date on the blog post page.

Finally, in Part Three we shall change the blog listing.

Steps - Part Three

1. In the Settings section, expand Partial View Macro Files.

   • Select LatestBlogPosts.cshtml.

   • Macros are beyond the scope of this lesson, but you don't need to understand them right now.

2. Scroll down to find the blogpost-date element and change it to use a nicely formatted Publication Date, i.e.:

   Copy

   <small class="blogpost-date">@post.PublicationDate.ToLongDateString()</small>

3. Further up in the view, you also need to redefine the blogposts variable:

   Copy

   var blogposts = startNode.Children.OrderByDescending(x => x.Value<DateTime>("PublicationDate")).ToList();

   • Because we are sorting by a custom property we need to use the generic Value method.

4. Save the partial view - a confirmation message should appear confirming that the Partial view has been saved.

5. Now view both the Blog overview and the blog posts themselves in the browser to confirm that all is working as expected.

Summary

Nice job! In this lesson, you've learned what a Document Type is and how to add a new Property to it. You've also learned how to change Templates and sort by custom Properties.

Back to Lessons

In Part One we added a new property to the Blogpost Document Type. Now in Part Two, we're going to display that instead of the default creation date.

Steps - Part Two

1. Find the blog posts on the Blog in the Content section.

2. Add publication dates to the blog posts.

   • Remember to publish your changes!

   • As this field is flagged as Mandatory you now can't save a post without it.

3. Go to the Settings section

4. Expand Templates, and Master, then click on Blogpost.

   • This is the template that is rendering the full page view of a blog post

5. Find the element with the blogpost-date class and change it to use a nicely formatted Publication Date, i.e.:

   Copy

   <small class="blogpost-date">@Model.PublicationDate.ToLongDateString()</small>

6. Save the Template - a confirmation message should appear confirming that the Template was saved.

7. View the blog post page in the browser (find the page in the Content tree, then select the link on the Info tab).

In this lesson, you will learn how to add a new date property to blog posts.

Outcome

Content editors can specify the publication date for a blog post. Blog posts are displayed with the most recent publication date appearing first.

Takeaway

Learn how to:

• Add a new property to a Document Type

• Edit a Template to display the new property

• Sort a list of items by a new property

Steps - Part One

1. In the Settings section, expand Document Types.

2. Click on Blogpost. This is the Document Type that defines the fields for this type of page.
3. The Document Type contains 2 groups: Content and Navigation & SEO.

   • At the bottom of the Content group select Add property.

   • This opens the Property Editor dialog window.

4. Give the property a name: Publication Date.

5. Give the property a description: The date of the blog post. This is the date used to display the most recent posts first..

   • Always try to add a meaningful description to help your editors.

6. Select Add editor to specify what type of data is being stored.

   • We need a standard date, so click on the Date Picker icon.

7. In the validation section, enable the field to make it mandatory.

8. Submit to close the dialog and save the property.
9. Select the Reorder option near the top-right of the window, then drag the new property to be after Page Title.

   • A logical order to your properties will make things easier for your editors.

10. Click I am done reordering near the top-right of the window and select Save the Document Type - a confirmation message should appear confirming that the Document Type was saved.