We have moved!

You are currently looking at documentation for Umbraco 8 and older versions.
An automated guess is that docs.umbraco.com/umbraco-cms/tutorials/creating-basic-site/displaying-the-document-type-properties/ could be the link to the new documentation for Umbraco 9 and newer versions.

    Displaying the Document Type Properties

    You might have noticed that the content we've added to the homepage is not being displayed. We need to wire up the Data Type properties to the template.

    Let’s look at our template and identify where the content should be displayed.

    Where our Data Properties Content Should be Output

    The top arrow in this image is the Page Title and the bottom arrow is the Body Text, whereas the Footer is all the way at the bottom.

    Setting the Document Type Properties

    To set the Document Type properties:

    1. Go to Settings.
    2. Select Templates in the Templating section, and open the Homepage template.
    3. Scroll down to the <!-- Jumbotron, w title --> section (around line 48) and highlight the text “Welcome - UmbracoTV”. Preparing to replace the hardcoded text with an Umbraco Page Field
    4. Click Insert and select Value.
    5. Select pageTitle field from the drop-down list. Umbraco Page Field
    6. Click Submit.
    7. Repeat the same process for the content between the <div class="container"> tags (around line 60 to 77):
      1. Highlight the content as shown in the figure. Replacing the bodyText with the Umbraco Page Field
      2. Click Insert and select Value.
      3. Select bodyText field from the drop-down list.
      4. Click Submit.
    8. Repeat the same process for the content in the <div class="container-fluid footer"> tag (around line 147 to 180):
      1. Highlight the content between the <div class="container"> tags. Replacing the Footer Text with the relevant Umbraco Page Field
      2. Click Insert and select Value.
      3. Select footerText field from the drop-down list.
      4. Click Submit.
    9. Click Save.

    Reload your homepage to view the content. You should see something similar like the image below: Displaying the Document Type Properties

    Now, you can go back and add additional fields or update existing fields in the Document Type, fill them out in the content node and then add them in the template to display the data in the website.

    Prev: CSS and Images                           Next: Creating Master Template Part 1