If you'd like to add a search bar to your website, you can use the free Elfsight's search bar widget on your website.

Note: Elfsight will ask you to choose a plan - feel free to go with the free one if you don't need any premium features.


Step 1 - Create a search engine

Create a custom search engine for your website using this Programmable search engine. Follow these tutorials:

Step 2 - Embed the search engine into your website

Once you have the embeddable code, you can insert it into your website using the embed code element.

Step 3 - Add the code to your website settings

After embedding the search bar, it is recommended to add the below code to the website's <head></head> part, as it will allow showing search results in the embed field:

<style>
.grid-embed iframe{
height: 100% !important;
overflow: visible !important;
}
</style>

Paste this code at website Settings > Integrations, in a special field that allows integrating the code in the <head></head> part of your website:

After that, don’t forget to update the website for your changes to be visible in the live version of your website.


Additional resources

You can add various third-party custom widgets to your website either:

Did this answer your question?