You can combine two of the most popular layers to generate a more attractive design for your users. We are talking about the Floating layer combined with the Embedded layer.
This way, when starting a search, the floating layer will appear first and when the user hits enter, the layer will be embedded in your web page integrating your design.
- Initial search:
- After hitting enter:
-
First, create a floating layer. To learn how to create a layer, read the article 'Create Layer'.
-
Then, go to Layers > General Settings and enable the 'Embedded Results Screen' button.
-
Now, use a CSS selector to indicate the insertion point on your page to contain the embedded search results. To learn how to choose a CSS selector, read this article.
-
Remember to save the changes.
Once the layer is created, you need to go to Store Settings > Configuration > Search Layers and select the layer created. Then, save.