Essentials (basic method)
1. First add the existing Nosto embed script from the shop site on to the required blog in the <head> of the blog page.
For example:
<script src=“//connect.nosto.com/include/accountID” async></script>
2. You would then add the URL of the blog into nosto as an additional domain to the Nosto backend. Settings > Account Settings > Other hosts used by the site
3. Place nosto slots (divs) on the relevant post/into the blog page template.
You can find the respective code when you click on the recommendation slot in the Nosto dashboard and scroll to the bottom.
Note: The above method will work if a you want to create a cherry picked rec and drop it into the blog on a post by post basis // see below for some smarter approaches!
The "smarter" Method
Utilising category tagging to surface bestsellers from the related blog topic
Use case: Merchant has decent traffic hitting the blog, and a new post on "Summer Dresses" is getting a lot of hits > so they wish to show bestselling summer dresses within the post.
1. Do the above steps
2. Add nosto category tagging to the blog post (add the "category" the blog is most relevant to) - this tricks nosto into thinking the blog post is actually a category.
IMPORTANT - the formatting of the category tagging must be identical to the source code/in debug toolbar
<div class="nosto_page_type" style="display:none">category</div>
<div class="nosto_category" style="display:none">/clothing/dresses/summer-dresses</div>
3. Create a nosto slot that surfaces Bestsellers > Inclusion Filter: from currently viewed category
4. Place slot into blog post template or HTML markup
5. Every time a new blog post is written they'll need to amend the category tagging only -> as the slot is engineered to render bestsellers from the current category
The "smartest" method
Utilise product tagging to surface related products to the blog post
Note: This method will only work for customers who have a heavily trafficked blogs that are well integrated into the main site
1. Integrate blog as outlined in the "essentials" section
2. Add nosto product tagging below > being sure to replace the example values with the variables from the blog Note - the Price/Image values should be static for these "products"
<div class="nosto_page_type" style="display:none">product</div>
<div class="nosto_product">
<span class="product_id">BLOG12345</span>
<span class="name">Summer Dresses 2018</span>
<span http://www.example.com/blog/summerdresses">class="url">http://www.example.com/blog/summerdresses</span>
<span https://image.example.com/dress.jpg">class="image_url">https://image.example.com/dress.jpg</span>
<span class="availability">InStock</span>
<span class="price">0.00</span>
<span class="price_currency_code">USD</span>
<span class="category">/clothing/dresses/summer-dresses</span>
<span class"tags1">blog-post</span>
</div>
3. Add a blacklist rule to exclude all products with the tags1 value of "Blog-post" > otherwise they'll start popping up in recommendations and other Nosto products (ads, emails, etc.)
4. Create a product-based-cross sell slot
5. Place slot into blog post template or HTML markup
Note: Worth noting that we aren’t able to serve personalised recommendations to users, if your blog is hosted by an external service such as wordpress or similar.
Note: Currently this is not supported using Shopify.