Nosto’s on-site campaigns consist of two modules: Recommendation Templates and Recommendation Slots. In this article and series we focus on slots.
Nosto on-site product recommendations are based on Html placeholders which are simple Html snippets or “empty divs”, typically placed in the store page’s template files, into a position where the product recommendation is wanted. An example of a placeholder below:
<div class=”nosto_element” id=”nosto-frontpage-1″></div>
The Html-placeholder loads Nosto’s product recommendations, all product details including pictures and also style from Nosto when a visitor loads an actual page on a site. After product recommendation slots are in place on an online store’s page templates, product recommendations can be tested and style tweaked to match perfectly the store’s overall design by enabling the preview-mode.
Product Recommendation Slot hosts all configurations of a single recommendation and also creates a placeholder snippet once created. A recommendation template including web-design is embedded to a recommendation slot. A single recommendation template can be reused and applied on multiple product recommendation slots. An individual product recommendation slot can be used on multiple different page types on your site, but only once per a page load as otherwise Nosto can’t distinguish which one of the slots should be loaded. Also make sure that each product recommendation slot ID is unique. However, due to retain an ability to analyze and track an individual recommendation’s performance, it’s good practice to use an individual recommendation slot only once per a page type. Page itself can include as many different recommendation slots as seen fit.
Default Product Recommendation Setup
Each Nosto account is delivered with a default, best-practice setup of product recommendations and equivalent slots for your convenience. Adjust visibility settings and other configurations freely to build a perfect match for your business and site!
Open Recommendation Slots menu. Nosto accounts are delivered with a default, best-practice setup of recommendation slots for your convenience so no need to surprise since this menu is not empty!
Edit button opens up the recommendation in edit mode while new product recommendations are added by clicking Create a new Recommendation Slot. (Red circle in the screencapture below)
Under slot-menu you can edit recommendation titles and also enable/disable individual recommendation slot from appearing by changing the status of each recommendation under “Visibility”. If a recommendation is set as disabled, it is not displayed publicly. The visibility only controls the setting in Nosto’s service, meaning that equivalent placeholder for the recommendation needs to be present on a target page.
Clicking Edit opens contextual and advanced settings.
Click Save if you make any changes.
Creating a New Product Recommendation
Creating a new recommendation is an easy process. Start by clicking Create a new recommendation which opens up a new menu.
Select Page Type
Selecting the page type defines to which page the recommendation slot will be displayed. When a page type is targeted, relevant algorithms are preconfigured and are available when the recommendation type is defined:
After that, defining the inclusion and exclusion filtering rules according to the business needs.
Learn more about the inclusion and exclusion filtering rules here.
Once you have defined the filtering rules, a template needs to be tied to the recommendation. The template gives the look and feel via an HTML structure and some CSS selectors. Nosto default templates feature built-in easy editor tools such as below. Tools allow quick editing of some of the visual settings i.e. the web-design on the fly, yet every aspect of design is fully customisable by creating new, custom templates, which are then embedded for recommendation as described earlier in this article.
The recommendation title is the title of the recommendation as displayed on the site to the web users.
Note: if you have created your own template, you can select it from the dropdown menu.
Review the settings at the Final Touches stage. Save as draft allows you to activate the product recommendation at a later stage. Save and activate do the obvious.
The main feature is the Html code in the grey box. This is the product recommendation placeholder code or snippet which is positioned on the site to preferred position. Once this has been set, all aspects of appearance and context of the recommendation are controlled from the Nosto admin.