How to add or edit templates via the post/Block Editor

The Template Editor is a feature that allows block editor users to edit and create templates that a page or post uses. Here are some step-by-step instructions to help to review.

How to edit a template 

• Add a new post or page.
• Open the block settings sidebar and navigate to the Page or Post Settings tab.
• Under the “template” section, select the ‘Edit’ option. If you don’t see the option to edit at first, it’s likely because you’re not using a block theme that allows you to both create and edit the current theme templates.
• From there, you’ll be taken into Template Editing Mode, where you can make any changes you’d like. If you need to, you can select the ‘Back’ option to go back to your content and make changes.
• When you’re done making changes, select ‘Publish’ and go through the saving flow to confirm the changes you’d like to make. Keep in mind that you might see multiple items to save.

How to assign a template to a post or page

• Open a page or post that you want to alter the template of.
• Open the block settings sidebar and navigate the Page or Post Settings tab.
• Under the “template” section, you’ll see a dropdown option allowing you to select which template you want to use. If you don’t see a dropdown option, it means you need to create more templates.

How to make a new template

• Add a new post or page.
• Open the block settings sidebar and navigate to the Page or Post Settings tab.
• Under the ‘template’ section, select the ‘New’ option.
• You’ll then be asked to name the new template. Make sure to give it a descriptive name like “Full Width”.
• From there, you’ll be taken into template editing mode where you can make any changes you’d like. You can select the ‘Back’ option to go back to your content and make changes if you need to.
• When you’re done making changes, select ‘Publish’ and go through the saving flow to confirm the changes you’d like to make. Keep in mind that you might see multiple items to save.

Watch this short video

Click here to view the video transcript

These are all the templates available via the Site Editor, but what if you would like to edit and create templates that a page or post users? Well, we need the Template Editor for this. So let us make our way back to the Dashboard, click on Pages and add a new page. Let us name this page ‘A template that a page uses.’

Let us make our way to the sidebar settings and you will see that this page has been assigned to the Default template. And the Default template is the Page template.

Or you may decide to assign this page to one of the other templates and then edit.

Or you can create a new template and then name it appropriately, like No heading for example. And once you click on Create, it will take you into the Template Editing Mode and here you can create a custom page template that this page or another page can use.

Saving flow

The Editor uses a multi-entity saving function that allows you to save different things.

• When you click the Save button, you will get a list of all the templates and template parts where you have made changes.
• You can choose to save all or just some of them.
• Note that some changes (like changes to the Header and Footer templates) will apply to all pages of your site that use those templates, and not just the page you were working on.

Here is an example of the saving flow and the different changes it is saving.

Practical: Make a new template 

Use your test/sandbox website and create a new template. Follow these steps below or create your own example:

• Make your way to Dashboard > Pages and add a new page.
• Under the “Template” section in your sidebar, click on ‘New’ and name the new Template ‘Recipes.’ 
• From there, you’ll be taken into Template Editing Mode.
• Remove any other blocks. Keep the Post content in place as this will display your dynamic content.
• Add a Cover block at the top and make the hero image larger and more pronounced.
• Add a heading ‘Food feeds your soul’ and center it.
• Add a Navigation block and select ‘All pages’.
• Save and Publish your work.

Watch this short video

Click here to view the video transcript

In this practical activity, we are going to create a new Page template. And to do this, let us make our way to Pages. Click on Add new and name this page Recipes. And then in the sidebar settings, under templates, click New. Describe the purpose of the template. This is a recipes template so I am going to name it Recipes and then click on Create. This will take us into the Template Editing Mode. I will click on the List View to simplify the process and delete some blocks to provide me with a clean canvas. Once you are ready, use the three vertical dots to delete the Group block and the Separator block. I will keep my Post Content block in place as that is where my dynamic content from our page or my post will be pulled into.

Now we are going to click on the Group block and use the three vertical dots to add a Cover block at the top of our page. So insert a Cover block, click on Media Library, select the appropriate image and click on Select. Now we are going to click on our Site Title block and use the block toolbar to drag it into our Cover block. Remove the paragraph and change the title to “Food feeds your soul.’

In this template, we want to make our hero image larger and more pronounced. So let us drag our Cover block and make it larger. And then reposition our focal point picker. I am going to scroll down and change the opacity to 20.

The next step is to add a Navigation block. Let us go to our List View and insert a Navigation block after our Cover block. I will use my slash command to insert the Navigation block and then click on Add all Pages. Once we have done that, click on Publish, Save and then Preview. I will preview the page in a new tab. And here you are; your new custom page template which you can assign to this page or any other food or recipe related pages.