WordPress Archives let you customize the standard WordPress listing pages.
You will be able to redesign any WordPress archive, including the blog (index), custom post archives, taxonomy archives, author archives and even the search results page.
Let’s see how this works for a custom post archive page. In our example, we’ll customize the archive for a ‘listings’ custom post type.
Please note that this page explains the usage of WordPress Archives when used with the Views plugin only. For maximum flexibility and usage with the complete Toolset package, please visit the page about creating layouts for archives.
1. Setting up a new WordPress Archive
Select Toolset->WordPress Archives.
|1. Create a new WordPress Archive||2. Choose what kind of archive it is||3. Choose which archive it customizes||4. The name will be generated automatically, but you can change it|
2. Customize pagination and add custom search
You can customize pagination in WordPress Archives and take full control of how it works and looks.
You can allow visitors to sort the front-end results, by different options.
You can also add custom search in WordPress Archives, allowing your visitors to filter content based on post relationships, taxonomies or fields. Use the Grid button to arrange your custom search controls into columns.
Custom search options are hidden by default, but you can easily display them by clicking the Screen Options at the top of the WordPress Archive editing page. Then, check the option to display custom search controls.
3. Choose the layout style and add fields
Scroll down to the Loop Output editor and add the fields that you want to display. Use HTML and CSS to style the output.
|1. Open the Loop Wizard||2. Select the layout style||3. Add the fields that you want to display|
When you are done with this step, the archive page will already display with your fields. Since we haven’t applied any styling yet, the results will probably be very raw. Next, we style using HTML and CSS.
4. Style the output
The Loop Output will include the fields that you’ve added, but without any styling. This HTML can include anything that you like. You can also easily insert grids to organize the output into columns.
Wrap the different fields with your HTML and CSS classes, to achieve the styling you need. You will see shortcodes for every field you’ve added. Shortcodes have square brackets around them and look like
Our final styled archive page is ready. See how it looked before we styled it with the WordPress Archive and how it displays with our styling.
|Before – default styling for custom post archive from our theme||After – the custom post archive, styled with our WordPress Archive|
It displays the elements that WordPress normally includes in a the Listing Custom Post Archive. Instead of the default CPT archive output, we can see the layout that we’ve designed using our WordPress Archive.
Hint: You can also add filters to your archive. Check out the tutorial on how to create a custom archive filtered by taxonomy terms