JFY client-side configuration
Rendering
The easiest way to integrate JFY features is to use the following example code every place where you want there to be a JFY link:
Example JFY link
<a href="" class="jfy-link">Just For You</a> <script type="text/javascript"> $('.jfy-link').attr('href', BR.mobile.getJfyUrl("jfy,dynamic_categories")); </script>
The BR.mobile.getJfyURL() method retrieves the URL of the personalized items page that you want to show to your customers.
Custom rendering
Alternately, you can render results yourself, using the BR.pers.getJusyForYou(options, callback) function. The following code snippet demonstrates the simplest template implementation:
Example of simplest rendering implementation
var personalizationConfig = { account_id: <Bloomreach Provided Account ID>, domain_key: "merchant_com", environment: "prod", } function renderPersonalizationResults (response) { // render logic for data coming from JFY plugin } Br.pers.getJustForYou(personalizationConfig, renderPersonalizationResults);
Customer rendering parameters
Parameter Name |
Required |
Type |
Description |
Example |
---|---|---|---|---|
accountId | Required | integer |
The ID of the account sending the request. Your Bloomreach integration team provides this ID to you. |
<Bloomreach Provided Account ID> |
domainKey | Required | string | The ID of the domain receiving the request. Your Bloomreach integration team provides this key to you. | debshops_com |
environment | Required | string (enum) |
The string that determines which server to retrieve data from. Use one of the following values:
Don't forget to use the single quotes ( ' ) around the string; they aren't optional. |
'staging' |
The following code snippet is an example of a complex template implementation:
Example of complex rendering implementation
// Default JFY configuration var jfyConfig = { accountId: <Bloomreach Provided Account ID>, authKey: '', domainKey: 'example_com', environment: 'standalone' }; BR.pers.getJustForYou(jfyConfig, showJfy); /* Callback function to show JFY results */ function showJfy(results, successFlag, errorMessage) { if (!successFlag) { console.log('Error: ', errorMessage); return; } console.log('jfyResults', results); $('#jfy-title').html(results.title); var jfyContainer = $('#jfy-container'); jfyContainer.html(''); var productGrid = $('<div></div>', {'class': 'productgridpage'}); jfyContainer.append($('<div></div>', {'class': 'productgrid'}).append(productGrid)); for (var i = 0; i < results.products.length; i++) { renderProduct(results.products[i], productGrid, results.brTrkData) } } /* Render an individual product */ function renderProduct(product, productGrid, brTrkData) { var productCell = $([ '<a href="', product.url, '" onclick="return false;">', '<div class="product">', '<img src="', product.thumb_image, '" />', '<span class="name">', product.title, '</span>', '<div class="pricing">', '<div class="price">$', product.price_range && product.price_range.length ? product.price_range[0].toFixed(2) + '-$' + product.price_range[1].toFixed(2) : product.price.toFixed(2), '</div>', '</div>', '<div class="clear"></div>', '</div>', '</a>', ].join('')); productCell.data('brTrkData', brTrkData); productGrid.append(productCell); }
Blocklist
You can specify excluded categories from Dynamic Categories. For example, you might decide to exclude sexual wellness categories from Dynamic Categories. Putting these categories on a blocklist prevents them from being automatically suggested when a user browses for other drugstore items. To block items from Product Recommendations, you need to contact your Bloomreach Technical Manager.