Doofinder can be quickly and easily integrated with any web or eCommerce solution.
If you have a custom site that does not use a plugin for its eCommerce site, it is still possible to integrate the Doofinder search into your site. To install it, ensure that you have the following ready:
Pre-requisites to install Doofinder
If you are using a CMS, please visit our plugins section to install Doofinder in your site.
Installation Steps
Video last updated before 2024-12-31
Doofinder can be installed in four easy steps. If you already have a Doofinder account, please log in, otherwise you can register for one.
Click on "Create Store" to begin the installation process.
Step 1: Create a Store
Enter the complete URL of your website, then select "Other" in the field of the platform you are using and click on "Continue".
Step 2: Create a Search Engine
In this step, you will define the configuration of your Search Engine. You can choose a name, a language, a currency and a business sector.
– Name: By default, Doofinder uses the URL entered during the previous step, but you can type a name of your choice. This name will be applied to the Store, the Search Engine and the Layer.
– Language: Select a language from the dropdown menu. Note that the language code selected must match the source HTML language code. If the HTML of your website is in lang="en", then you must select "en" only and not "en-UK".
– Currency: Choose a currency.
– Sector: Select the sector that applies to your Store.
Once done, click on "Continue".
Step 3: Index a feed
It is time to index your feed. You can choose to use a file or an API (for this example, we will use the available sample feed).
– File Feed: Enter your feed URL or drop the CSV, XML file.
– API: Visit our API documentation.
Now you need to enter the search input CSS selector to indicate where on the website you want to trigger the Layer when the customer clicks.
If you want to learn how to choose the CSS selector, read this article.
Then click "Create".
Step 4: Generate your script
You are almost done!
We have consolidated the management of all products into a single installation script, enabling quicker and easier implementation of new features, services, and updates in the future.
The Doofinder script is the javascript code Doofinder will provide once you’ve created an account while signing in as a new user. You can always find the Doofinder Script on your Admin Panel > Configuration > Store Settings > General. Scroll down to Installation Script and you’ll find it displayed.
Default Script
This is the single script with minimum configuration (store and zone):
<script src="https://eu1-config.doofinder.com/2.x/store_id_here.js" async></script>
This script contains:
- Zone “eu1-config.doofinder.com”
Zone must be configured depending on the EU zone, US zone or AP Zone (your online store zone). “eu1” if your zone is Europe, “us1” if your zone is America, "ap1" if your zone is Asia.
- Store ID: is your Store ID code followed by “.js”.
How To Update Your Script
To update your script read the Update Script documentation for a full step-by-step guide.
If you are using one of our plugins, in the same documentation you will find direct links to the instructions for each platform.
Why Does The Doofinder Script Change
To simplify your experience, we have introduced a unified installation script that allows you to manage all Doofinder products through a single line of code. This streamlined setup ensures faster deployment of new features, updates, and services as they become available.
This new script is a lightweight JavaScript snippet you will need to place on your site. If you have been using Doofinder prior to this change and are now activating one of our newer solutions, you will need to update the script for them to work.
Integrate Doofinder Using GTM
Integrating Doofinder using the Google Tag Manager (GTM) allows you to manage your script without touching your site's HTML code.
To integrate it this way, follow these steps:
- Create your GTM account or log in if you already have one.
- Select the workspace where you're going to add the new script.
- Select "Add a new tag" to configure Doofinder's script.
- On the next screen, provide the following:
- Once done, press "Save" and your HTML tag will be created.
- Back in your GTM dashboard, press the "Submit" button in the top right corner.
- Select "Publish and Create Version", then provide a relevant version name and description for the records, choose the environment where you want to publish the changes and press the "Publish" button in the top right corner.
- You will be able to see the details of the latest published version from the dashboard. The Doofinder Layer should be working as soon as the information reflects the latest version.
– A name for the new tag, for instance: "Live Layer Script".
– Inside the tag configuration, ensure that the tag type is Custom HTML and paste your script for Doofinder inside the HTML editor, including the surrounding script tags.
The term 'const' does not work in GTM, so it is necessary to modify the beginning of the Live Layer script as follows:
const dfLayerOptions => var dfLayerOptions
See the image below.
– Then under Triggering, choose when the script must be activated. Note that the recommended option is All Pages. This way, Doofinder will be available on all pages.
