Use Facetwp With The Astra Theme

FacetWP is a cool WordPress plugin, that allows filtering archives, search results, etc. by so called facets. You can find more information about this plugin here. FacetWP works fine with the Astra theme, except one point – pagination. Lets say, your archive has 10 pages and you select one facet to reduce the number of results from 98 to 15 – the number of pages of your archive remains the same (10 instead of 2 if you show 10 posts per page). What’s the reason?

FacetWP tries to detect the element containing your loop. If FacetWP finds an possible element, it adds the class facetwp-template to it. When you use the Astra theme, FacetWP automatically detects a div with the ID #main. This is wrong. The correct element has the ID #primary.

To fix that, you have to add the facetwp-template class manually to the #primary element. You can do this by adding this code to your child theme:

add_filter(
    'astra_primary_class',
    function ($classes) {
        $classes[] = 'facetwp-template';
        return $classes;
    }
);

After adding this theme, FacetWP changes the pagination correctly – everything should be fine now.