2 min read

Creating Custom Page Templates in FSE (Landing Pages)

In Classic themes, you created a file named page-landing.php and added a comment header /* Template Name: Landing Page */.

In Block themes (FSE), we replace PHP with HTML and register the template in theme.json.

1. The Use Case

The most common use case is a "Landing Page" or "Canvas" template that removes the global Header and Footer, allowing you to build a completely unique layout for marketing campaigns using blocks.

2. Step 1: Register in theme.json

You must explicitly tell WordPress that this template exists.

Open theme.json and add the customTemplates array at the top level (same level as settings and styles).

{
    "version": 3,
    "customTemplates": [
        {
            "name": "landing-page",
            "title": "Landing Page (No Header/Footer)",
            "postTypes": ["page"]
        },
        {
            "name": "sidebar-left",
            "title": "Page with Left Sidebar",
            "postTypes": ["page", "post"]
        }
    ],
    "settings": { ... }
}
  • name: The internal slug. This determines the filename.
  • title: The human-readable name shown in the Editor dropdown.
  • postTypes: Where this template is available (usually page, but can be post or custom types).

3. Step 2: Create the HTML File

WordPress looks for a file inside the templates/ folder matching the name you defined.

  • Registry Name: landing-page
  • File Path: templates/landing-page.html

Example: Landing Page (Clean Slate)

This template intentionally omits <!-- wp:template-part {"slug":"header"} /-->.

File: templates/landing-page.html

<!-- wp:group {"tagName":"main","layout":{"type":"constrained"}} -->
<main class="wp-block-group">

    <!-- wp:post-content /-->

</main>
<!-- /wp:group -->

Now, whatever you build in the Block Editor is the only thing on the page.

4. Step 3: Selecting the Template

  1. Go to Pages > Add New (or edit an existing page).
  2. Open the Settings Sidebar (click the gear icon).
  3. Find the Template section (usually under "Summary" or "Page Attributes").
  4. Click the current template name (e.g., "Default template").
  5. Select "Landing Page (No Header/Footer)" from the dropdown list.

5. Troubleshooting

  • Template not showing? Ensure the name in theme.json matches the filename in templates/ exactly (minus .html).
  • "postTypes" missing? If you don't define postTypes, it defaults to page. If you want it on a blog post, you must explicitly add "post" to the array.