A step by step guide on how to connect your Squarespace store with your REVIEWS.io account.
Requirements
Available on all REVIEWS.io plans
In Squarespace you need to be on the Advanced Commerce Plan
Navigation
Log into your REVIEWS.io account
Navigate to Integrations
Navigate to Squarespace.
Integration Instructions
From the Squarespace integration page, select 'Authenticate with Squarespace',
All all permissions REVIEWS.io requires in your account by selecting 'Allow'.
You will then be notified that your Squarespace store is integrated successfully, as per below:
Installing Product Review Widget
Step 1. Open Settings
Open your website on Squarespace and in the menu, select Settings
Step 2. Advanced Settings
Now click to view the Advanced Settings
Step 3. Code Injection
Now click to view the Code Injection page.
Step 4. Add Footer Code
Within the Footer block, add the following (please note, you are best to get this code from your Integration Page directly, as this will be specific to your store);
<script src="https://widget.reviews.co.uk/rating-snippet/dist.js"></script>
<script src="https://widget.reviews.co.uk/polaris/build.js"></script>
<link rel="stylesheet" href="https://widget.reviews.co.uk/rating-snippet/dist.css" />
<style>.ruk_rating_snippet .ruk-rating-snippet-count { font-family: inherit }</style>
<script>
var urlKey, skuTitle, ratingBlocks, beforeReviewsWidget, starColor;
renderReviewsRatingStars = function() {
ratingSnippet("ruk_rating_snippet", {
store: urlKey,
color: starColor,
linebreak: false,
usePolaris: true,
text: "Reviews",
customLookupSkuFallback: true,
useCustomLookup: true
});
};
renderReviewsCombinedWidget = function() {
var product_sku = alphaWithNoVowels(skuTitle.first().text());
if ($('#ReviewsCombinedWidget').length) {
new ReviewsWidget('#ReviewsCombinedWidget', {
store: urlKey,
widget: 'polaris',
options: {
types: 'product_review',
per_page: 5,
product_review: {
lookup: product_sku,
hide_if_no_results: false,
},
header: {
enable_summary: true,
enable_ratings: true,
enable_attributes: true,
enable_image_gallery: true,
enable_percent_recommended: false,
enable_write_review: true,
enable_ask_question: true,
overall_rating_style: 'outof5',
image_thumbnail_size: 'large',
enable_sub_header: true,
},
filtering: {
enable: true,
enable_text_search: true,
enable_overall_rating_filter: true,
enable_ratings_filters: true,
enable_attributes_filters: false,
enable_sorting: true,
},
reviews: {
enable_share: true,
enable_helpful_vote: true,
enable_helpful_display: true,
enable_report: true,
enable_date: true,
enable_ratings: true,
enable_images: true,
image_thumbnail_size: 'large',
enable_attributes: true,
enable_verified_badge: true,
enable_avatar: true,
enable_reviewer_name: true,
enable_product_name: true,
enable_reviewer_address: true,
reviewer_address_format: 'country',
enable_reviewer_recommends: true,
},
avatars: {
enable_gravatar: true,
gravatar_fallback: 'identicon'
},
},
styles: {
'--base-font-size': '16px',
'--common-button-font-family': 'inherit',
'--common-button-font-size': '16px',
'--common-button-font-weight': '500',
'--common-button-letter-spacing': '0',
'--common-button-text-transform': 'none',
'--common-button-vertical-padding': '10px',
'--common-button-horizontal-padding': '20px',
'--common-button-border-width': '2px',
'--common-button-border-radius': '0px',
'--primary-button-bg-color': '#0E1311',
'--primary-button-border-color': '#0E1311',
'--primary-button-text-color': '#ffffff',
'--secondary-button-bg-color': 'transparent',
'--secondary-button-border-color': '#0E1311',
'--secondary-button-text-color': '#0E1311',
'--common-star-color': starColor,
'--common-star-disabled-color': 'rgba(0,0,0,0.25)',
'--medium-star-size': '22px',
'--small-star-size': '19px',
'--heading-text-color': '#0E1311',
'--heading-text-font-weight': '600',
'--heading-text-font-family': 'inherit',
'--heading-text-line-height': '1.4',
'--heading-text-letter-spacing': '0',
'--heading-text-transform': 'none',
'--body-text-color': '#0E1311',
'--body-text-font-weight': '400',
'--body-text-font-family': 'inherit',
'--body-text-line-height': '1.4',
'--body-text-letter-spacing': '0',
'--body-text-transform': 'none',
'--inputfield-text-font-family': 'inherit',
'--input-text-font-size': '14px',
'--inputfield-text-font-weight': '400',
'--inputfield-text-color': '#0E1311',
'--inputfield-border-color': 'rgba(0,0,0,0.2)',
'--inputfield-background-color': 'transparent',
'--inputfield-border-width': '1px',
'--inputfield-border-radius': '0px',
'--common-border-color': 'rgba(0,0,0,0.15)',
'--common-border-width': '1px',
'--common-sidebar-width': '190px',
'--slider-indicator-bg-color': 'rgba(0,0,0,0.1)',
'--slider-indicator-button-color': '#0E1311',
'--slider-indicator-width': '190px',
'--badge-icon-color': '#0E1311',
'--badge-icon-font-size': 'inherit',
'--badge-text-color': '#0E1311',
'--badge-text-font-size': 'inherit',
'--badge-text-letter-spacing': 'inherit',
'--badge-text-transform': 'inherit',
'--author-font-size': 'inherit',
'--author-text-transform': 'none',
'--avatar-thumbnail-size': '60px',
'--avatar-thumbnail-border-radius': '100px',
'--avatar-thumbnail-text-color': '#0E1311',
'--avatar-thumbnail-bg-color': 'rgba(0,0,0,0.1)',
'--photo-video-thumbnail-size': '80px',
'--photo-video-thumbnail-border-radius': '0px',
'--mediaslider-scroll-button-icon-color': '#0E1311',
'--mediaslider-scroll-button-bg-color': 'rgba(255, 255, 255, 0.85)',
'--mediaslider-overlay-text-color': '#ffffff',
'--mediaslider-overlay-bg-color': 'rgba(0, 0, 0, 0.8))',
'--mediaslider-item-size': '110px',
'--pagination-tab-text-color': '#0E1311',
'--pagination-tab-text-transform': 'none',
'--pagination-tab-text-letter-spacing': '0',
'--pagination-tab-text-font-size': '16px',
'--pagination-tab-text-font-weight': '600',
'--pagination-tab-active-text-color': '#0E1311',
'--pagination-tab-active-text-font-weight': '600',
'--pagination-tab-active-border-color': '#0E1311',
'--pagination-tab-border-width': '3px',
},
});
}
}
alphaWithNoVowels = function(string) {
return string.replace(/[^b-df-hj-np-tv-z]/gi, '').substr(0, 20);
};
attachProductRatingBlocks = function() {
urlKey = 'my-company';
starColor = '#f47e27';
skuTitle = jQuery('.ProductItem-details-title');
ratingBlocks = jQuery('.ProductItem-details-title, .grid-title, .ProductList-title, .summary-title-link');
beforeReviewsWidget = jQuery('.ProductItem-additional');
if (skuTitle !== undefined) {
ratingBlocks.each(function() {
if (!jQuery(this).hasClass('mobile')) {
var product_id = alphaWithNoVowels(jQuery(this).text());
jQuery('<div ' + (jQuery(this).is("a") || jQuery(this).is("div") ? ' style="text-align: center" ' : '') + ' class="ruk_rating_snippet" data-sku="' + product_id + '"></div>').insertAfter(jQuery(this));
}
});
}
jQuery('#ReviewsCombinedWidget').remove();
if (beforeReviewsWidget.length) {
beforeReviewsWidget.append('<div id="ReviewsCombinedWidget"></div>');
}
setTimeout(function() {
renderReviewsRatingStars();
renderReviewsCombinedWidget();
}, 400);
}
if (typeof window.jQuery === "undefined") {
var head = document.getElementsByTagName("head")[0];
var script = document.createElement('script');
script.onload = function() {
attachProductRatingBlocks();
}
script.type = 'text/javascript';
script.src = 'https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js';
head.appendChild(script);
} else if (typeof window.jQuery === "function") {
attachProductRatingBlocks();
}
</script>
Your product reviews will now appear directly for your products as a rating snippet, and Polaris widget on your product pages.