Creating ViewModels

in Puck, your pages are based on ViewModels which inherit from puck.core.Base.BaseModel. you will want to create ViewModels for the different types of pages on your website. for example, you may create a Homepage ViewModel or a NewsPage ViewModel.

Decorating your ViewModels with attributes

you can decorate your ViewModels with validation attributes as you would normally do in .net MVC but you will also want to decorate your properties with puck.core.Attributes.IndexSettings attribute to control how your property will be indexed and stored by lucene. here is a basic example of a ViewModel:

public class Page:BaseModel
    {
        [Required]
        [Display(Name = "Keywords")]
        [IndexSettings(Analyzer = typeof(StandardAnalyzer))]
        public string MetaKeywords { get; set; }

        public PuckImage Image { get; set; }
        
        [Display(Name = "Main Content")]
        [UIHint(EditorTemplates.RichText)]
        public string MainContent { get; set; }
    }

in the example above, the Page ViewModel inherits from BaseModel and has a couple of Properties. the MetaKeywords property has an IndexSettings attribute that specifies which analyzer should be used to index and search this property. IndexSettings attribute also includes options to store a field, ignore a field, keep value casing and more. while it is recommended you use this attribute, it is not required and if you don't specify IndexSettings, defaults will be used. by default, the StandardAnalyzer is used to index and search a property which doesn't have an analyzer specified.

also of note is the use of the UIHint attribute. this specifies which Editor Template will be used in the backoffice when editing content. The EditorTemplates class has string constants for the names of various editor templates and is a useful convenience that means you don't have the type out the editor template name manually.

There are some editor templates which come as part of Puck including a generic ListEditor which allows you to edit (add, remove and sort) generic lists. it supports List where T doesn't have to be a primitive type but can also be a complex type and is a very useful editor template as it means you don't need to create your own template to edit a list which is a common procedure with .net MVC.

Model Inheritance

it's probably a good idea to use inheritance with your ViewModels to best model your data. For example, you could have a Page which inherits from BaseModel and contains basic metadata all web pages have such as Title, Keywords and Description and then you could have a more specialized NewsPage or BlogPage ViewModel with more specific properties such as Tags and MainContent.

The ViewModels that come with Puck

there are by default a number of ViewModels in the puckweb/ViewModels folder, these can all be removed but i'd recommend leaving ImageVM as there's a very useful Image Picker editor template that works with this type.

Organizing properties into tabs

you can use the Display attribute on your properties and specify a GroupName so that when you're on the edit screen, the property will be shown in that tab.

public class Page:BaseModel
{
[Display(GroupName = "Images")]
public PuckImage Image { get; set; }
}

the code above sets the Image property to show in the Images tab.

you can also organize your properties into tabs on the "settings->field groups" page. if you set the tabs in code and in the backoffice, the code will take precedence.