Skip to content

How to Add Facebook Badges in Elementor?

Table Of Content

A Badge is the compact alternative to a wall of review cards. Instead of listing individual reviews it shows one block summarising the rating, with a recommendation line and buttons.

The same Social Reviews widget does both. Switching Type from Reviews to Badge replaces most of the panel.

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.
  • Prerequisite: a Facebook Page, an Access Token for it, and that page’s id for the Page/Place ID field.
  • Prerequisite: your server must be able to make outbound HTTPS requests. Facebook and Google are called server-side while the page renders, not by the visitor’s browser.

Add the badge

  1. Edit the page with Elementor and drag the Social Reviews widget onto it.
  2. In Content > Content, set Type to Badge, then pick one of the three Style pictures.
  3. Set Source to Facebook.
  4. Click Generate Access Token, sign in and choose your page. The token lands in Access Token and the page id in Page/Place Id. You can also paste both in by hand.
  5. Optionally change the badge title in the Facebook Review field. It starts as Facebook Reviews.
Generating the facebook access token for a badge.

Badge Options

Everything the badge says is editable under Content > Badge Options.

SettingWhat it doesDefault
Postfix ContentThe text after the figure.Recommended By
Prefix ContentThe text before it. Only available on Style-1.People
Show RecommendedShows the recommendation line at all.on
Prefix Content TextThe question above the buttons.Would You Recommend
(Single | Multiple) ButtonShows the recommendation buttons.on
First ButtonThe first button’s label.YES
Second ButtonThe second button’s label.NO
Show IconShows the Facebook icon on the badge.on
A facebook badge on the published page.

How It Behaves

  • The badge is one block, not a list. There is no layout, no columns and no filter — those sections only exist when Type is Reviews.
  • It is fetched on your server and cached. The badge has its own Refresh Time under its own Extra Options section, defaulting to 1 day.
  • A badge that cannot connect still draws itself. It keeps the avatars and the Recommended By People wording, and puts a bare HTTP number in the corner with Something Wrong where the rating belongs.
What a badge shows when the credential is missing or wrong.

Limitations

  • A badge that cannot reach its source still draws itself. With a bad Facebook token the badge renders its normal chrome — the avatars and Recommended By People — with a bare 400 in the corner and Something Wrong where the rating belongs. With a bad Google key the provider’s status lands inside the wording, so it reads Recommended By REQUEST_DENIED People. A badge showing a number or Something Wrong means the credential failed.
  • There are two sections called Extra Options. One appears when Type is Reviews and one when it is Badge, and each has its own Refresh Time. Setting one does not set the other.
  • Reviews are fetched on your server, and cached. Nothing is requested from the visitor’s browser, so a source that works on one host can fail on another that blocks outbound requests. Refresh Time (default 1 day) decides how often the request is repeated.
  • The badge field is spelled Page/Place Id here. In the Social Reviews repeater the same field is Page/Place ID. They are different controls in different sections, not a typo on this page.

Not verified

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

  • A wall of real Facebook reviews. This page was checked without ever entering a real access token, API key or place id, so what the finished Facebook 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.
  • The Generate Access Token button. The Facebook login popup, and whether it really fills Access Token and Page/Place ID for you, needs a real Facebook account and was not exercised.
  • The badge with real numbers in it — the rating, the recommendation count, and whether the YES and NO buttons do anything when clicked.
  • Performance, Save Data and Delete All Transient. The cached path was never exercised — what is written here comes from the panel’s own notes and defaults.
  • The Style tab. Only the three content Style presets were rendered; no colour, typography or per-source styling control was exercised.

Troubleshooting

The badge shows a number and Something Wrong

That number is an HTTP status from Facebook, and it means the credential failed. Check Access Token and Page/Place Id in Content > Content.

Most of the panel disappeared

That is expected. Type is set to Badge, so Review Option, Columns Manage, Filter Option and Load More/Lazy Load are all hidden.

I changed Refresh Time but nothing happened

There are two sections called Extra Options, one for each Type. Make sure you changed the one showing while Type is Badge.

Prefix Content is missing

It only exists on Style-1. Switch the badge Style back if you need it.

Related Docs

Related Frequently Asked Questions

Related Docs