Page Builder Widgets

FilterX deeply integrates with the most popular WordPress page builders. Instead of placing messy shortcodes everywhere, you can design your shops and directories visually using native widgets and blocks.

EL
Elementor Integration

FilterX provides two extremely powerful native widgets in the Elementor panel. They are completely modular, meaning you can place your facets in a totally different section of the page (like a sticky sidebar) from your results grid.

1. FilterX Grid Widget

Drop this widget where you want the actual results (products/posts) to appear.

Controls
  • • Select saved Grid Template
  • • Override Items Per Page
  • • Override Columns (Desktop/Tablet/Mobile)

2. FilterX Facets Widget

Drop this widget in your sidebar or top bar to render the actual filter controls.

Controls
  • Target Grid: Select which grid on the page this facet should control.
  • • Select specific Facets to display (or show all assigned to the grid).

GB
Gutenberg (Block Editor)

If you prefer the Native WordPress Block Editor (or are using Full Site Editing/FSE themes), FilterX has you covered with native React blocks that render live, real-time previews right inside the editor.

Grid Block

Type /filterx grid to insert the grid block. The Inspector sidebar lets you choose your layout, and the block actually loads your real live products in the backend so you can see exactly how it looks before hitting Publish.

// How it saves in the database<!-- wp:filterx/grid {
"gridId": 14,
"columns": 4
} /-->

Facets Block

Type /filterx facets to insert the facet controls. You can select exactly which facets (e.g., Price, Category, Color) to display in this specific block.

// Multiple facet blocks supported<!-- wp:filterx/facets {
"facetIds": [3, 7]
} /-->

What about other builders?

If you are using Divi, Oxygen, Beaver Builder, or any other layout tool, you can simply use FilterX's standard shortcodes which are highly optimized and work absolutely anywhere.

View Shortcode Documentation →