Create an Archive theme layout for WooCommerce (Themer)

You can use the Archive theme layout to design the following WooCommerce archive pages:

  •  A Shop page that displays products
  • A taxonomy page – in other words, a page that lists products for a specific category or tag

Note: Theme layouts created in Beaver Themer can only display lists of products, not lists of categories or subcategories. In other words, if your WooCommerce product display settings are set to Categories or Subcategories (as shown in the following screenshot), a theme layout that applies to those pages will override those settings and show products instead. 

It's still possible to create one or more theme layouts for archive pages that list products and exclude the pages that need to display categories or subcategories.

Here's how to create a theme layout for a WooCommerce archive page.


Create an Archive theme layout

  1. In the WordPress admin panel, click Builder > Theme layouts.
  2. Click the Add New button at the top of the page.
  3. Enter a title for your theme layout.
  4. Verify that Type is Theme layout and for Layout select Archive, then click Add theme layout.
    The Edit theme layout screen will open.

Edit the Archive theme layout

  1. For Location, click Choose, then from the Product Archive section choose one of the following: 
    • Product archive
      Applies to the Shop page (or an archive page you have designated instead of Shop).
    • Product category archive
      Applies to any single Category archive page, which will list all the products assigned to that category.
    • Product tag archive
      Applies to any single tag archive page, which will list all the products that are associated with that tag.
  2. Add more location or exclusion rules so the layout applies only to the archive pages you want this layout to apply to. 
  3. Click Publish, then click Launch Page Builder.
  4. Click Templates in the upper right corner.
  5. Select the Products template, then click Replace existing layout.
    Now you have the initial layout for a WooCommerce product archive page.
  6. In the Preview pane, select the type of product archive you want to preview as you modify the page layout. Publish or Save your theme layout when you're done.

Tip: It's easier to design the layout if you already have a couple products created. You can preview the list of products in the archive as you work and see the information that will appear.

Special WooCommerce modules for the Archive theme layout

When you edit an Archive theme layout and have the WooCommerce plugin installed, there's a special content category in the Add content panel called WooCommerce modules. The Archive type has two WooCommerce modules: Breadcrumb and Products. See the Related Articles for a detailed description of each module.

See the Related Articles for a description of each of these modules.

Note: The WooCommerce modules that you use in Theme Builder to lay out archive pages have standard WooCommerce functionality. The WooCommerce modules provide a convenient way to style the page and show or hide various WooCommerce components.