To integrate Merchandising Cloud (formerly Findify) into your shop you'll need to follow the steps listed below:- Generate your BigCommerce credentials
- Disable quick search
- Add the Merchandising Cloud tracking tags
- Add Merchandising Cloud to your search results page
- Add the Merchandising Cloud Javascript to the
<head>
section
Important note: If you're using Stencil you might need extra integration work. Feel free to contact us on YourFriends@Findify.io if you need further guidance.
Step1: Generate BigCommerce credentials
See our dedicated and details guide on how to Generate BigCommerce Credentials. Follow these instructions, and then return here.
Step 2: Disable quick search
- Go to you store settings ([store_url]/manage/settings/store)
- Choose the display tab
- Scroll down until you find Enable Quick Search? section and uncheck the box
Step 3: Add our tracking tags
Adding the tag to product.html
page:
- Go to the
product.html
page ([store_url]/admin/designmode.php?ToDo=editFile&File=product.html&f=a) - Paste the code snippet before
</body>
tag
HTML
<div data-findify-event="view-page" data-findify-item-id="%%GLOBAL_ProductId%%"></div><div data-findify-filter="id" data-findify-filter-value="%%GLOBAL_ProductId%%"></div>
Adding the tag to order.html
page:
- Go to the
order.html
page ([store_url]/admin/designmode.php?ToDo=editFile&File=order.html&f=a) - Paste the code snippet before the
</body>
tag
HTML
<div class="findify_purchase_order" style="display:none"> <span class="order_number">%%GLOBAL_OrderId%%</span></div>
Step 4: Add Merchandising Cloud to your search page
This is the trickiest part as it may vary for different shops.
You need to put the tag at the place where you want the search results to be displayed and you may need to create a new <div>
wrapper around the default BigCommerce element that shows search results.
- Go to the
search.html
page ([store_url]/admin/designmode.php?ToDo=editFile&File=search.html&f=a)
_If you're using faceted search from BigCommerce, please use this search_with_facets.html
page or this link ([store_url]/admin/designmode.php?ToDo=editFile&File=search_with_facets.html&f=a) - Paste
data-findify-attr="findify-search-results"
inside the <div>
tag that wraps %%Panel.SearchPage%%
- If there is no wrapper
<div>
, you should create it yourself and tag it with the tag above
Step 5: Add JS Script to the header
Go to the Integration section of the Merchant Dashboard and copy the script.
- Go to the
Panels/HTMLHead.html
page ([store_url]/admin/designmode.php?ToDo=editFile&File=Panels/HTMLHead.html&f=a) - Paste the script copied from the Merchant Dashboard before the
</head>
tag
After following these steps the search should be live in your store!