Browse Plugins

Shortcodes & Gutenberg Blocks

The setup wizard places filters on your shop page automatically. But if you want them somewhere specific, a custom page, a sidebar widget, or a page builder layout, use shortcodes or blocks.

Shortcodes:

Copy and paste these into any page, post, or widget area:

  • [filterkit_filters] Shows the full filter sidebar.
  • [filterkit_filtered_products] Shows the product grid that updates when filters are used. Pair with the sidebar shortcode for a custom shop layout.
  • [filterkit_active_filters] Shows the active filter chips, little tags like “Color: Red ×” that customers can click to remove. Place above your product grid.
  • [filterkit_search_bar] Shows the smart search bar. Put it in your header, above the shop, or anywhere else.
  • [filterkit_sort] Shows a standalone sort dropdown. Useful when you want sorting placed separately from filters.
  • [filterkit_matrix_filter] Shows the Size × Color matrix grid.
Gutenberg Blocks:

If you use the WordPress block editor, search for “FilterKit” in the block inserter. Four blocks are available:

  • Product Filter Sidebar: Same as the filter shortcode, with a live preview in the editor.
  • Filtered Products Grid: The product grid. Preview updates as you change settings.
  • Active Filter Chips: The active filter tag bar.
  • Smart Product Search: The smart search bar block.

All four blocks work with Full Site Editing (FSE), place them in your theme’s shop template, archive template, or any custom template.

Page Builder Widgets:

If you use Elementor, Divi, Bricks, or another supported page builder, FilterKit Pro has native drag-and-drop widgets for each. Look for “FilterKit” in your builder’s widget panel.