Step 4. Create your first template and page

This guide walks through creating your first templates and page. You must have already completed step 1, step 2 and step 3.

Create a master template

Navigate to DX8 > Templates > Master templates

Click Create next to Master template

On the next screen, on the Layout canvas, click the + button and drag the Region element onto the Layout canvas

Click the ... ellipsis button on the Region element and click Edit in the menu

In the Sidebar editor, click the Theme dropdown and select DX8 minimal theme

Then click on the Region drop-down and select Content

Click Apply at the bottom right of the Sidebar editor

Click Save and continue at the bottom of the page.

Add the layout canvas field to your basic page content type

Navigate to Structure > Content types > Basic page > Manage fields

Click Add field

In the Add new field drop-down, scroll to the Reference revisions section and choose Layout canvas

In the Label field, enter the label Layout canvas

Click Save and continue

Leave the Limit to 1 and click Save and continue again

Click Save settings on the final screen.

Create a content template for your basic page

Navigate to DX8 > Templates > Content templates > Content type

Click on Basic page

Next to Full (Node, Basic page) click Create

On the next screen, in the Master template drop-down, select Master template

At the bottom of the screen, tick Set as default

Click the + button on the Layout canvas and drag the Field element onto the Layout canvas

Click the ...ellipsis button on the Field element and click Edit in the menu

In the Sidebar editor, click the Drupal field drop-down and select Layout canvas

Click Apply at the bottom of the Sidebar editor

Click Save and continue to save your template.

Create your first page

Now that you've added the Layout canvas to your Basic page content type and created a template you should test it to make sure it works as expected.

Navigate to Content > Add content and click Basic page

Give your page a the title Test page (or something similar)

You should see the Layout canvas on the edit screen. If not, repeat Step 2

Click the + button and drag the Paragraph element onto the Layout canvas

On the Paragraph element click the ...ellipsis button and click Edit in the menu

Enter some text in the Paragraph field and click Apply at the bottom of the Sidebar editor

Click Save and publish.

You should now see your page

That's it, you've created your first DX8 template and page

If you've followed the above steps correctly and view your test page you will see the paragraph of text you've just added.

Although this is very basic, you're now able to set-up a new website to use DX8 for creating content templates and page layouts. You can use the rest of this documentation to learn how to create a full website.

Troubleshooting

If you view your test page and you don't see the paragraph of text you added then:

Go through each of the steps above to make sure you have followed each one accurately

Clear your browser cache by doing a hard reload on your browser

You can also try clearing the Drupal cache (although you shouldn't need to do this). Navigate to the Drupal 8 menu and click Flush all caches

Common questions and answers

Why is there a heading title at the top of the page? There's a title on the page because the Content region has the title block in it. To remove this, navigate to Structure > Block layout and scroll to the Content region. Within this you will see a block called Page title. Drag this into the 'DX8 hidden region' and click 'Save'. The title will now be removed from your template and page.

Why does it say Layout canvas above the paragraph? There's a field label above your paragraph because Drupal adds this when you add a field to something. To remove this label, navigate to Structure > Content types > Basic page > Manage display. Then in the Label column, click on the drop-down next to Layout canvas and select 'Hidden'. The label will now be removed from your template and page.

Why is my page is all black with dark grey text? You've not set the DX8 minimal theme as the default so your website is still showing styles from Bartik (Drupal default theme). Navigate to 'Appearance' and click 'Set as default' next to DX8 minimal theme.

Launch our Help center to raise a support ticket or search our knowledge base of common questions and answers.