chevron-down chevron-right chevron-left close minus plus check dollar facebook twitter linkedin search dots

Inline vs Overlay Search Configuration

At Cludo we don’t believe in a “one size fits all” solution- instead, we believe our customer should have the ability to choose the right search implementation to meet their needs. It’s your website, so let’s do it your way.

Customers migrating to Cludo from the soon-to-be-defunct Google Site Search often wished to use Cludo’s API to develop a search experience similar to what they had with GSS. To deliver an experience that is the best of both worlds, we’ve enabled an inline search option with no API via our easy-to-use search configuration builder. Cludo customers can now use our configurator to style and implement their own inline search, giving them much more control over the styling of their website’s search experience. The best part? It doesn’t use an iframe, creating a seamless experience with the rest of your website.

The question then becomes, now that you can choose to implement Cludo search on your website with either an inline or overlay search display, which one is really right for you? Let’s find out…

Inline vs. Overlay

Inline vs. Overlay Search

With Cludo’s search solution, you are offered the option of two styles of search display: the basic overlay style, or the more detailed inline style that is made to fit your website.

An overlay layout is a standardized search layout that Cludo offers, where the search results appear in a pop-out dialog box over the page where the search field is located. Searches can then be conducted within that box, or the user can exit the box and immediately resume navigation on the page they were previously on.

An inline layout opens a dedicated search page instead, thus redirecting the user from the page where they typed a query into the search field, to a separate search results page.

How they differ

Overlay and inline are very different layout styles, with different use cases. Overlay appears and blocks the content beneath it, preventing you from interacting with the page below the dialog box; whereas inline takes you to a whole new search results page.

As mentioned before, the overlay is Cludo’s basic search display option. It is customizable to suit the style and design of your site, but these customization options are limited. Inline search on the other hand, is built as its own page within your website, thus the elements of its design can be built from the bottom-up and appear seamlessly within your website. With each layout style comes their own set of pros and cons.

Overlay pros

  • User-initiated pop-up that provides rapid interaction
  • Easy set-up with no technical intervention
  • Clean and minimalistic appearance
  • Allows users to drop straight back to original page if they need to

Overlay cons

  • Customization options are limited
  • Design might vary from the rest of the website
  • Page view limited to the extent of the dialog box
  • No option for pagination

Inline pros

  • Search display designed specifically to fit your site’s design and style
  • Dedicated page keeps users focused and immersed in the task at hand
  • Unlimited customization possibilities
  • Whole page dedicated to search results, so view is not limited
  • Option for pagination

Inline cons

  • Can sometimes require developer intervention for seamless design
  • Users are redirected away from the page or tab they were previously on
  • Customization options opens door to poor design choices

Implementation differences

As suggested in the pros and cons above, there can be quite a bit of difference in the implementation of these two layouts. An overlay can be implemented almost immediately with every version of our solution, as it is the most standardized option available for the search display. You can easily customize the pop-up search interface to fit the scheme of your website via your search dashboard, and automatically generate a script to get your site search up and running.

Our easy-to-use search configurator makes the typically-difficult-to-implement custom inline search a snap, but it can require additional work if the design needs to be specially tailored to your website. In these cases, clients have the option to either have their search display designed by their own IT and design team, or in close collaboration with Cludo’s design and development team, who creates a site search page that fits into your site seamlessly.

Which one is right for you?

Overlays are a great tool to enable fast interaction within the page itself. However, it is not the best choice if you require a search display with more elements for interaction, such as facets and filters. Having more elements on the overlay is counterintuitive to their simple, lightweight design meant to facilitate quick searches. For more detailed and in-depth searches, a separate inline page will be more user-friendly.

Also consider how you want your users to browse your search results. Overlay search uses infinite scrolling as pagination, conflicting with its usability as a temporary on-screen element. If you prefer pagination for your search display, it is recommended that you create a separate inline search display to streamline the user flow and retain the context for their actions.

Overall, the decision to use either an inline or overlay layout is entirely up to you and your website’s goals. If you’re having trouble choosing between the two, a Cludo search consultant can always help guide your decision on which one best meets your websites needs, and help get your search up and running quickly and efficiently.

To learn more about implementing Cludo search on your site, reach out to us at info@cludo.com