ProveSource supports embedding your social proof in your website pages and designing them as you see fit.
This feature is especially useful for some use-cases, for example showing recent sales of a product in a Shopify product page just under the product price.
This can be done by adding an HTML code to your page template, for example:
<div class="provesrc-inline"
data-notification="shopify sales"
data-product-id="1319085768777"
data-animation="slide-left"
data-icon="trophy"
data-template="{{count}} people bought this product in the last {{timeText}} ({{timeAgo}})">
</div>
The ProveSource code snippet must be loaded in the page
Required attributes
data-notification="notification name"
OR
data-notification-id="id"
Attribute options:
data-product-id: the specific ID of events you want to show, e.g. specific product sale.
data-animation: fade, slide-left, slide-right, slide-up, slide-down
data-icon: fire, trophy, thumbsup, check, star, heart, rocket, bell, sparkles, gift
data-template: specify the text template for the social proof, read more about the available variables here, if no template is set the Notification "Message" will be used.
Shopify embed example
Go to Shopify Admin → Online Store → Themes → [Your current theme] → Actions → Edit Code
Select of these files: sections/main-product.liquid or sections/product-information.liquid and add the following HTML code where you'd like to show your social proof (be sure to update the data-notification:
<div class="provesrc-inline" data-notification="Shopify Sales" data-product-id="{{ product.id }}"></div>