Step 1 of any site is to create a "Document Type" – after a few installations you’ll become familiar with this terminology but at the start it might be a little bit bewildering. A Document Type is a data container in Umbraco where you can add data fields / attributes where the editor user can input data and Umbraco can use it to output it in the relevant part of a "template" (more on these later).
Document Types are infinitely extendable but usually you’ll add data fields something like the following:
Each Data Field has a type - e.g. a text string or a number or rich text body... we’ll come to this later.
Right, let’s get busy. Go to the Settings menu in Umbraco. This is the third button on the left hand black menu with the spanner. Then you’ll see a long list of settings – don’t worry about these yet, we’ll introduce them as we need them.
Document Types is strangely positioned as the last option in the list yet it’s always the starting point for any Umbraco build. Hover over the Document Types node and you’ll see three dots ... , click this to see the menu. Then click + Create button.
Figure 7 - Creating a Document Type
Ignore the Master Document Type drop down for now. Give our new Document Type the Name = "HomePage" and ensure the Create matching template checkbox is checked. Click Create.
Figure 8 – Name your Document Type
Umbraco now adds a Document Type to the tree under the node. You’ll see four tabs Info,Structure, Generic properties, Tabs. Click Info (should already be selected) and then the Choose... link next to the Icon label. Enter "home" into the search and you'll have a house icon – this will help our editors in the Content tree later.
Figure 9 - Adding an Icon to Document Type
Enter in the Description field "This is our homepage template". This text is used to help the user select the correct document type later.
Next click the Structure tab and check Allow at root. This will allow us to create a homepage at the root (simple huh?).
Next we go to the Tabs tab. Create a new tab called "Contents" and then another called "Footer" (enter the name and click the New tab button remembering to click Save after).
Figure 10 - Document Types - Adding Tabs
Now go to the Generic properties – this tab is where we create the data containers that the homepage will need and use. Click on the link Click here to add a new property. Enter the Name "Page Title". When you move to the next field you’ll see Umbraco helpfully gives you the alias "pageTitle". The Type is defaulted to "Textstring" and Tab = "Contents" (remember, we just created that!). Description again helps the editor so we'll fill this in "The main title of the page (e.g. Welcome to Widgets Ltd). "
Figure 11 - Creating our pageTitle Data Type
Ignore the rest of the fields for now and click the green Save button at the top right.
Repeat this step, clicking the Click here to add a new property link at the top of the Generic Properties tab and create these (remembering to click Save each time):
You should now have a Generic Properties tab that looks like this:
Figure 12 - Generic Properties Tab of your Homepage Document Type
We’ve now created our first Document Type – Umbraco needs three things to create a webpage and this is the first and most important. It takes the data inside an instance of the Document Type and merges it with a template – we’ll edit our template next.
How to create your first template and create a content node.