How to Create Custom Archive Pages in WordPress with Elementor

Updated: April 4, 2022

You will need an archive page to show the resulting grid when you have different categories on your website and want to manage each category on a specific page. With Elementor, you can easily create custom archive pages on your website. You can filter your archive page based on terms that you’re familiar with, as below:

  • Category
  • Date
  • Author
  • Tags
  • Recent Posts
  • Search Results
  • etc.

With Elementor, you can design and control your archives layout; it can affect all different archive terms. This article will show you how to create and set up an archive page in WordPress with Elementor.

How to Create and Set up an Archive Page with Elementor

Before starting the tutorial and going any further, we hoped you could make sure you already have Elementor Pro.

Step 1: Create a New Archive Template Using Theme Builder by Elementor Pro

On your site dashboard, go to Templates > Theme Builder. Once you enter the theme builder page, you will see some of the THEME BUILDER options. Select the Archive and create a new archive template by clicking on the (+) Add New button. It will bring you to premade template library; you can pick one of those premade archive templates or create it from scratch like we’re going to do. So, close the window by clicking on the (X) button.

Step 2: Design the Archive Template

In this tutorial, we will create a Tags Archive. So, let’s begin.

Now, you entered the Elementor editor. Go to Preview Settings and see the Preview Dynamic Content as option. Click the drop-down button and choose Tags Archive. Under that, the box will appear, and select one of the tags you want to archive. Once you have set your tag, don’t forget to apply it by clicking on the APPLY & PREVIEW button.

Next, go to the widget panel and select the Archive Title widget, then drag and drop it into the canvas area. You will find many options to edit and style your archive title on the settings panel. In this example, we only change two things, as below:

  • Content tab

Set the Alignment to the Center

  • Style tab

Set the Typography Size to 50

Select the Archive Posts from the settings panel then drag and drop it into the canvas area. Place it under the archive title.

There are some changes that we applied, as below:

  • Section:

Layout > Width: 800

  • Archive Posts

On the Content tab > Layout, set the Image Ratio to 0.5

We want to inform you that your WordPress settings determine the number of archive posts displayed in the archive. If you want to change that number which is what we’ll do, go to your WordPress Dashboard > Settings > Reading. On the Blog pages show at most set the number of posts you want. It will impact all of your archives. In this tutorial, we set it to 9. Don’t forget to save it by clicking on the Save Changes button.

Step 3: Publish the Archive Template

Once you are done with your archive template design, you can apply it to the site. Click on PUBLISH button and click on the ADD CONDITION button to select the condition. All archives will be displayed by default, applying your design to every archive type. In this tutorial, we want to use the design for a specific archive. Select your option from the drop-down. Since you want to display the archive by post tag, select the Tags and set the specific tag you want. To finish it, click the SAVE & CLOSE button.

Voilà, it’s done. Now, your archive template is already live on your site.

The Bottom Line

The archive page is like a catalog page. Your archive page will make a list of all of your posts. So, when your website visitors come to your site, they go to your archive page, and from there, they can select the individual posts and then read them. Elementor Pro allows you to create a custom archive page to replace the default archive page on your website. Be it category, tag, posts from authors, and so on. You can create the custom archive page using the visual editor of Elementor.

This page may contain affiliate links, which help support WP Pagebuilders. Learn more

Leave a Reply

Your email address will not be published.

Pin It on Pinterest

Thanks for commenting

Help us grow by sharing this post with your friends!

Scroll to Top

It's a minute already. Thanks for staying

Subscribe to get regular articles about page builder plugins and WordPress in general