Astrina review widget setup step by step

A review widget does one job well: it puts customer reviews on a page where visitors can see them without leaving the site. That sounds simple, and it is. A homepage can use it to build trust quickly; a product page can use it to answer the “Is this real?” question before a buyer scrolls away.

The reason people add a review widget is usually practical, not decorative. A small agency might want proof near a pricing block, while an ecommerce team might want the review widget beside a featured product. One page. One message. Less doubt.

This guide walks through the Astrina review widget setup step by step, with the widget only. The broader site script is covered elsewhere, so here we stay on the page element itself and the decisions that affect how it looks, loads, and gets published.

1. What the Astrina review widget is and when to use it

The Astrina review widget is a page block that displays selected reviews in a format you can place on a site. It can sit on a homepage, a testimonial page, or a product page. If your goal is to show social proof at the point of decision, the review widget fits that job better than a generic quote section.

Use it when the page already has a clear next step. A visitor reading service details, comparing prices, or deciding between two plans is already in a buying mindset. A review widget helps there because it gives context fast, and fast matters.

Do not add it just because the site looks empty. That creates clutter. A review widget needs a reason to exist on the page, such as trust near a checkout button or evidence beside a lead form.

For teams that already care about page-level structure, the review widget is one more content element to place deliberately. If you also manage multiple client sites, you may find every client site in one dashboard useful for keeping setup work organized across projects.

2. Find the review widget in Astrina and open the setup flow

Start in your Astrina account. Look for the section that lists widgets or page components, then select the review widget. The exact label may vary by account layout, but the goal is the same: open the widget setup flow, not the general site settings.

If you manage a live site, use the account that owns the page where the widget will appear. That avoids the common “wrong workspace” problem, which usually shows up later when the preview looks empty. Wasteful. Easy to miss.

Once you open the review widget setup, you should see the options tied to this block only. Think format, content source, and embed code. You are not installing tracking here. You are preparing a widget.

Some teams like to check the account menu first, then the widget list, then the page target. Three clicks. Less confusion. If you need help with account access or plan limits, the astrina page can give the current details.

3. Choose the right review widget format for your page

Pick the format before you embed reviews widget on website. That order matters because a wide carousel, a compact sidebar, and a full-width review block all change the page layout in different ways. A homepage often needs a wider display. A product page may need a tighter one.

For a testimonials page, a denser layout usually works because visitors are already in a reading mode. For a landing page, the review widget should stay near the main call to action and not push the button too far down. One section can carry the point if it is positioned well.

Consider the amount of space on the page. A narrow column leaves little room for long customer names or multi-line comments. A full-width area can handle more detail, but only if the rest of the page gives it room. If the review widget feels squeezed, the page will look cramped, and no one likes that.

Think in page types, not just visuals. Homepage, product page, and testimonials page each give the review widget a different job. A homepage widget may introduce trust; a product page widget may close hesitation; a testimonials page widget may simply gather proof in one place.

4. Copy the embed code for the review widget

After the format is set, go to the embed or code section for the review widget. This is the handoff point. You copy the code that belongs to that widget and only that widget. Not the general tracking script. Not a site-wide snippet from another setup guide.

Read the code box before copying. Some widget setups include a short container plus a script reference; others give you one block to paste as-is. Either way, the code should match the widget format you chose in the previous step. If those two do not match, the preview can break or show the wrong layout.

Keep the copied code in a plain text file or your CMS notes. That sounds minor. It saves time later. The third person who touches the page will not have to hunt through old chat messages.

If your site team uses APIs for custom pages or automation, Astrina’s astrina documentation may help with technical details. For most pages, though, the widget code is still the part that matters most.

5. Embed reviews widget on website: place it in the right page section

Now paste the widget code into the exact page area where you want the review widget to appear. A common mistake is placing it at the bottom of the page because that feels safe. Safe is not always good. If the page sells a service, the review widget often belongs closer to the offer.

For a homepage, place it below the main headline or near a featured benefits section. For a product page, put it beside the price, the main image, or the purchase button area. For a testimonials page, position it under the intro text so the page opens with context and then shows proof.

The layout matters as much as the code. If your CMS uses blocks, choose the block that matches the page width. If your page builder uses custom HTML, paste the code into the correct component and not into a footer field that appears on every page. That mistake happens more often than teams admit.

If you already compare page tools and site structure choices, the astrina page can help if you are balancing reviews with other page features. Keep the widget where a visitor naturally pauses. That is the real aim.

6. Preview the widget and check that reviews display correctly

Use preview before publishing. Open the page in draft mode, then check whether the review widget renders, whether the text is readable, and whether the spacing fits the surrounding content. One broken margin can make a page look unfinished.

Look at three things in preview: the review content itself, the visual fit, and the loading behavior. If reviews appear after a delay, the section should still feel intentional. If a review is cut off, adjust the format or the container width. If the widget is empty, return to the setup and confirm the content source.

Preview on desktop first, then on mobile. A widget that looks fine on a wide screen can become too tall on a phone. That is not a theory. It happens when long review text meets a narrow screen and the block stretches past the fold.

Take one extra minute for spacing. The widget should not crowd the next section, and it should not float awkwardly above a gap. That kind of detail decides whether the page feels finished.

7. Publish the page and test the live review widget

Publish only after the preview looks right. Then open the live page in a fresh tab and check the review widget again. A live check matters because draft mode can hide caching or permission problems that show up only after publishing.

Click the page as if you were a visitor. Does the review widget appear where you placed it? Do the reviews load quickly enough? Does the block still match the rest of the page once the live CSS and scripts are active? These three checks catch most issues before a customer does.

If the page uses a custom header or a delayed-loading content area, test the widget there too. A block that works on one template can fail on another. Small difference. Real consequence.

Once the live page passes, keep the page open for one more refresh. If the review widget remains stable after the second load, you are in much better shape than a first glance suggests. The extra refresh is boring, and useful.

8. Common review widget setup issues and how to fix them

If the review widget does not appear, start with placement. Many problems come from pasting the code into the wrong block or into a page area that is hidden on that template. Check the section first, not the styling.

If the widget appears but looks broken, the most common cause is a mismatch between the chosen format and the container size. A full-width review widget inside a narrow column will behave badly. Resize the block or choose a smaller format. That fix usually takes minutes, not hours.

If the widget loads no reviews, confirm that the selected source has published reviews attached to it. A preview can look empty when the content source is blank, filtered too tightly, or connected to the wrong account. Those three mistakes are annoyingly common.

If the widget appears on desktop but not on mobile, check whether the mobile view hides the block, collapses the column, or clips the code container. A page builder can do that without warning. One screen shows the widget. The other does not.

If your team needs a broader plan for where this widget fits across several pages, the article on how to set up real-time traffic can help with page measurement choices. And if you are building a larger content system, astrina has more guides for related setup work.

The last thing to check is consistency. A review widget should look like part of the page, not a borrowed object dropped on top. If the font, spacing, or alignment feels off by even 1 step, go back and adjust the container before you call it done.