Watch video

In this episode we are going to look at how to set up Folders in our Document Type tree and how to use compositions to inherit properties.

Let’s get started with Folders. Folders exist to help us organize the backoffice. As a site grows, the document type tree can get rather large. When we right-click on the Document Type tree, up to this point we have only selected to Create a new Doc Type. This time we are going to use the Folder option.

We will give the Folder a name of Compositions because all of our Document Types used as a composition will be stored in this location.

So what is a composition? Simply put, it is a way to relate two document types to inherit properties from one another so we are not duplicating the same properties on multiple document types. To better understand compositions let’s look at the back office. Starting off, we will create a new Doc Type under our Compositions folder. Let’s name our doc type “SEO”

Next we can add a tab, and call it SEO as well, then add a few properties. This doc type will be used to store information to improve our search engine optimization so we want fields such as meta title, meta description, and meta keywords.

Once we are finished adding properties let’s save the document type. As the indentation implies we now how an SEO Doc Type in our Compositions folder.

For the best SEO, we would want these properties on almost all of our website pages. With compositions this is easy to accomplish.

Starting with our Home Page Doc Type we will navigate to the compositions menu in the top right corner. A right-side menu will appear for us and list all Document Types that we can use as a composition.

You may notice News Area, News Item, and Text Page are all greyed out and cannot be selected. This is because, they share a property with the same alias: bodyText. We cannot have multiple properties on the same Doc Type with the same alias because when we move to Templating and displaying our data Umbraco will not know which field to use. Luckily the back office helps us out and will not allow that mistake to occur.

Let’s choose our new SEO Document Type and hit submit. We can now see that the SEO Tab and properties are listed in our Home Page Document Type.

The other thing to note is that we cannot change the Tab name or update any of the properties. If we wanted to update one of these properties, we would need to go back to the SEO document type. The same applies to reordering tabs and properties. In our Home Page doc type we cannot reorder these elements but we can in our SEO doc type.

For instance, if we wanted to display the SEO tab after our content tab we will move back to our SEO doc type and hit the reorder option. From here, we can increase the numeric value to 1 and hit save. Moving back to our Home Page doc type you will see the SEO tab is listed after our Content tab.

Finally, if we move to the content section, and click on our Welcome page based on the Home Page Doc Type, we can see that the SEO tab exists with all our meta data properties.

We can use this same process on pages that use the Text Page, News Area, and News Item doc types so all pages on our website would have SEO properties without us having to repeat ourselves by adding the same property on multiple doc types.

To review, we can use Folders in our document type tree to organize our backoffice. We can use compositions, to inherit properties from other document types without having to recreate those properties on every document type.

Document Types

Total Time: 00:51:14

This is the most important thing you need to learn about Umbraco. Understanding the concept of Document Types and how to work with them is the foundation of your Umbraco knowledge.