// Template Configuration

Overview

A template tells FacetWP which posts to filter upon, and is required for facets to appear. FacetWP supports 2 template types:

CSS-based

Use this approach to add facets to existing search or archive pages (category archives, WooCommerce shop page, etc.). It involves adding a CSS class around the result listing.

FacetWP now includes template auto-detection. Simply add some facets to your category / shop / search / archive pages, and FacetWP will handle the rest ūüôā

Shortcode-based

This method is best¬†for creating brand new listing pages. It involves creating a new template within FacetWP’s admin UI, then pasting its¬†shortcode into a page.

Option 1: CSS method

Add the facetwp-template CSS class to a new (or existing) element surrounding the Loop.

<div class="facetwp-template">
    <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
        <?php get_template_part( 'content', 'post' ); ?>
    <?php endwhile; else : ?>
        <p><?php _e( 'Sorry, no posts matched your criteria.' ); ?></p>
    <?php endif; ?>
</div>

The file to edit depends on several factors. As a general rule:

  • Search page: search.php
  • Main archive: archive.php
  • Category archive: category.php
  • Blog home: home.php
  • WooCommerce shop: archive-product.php
  • See WP’s¬†Template Hierarchy page to learn more

That’s it! FacetWP will automatically detect the query¬†and¬†display relevant¬†facet choices.¬†Learn how it works, and¬†how to troubleshoot if necessary.

Option 2: Shortcode method

Browse to Settings > FacetWP, then click on “Add New” beside the Templates header.

admin-edit-template

Query Arguments

The Query Arguments field (based on WP_Query) determines the initial bucket of posts to load, how many¬†per page, and in which order.¬†Below,¬†we’ll fetch published posts, and show 15 per page:

<?php
return array(
    'post_type' => 'post',
    'post_status' => 'publish',
    'posts_per_page' => 15,
);

FacetWP also includes a Query Builder tool if needed.

Display Code

The Display Code field is used for generating the template output. The following example will output the linked title for each post item.

<?php while ( have_posts() ): the_post(); ?>
<p><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></p>
<?php endwhile; ?>

Alternatively, you could put your display code into a PHP template file:

<?php
include( get_stylesheet_directory() . '/loop-index.php' );
?>

Shortcode

If your template is named “lessons”, then your template shortcode would be:

[facetwp template="lessons"]

See Also