Home
Github
Wiki
Videos
Contact
Sponsor
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: ```cs 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](/wiki/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](/wiki/editor-templates#imagepicker) 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. ```cs 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.