Step 4. Create your first test page locally
This guide walks through creating your first local test page. You must have already completed step 1, step 2 and step 3.
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 your first page
Now that you've added the Layout canvas to your Basic page content type you can create your first page.
- 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 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 add DX8 to an existing website. You can use the rest of this documentation to learn how to use all of DX8's features..
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 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.