Free Airbnb Review Widgets for Next.js / React

How to Add Airbnb Reviews to Next.js / React

One embed code, pasted into the next/script component.

1. 1

   In app/layout.tsx import Script from next/script and add the BlooTrue loader once inside the body, with strategy set to afterInteractive.

2. 2

   Drop the widget div into any page or component where the reviews should appear.

3. 3

   Change class to className on that div — the snippet is HTML and JSX will not accept class.

4. 4

   Deploy. The loader watches the DOM, so the widget survives client-side navigation too.

A raw <script> tag pasted into a component will not execute, which is what next/script is for — and the snippet's class attribute has to become className or React drops it.

Airbnb Widget on Next.js / React — FAQ

Is the BlooTrue Airbnb review widget free for Next.js / React?

Yes. BlooTrue is completely free to embed Airbnb reviews on Next.js / React. No plugin, no recurring fee, unlimited views. The free plan shows your reviews with BlooTrue branding in the footer; paid plans remove the branding.

How do I install the widget on Next.js / React?

In app/layout.tsx import Script from next/script and add the BlooTrue loader once inside the body, with strategy set to afterInteractive. Drop the widget div into any page or component where the reviews should appear. Change class to className on that div — the snippet is HTML and JSX will not accept class. Deploy. The loader watches the DOM, so the widget survives client-side navigation too.

Anything specific to Next.js / React worth knowing before I embed?

A raw <script> tag pasted into a component will not execute, which is what next/script is for — and the snippet's class attribute has to become className or React drops it.

Where should I place Airbnb reviews on Next.js / React for the biggest lift?

Under the hero on the landing page and beside the pricing CTA — on SaaS and agency sites the proof belongs at the decision point.

Do the reviews stay up to date automatically?

Paid plans auto-sync your Airbnb reviews daily, so the widget always shows your latest 5-star reviews without touching Next.js / React again. The free plan shows the reviews imported at setup.

I manage six Airbnb listings, can one widget cover all of them?

No. Each listing has its own airbnb.com/rooms page with its own reviews and its own rating, and the builder imports one listing per widget. On the free plan you get one widget, so one listing; paid plans remove the one-widget limit and refresh every listing's widget from Airbnb daily.

Why does my Airbnb widget say 4.92 when most of the cards show five stars?

Because the header mirrors the rating Airbnb publishes for the listing, to two decimals, together with its review count, and does no arithmetic of its own on the cards. Free widgets show only 4-star-and-up reviews as cards, so a computed average would drift from Airbnb's figure; keeping Airbnb's number avoids that.

A guest checked out yesterday, when will their Airbnb review show on my site?

Airbnb gives the guest 14 days after checkout to write the review, and it goes live on the listing once both sides have reviewed or the window closes. A paid plan refreshes the widget daily and picks it up next day; a free widget stays as it was on publish day, so yesterday's guest waits until you upgrade.