Magento WordPress Post Types & Taxonomies Layout XML

« Back to Magento WordPress Post Types & Taxonomies

You can use Magento 2's layout XML feature to easily change templates for different post types and post type archive pages (the post type homepage).

Post Type Homepage (Archive)

Each custom post type can be configured to have it's own archive page. This is the homepage for the custom post type and lists all of the custom posts (just like /blog does for your default posts).

To enable this page, ensure that when creating the post type, you set the has_archive option to True.

To find the archive page, create or edit a post from your custom post type and then click the View Post link. If the archive page is enabled, you should see it in the breadcrumbs. If you don't see the breadcrumbs and you're using the Yoast SEO plugin, you may need to enable the Breadcrumbs feature.

Change the Post Type Archive Page Template

For this example, we will use the post type news_article. You will need to change this for your own post type.

We will also assume that your custom theme lives at app/design/frontend/YourVendor/YourTheme.

To target the post type archive page for the news_article post type, create the following file:

<!--
/*
 * File: app/design/frontend/YourVendor/YourTheme/FishPig_WordPress_PostTypeTaxonomy/layout/wordpress_news_article_list.xml
 * Change 'news_article' for your custom post type
 */
-->
<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd"><body>
    <!--
    /*
     * Change the view.phtml template for the post type archive page
     * Create the new custom template at:
     * app/design/frontend/YourVendor/YourTheme/FishPig_WordPress_PostTypeTaxonomy/templates/news_article_archive.phtml
     */
    -->
    <referenceBlock name="wp.postlist.wrapper" template="FishPig_WordPress_PostTypeTaxonomy::news_article_archive.phtml" />
  </body></page>

Change the Post Type Archive Page Layout

The page layout is the root template. For example, the root template may be 2columns-left (1 main column and 1 sidebar on the left). You can change this with the same file we used above.

<!--
/*
 * File: app/design/frontend/YourVendor/YourTheme/FishPig_WordPress_PostTypeTaxonomy/layout/wordpress_news_article_list.xml
 * Change 'news_article' for your custom post type
 */
-->
<?xml version="1.0"?>
<page layout="2columns-left" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd"><body>
    <!--
    /*
     * Change layout="2columns-left" to change the layout
     * Available options are:
     * 1column, 2columns-left, 2columns-right, 3columns
     * You may also use custom layouts that you have setup
    */
    -->
  </body></page>

Magento WordPress
Post Types & Taxonomies
Documentation