When customers leave a review on the Fera hosted review page, you can show them your own content once they finish. Thank them by name, offer a discount for their next order, or ask happy customers to review you on Google too.
You add this content as two HTML snippets: one at the top of the page and one below the review area. This is an advanced feature, so you need to know some HTML, or work with a developer who does.
Before You Start
Your store uses the hosted review page. Snippets only show on the Fera hosted page, not on a review form embedded in your store. See How to Set Up a Fera Hosted Review Page.
Your plan includes Advanced customization. If it does not, the editors are locked. Hover the lock icon next to either editor and click Upgrade.
How to Add a Snippet
Go to Configuration and navigate to Submissions > Submission Settings.
Open the Hosted Page tab. It has two editors:
Header HTML - shown at the top of the page, under your logo.
Lower Body HTML - shown below the review area.
Paste your HTML into one or both editors and click Save. Leave an editor empty if you don't need it. Each snippet can be up to 50,000 characters.
📝 Note: If the editors are locked and a yellow message shows at the top of the tab, your store uses the embedded form. Choose Use a hosted Fera Page in the Submission Form tab, then come back to Hosted Page.
When Customers See Your Snippets
Snippets appear only after a customer finishes their review. Fera shows the review summary for 5 seconds, then closes it and shows your snippets. If the customer closes the summary sooner, the snippets show right away.
Important📢: Without snippets, Fera sends customers back to your store 5 seconds after they submit. With snippets, customers stay on the page so they can see them. Add a link back to your store in your snippet. This is the step people miss most often.
Each snippet runs in its own frame, apart from the rest of the page:
Links open in a new tab.
Content is centered. Add your own CSS inside the snippet to change that.
The frame grows to fit your content, up to 4,000 pixels tall.
The hosted page's styles and scripts don't reach the snippet. Load any library you need inside the snippet, before the code that uses it.
Forms can't be submitted, and pop-up alerts, cookies and local storage are blocked. To collect email addresses, link to a signup page instead.
Use What the Customer Submitted
Fera passes your snippet everything the customer submitted on this visit, so there is a lot to build with. Scripts in a snippet read it from window.feraHostedPage. After a customer reviews a product and your store, it looks like this:
window.feraHostedPage = {
reviews: [
{
is_new_review: true, // false if they updated an earlier review
rating: 5,
heading: "Love it!",
body: "Fits perfectly and arrived fast.",
subject: "product", // "store" for a review of your store
product: {
platform_product_id: "8123456789012",
name: "Classic Tee",
url: "https://example-store.com/products/classic-tee",
thumbnail_url: "https://example-store.com/images/classic-tee.jpg"
}
},
{
is_new_review: true,
rating: 4,
heading: "Great shop",
body: "Easy checkout.",
subject: "store",
product: null // always null for a store review
}
],
// "Anonymous" (in your store's language) if the customer stays
// anonymous or gave no name, "" if Fera doesn't know the customer
customer: { display_name: "John D." },
store: {
name: "Example Store",
url: "https://example-store.com"
}
}
Plan for blanks: product is null for a store review, and the customer's name can be empty.
For example, this Lower Body HTML snippet thanks the customer, asks customers who gave 5 stars to review you on Google, and links back to your store. Replace YOUR-GOOGLE-REVIEW-LINK with your own link.
<p id="thanks">Thanks for your review!</p>
<p><a id="google" href="YOUR-GOOGLE-REVIEW-LINK" hidden>Review us on Google too</a></p>
<p><a id="back">Back to the store</a></p>
<script>
var page = window.feraHostedPage;
var customerName = page.customer.display_name;
if (customerName) document.getElementById('thanks').textContent = 'Thanks for your review, ' + customerName + '!';
var happy = page.reviews.some(function (review) { return review.rating === 5; });
if (happy) document.getElementById('google').hidden = false;
var back = document.getElementById('back');
back.href = page.store.url;
back.textContent = 'Back to ' + page.store.name;
</script>
Test Your Snippets
Snippets don't show on the settings page. To see them, send yourself a test review request and leave a review from the email. With the hosted page turned on, the email opens it. See Submit a test review.
Troubleshooting
I don't see the Hosted Page tab.
Contact our support team and we'll check your store.
The editors are locked.
Your store uses the embedded form, or your plan doesn't include Advanced customization. If a yellow message shows at the top of the tab, choose Use a hosted Fera Page in the Submission Form tab. If not, hover the lock icon and click Upgrade.
My snippet doesn't show.
Snippets appear only after a review is submitted, not when the page first opens. If your store stops using the hosted page, or your plan no longer includes Advanced customization, Fera stops showing snippets and sends customers back to your store as before.
My script says jQuery (or another library) is not defined.
Snippets can't use the hosted page's libraries. Load the library inside the snippet first, for example <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>, then add your code below it.
My signup form or third-party widget doesn't work.
The snippet's frame blocks form submissions, pop-up alerts, cookies and local storage, and many widgets need those. Link to the form or widget on its own page instead.
Customers don't go back to my store after their review.
This is expected when you have snippets, so customers can see them. Add a link to your store, like the one in the example above.
I get an error when I save.
Each snippet can be up to 50,000 characters. Make it shorter, or load large scripts from a URL with <script src="...">.