Skip to content

How to Add a Category Wise Filter in Social Reviews in Elementor?

Table Of Content

When a review wall mixes sources, or covers several parts of your business, a filter lets a visitor narrow it down instead of scrolling through everything.

The Social Reviews widget builds the filter from a label you give each review yourself, so you can group them however makes sense — by source, by service, by location.

For the full settings tour of the Social Reviews widget, see Social Reviews Widget Settings Overview.

Requirement – This widget is a part of The Plus Addons for Elementor Pro, make sure it’s installed & activated to enjoy all its powers.

Before You Start

  • Edition: Pro — Social Reviews ships only in The Plus Addons for Elementor Pro. The widget does not exist in the free plugin at all: no widget file, no CSS and no JavaScript, so there is nothing to fall back to.
  • Prerequisite: Elementor (free) installed and active.
  • Widget to enable: go to The Plus Addons > Widgets, search for Social Reviews and turn its toggle on.
  • No account needed: the Manual source needs no token, no key and no login. It is the one source you can use straight away.
  • Layout: the filter works in Grid and Masonry. It does not exist in Carousel.

Tag the reviews, then switch the filter on

  1. Edit the page with Elementor and drag the Social Reviews widget onto it.
  2. In Content > Content, leave Type on Reviews and set Layout to Grid or Masonry.
  3. Open each item under Social Reviews and type a label into Category (For Filter). Reviews sharing a label end up under the same button, so use the same spelling each time.
  4. Open Content > Filter Option and turn Category Wise Filter on. It is off by default.
  5. Set the rest of the filter’s appearance from the same section.
The source dropdown inside a social reviews row.

Filter Option

SettingWhat it doesDefault
Category Wise FilterSwitches the filter row on.off
All Filter Category TextThe label on the button that clears the filter.All
Category Filter StylePreset look for the buttons.style-1
Filter Hover StylePreset hover effect.style-1
Filter AlignmentPuts the row on the left, in the centre or on the right.Center

The buttons come from what you typed, so if one review says Delivery and another says delivery with a trailing space, you may get two buttons.

How It Behaves

  • The filter row is built from your labels. Six reviews tagged Service or Delivery produced exactly three buttons: All, Service and Delivery.
  • The All button carries a count. With six reviews it showed 6 next to it. The individual category buttons showed no count.
  • Clicking a button filters in place. Clicking Delivery took the wall from six visible cards to the three tagged Delivery, with no page reload.
  • The whole section is skipped in the Carousel layout. With Category Wise Filter switched on and Layout set to Carousel, no filter row was rendered at all.
After clicking delivery, only the three delivery reviews remain.
Filtering the review wall by category.

Limitations

  • Three sections disappear in the Carousel layout. Columns Manage, Filter Option and Load More/Lazy Load are all skipped when Layout is Carousel. The carousel has its own column settings under Style > Carousel.
  • A review with no category is not in any category. Leave Category (For Filter) empty on a row and that review will be in All but under none of the named buttons.
  • Only the All button shows a count. The category buttons do not.
  • Load More and Lazy Load do not currently load anything. On a published page with six manual reviews, Maximum Posts Display at 3 and More Post Loading set to Load More, clicking the button left the count at three, changed the button to Loading… permanently and raised a JavaScript error. Lazy Load likewise never went past the initial count. No credential was involved, so this is not an API problem. Until it is fixed, show every review you want visible.

Not verified

So you know exactly what has and has not been checked:

  • A wall of real Facebook or Google reviews. This page was checked without ever entering a real access token, API key or place id, so what the finished Facebook or Google feed looks like once connected was not observed for this revision. Everything below that does not need a credential was checked on a published page.
  • Comma-separated categories on one row. The field’s placeholder suggests e.g. Category1, Category2, but only single-word labels were used in testing.
  • Category Filter Style, Filter Hover Style and Filter Alignment. Defaults only — no preset was swapped and re-measured.
  • The Style tab. Only the three content Style presets were rendered; no colour, typography or per-source styling control was exercised.

Troubleshooting

The filter row does not appear

Three things to check, in order. Layout must not be Carousel. Category Wise Filter must be on — it is off by default. And at least one review needs a value in Category (For Filter).

I have two buttons that look the same

The labels differ somewhere you cannot see — capitalisation or a trailing space. Make them identical on every row.

A review disappears when I pick any category

That review has no Category (For Filter) value. Give it one, or accept that it only shows under All.

Clicking a button does nothing

The filtering runs in the browser. Check the published page rather than the editor, and look in the browser console for a JavaScript error from another plugin.

Related Docs

Related Frequently Asked Questions

Related Docs