As you may know, Doofinder released the new Live Layer, including many improvements making a lighter and powerful layer.

Configuration

In your Doofinder admin panel, you can find the Live Layer section in the superior menu. In there, you’ll see two different sub-sections, installations and Layers.

Live Layer

Layers

First, you need to go to Layers to configure the layer you want to show on your site. Click on the Add Layer button.

Choose a descriptive name for your layer, which will help you to link it to the installation:

Choose the layer type between these:

  • Standard: This type shows an initial search, including the latest searches, suggestions (if you have them) and the search results layer.
  • Basic: Includes only the search results layer.

To finish, click Add Layer:

Installation

Once you have created the layer, you must go to the installations menu. Click on Add Installation to give it a descriptive name to identify it later.

Next, include the CSS selector, allowing Doofinder to identify the search box in which Doofinder will be implemented. This selector can be an ID, a name, or a class, written this way:

  • ID: “#your_search_box_id”
  • Name: “input[name=’your_selector_name’]”
  • Class: “.your_class_name”

📌 Note: You can add as many unique selectors as you want, both for desktop and mobile, separated by a comma: #your_search_box_id, input[name=’your_selector_name’], .your_class_name

If you have any trouble finding out which the selector is, please, drop us an email at support@doofinder.com

You can then see it has selected the layer you created earlier. If you have more than one, you can choose which one you can link to this installation.

Finally, you can select the engines you want to include in the installation. You must indicate the language and currency for each one, selecting your main language and currency as default. Click in Create Installation to finish.

Your installation is now complete, and the Live Layer is created and ready to offer a better search experience on your site.

Installation configuration page

By clicking on its name, you can access the configuration page, in which you can see the inputs, the associated engines and the script.

Publishing the script

The script must be published in your HTML code to get doofinder Live Layer working on your site. Here’s how:

If your site is tailor-made, you only need to paste the script in your HTML code, header or footer section. If your site runs any of this CMS, please, check the specifics:

Prestashop

You only need to include the Installation ID in the Search Layer section.

WooCommerce

Copy the entire script in your Installation configuration page and paste it into the Doofinder search plugin, Search section, in Layer Snippet box:

Shopify

You don’t need to do anything else; it’s managed automatically by the module.

If you have any other CMS, please ask directly to our Support Department by dropping an email to support@doofinder.com.

Should you encounter any problems, please contact support@doofinder.com

Last Updated: August 2021