In this video, we show you how to add search to your Framer site with just a few clicks. We also cover how to customize the search experience to make it look and feel like your own.

Adding Search to Your Site

1. Go to the Insert menu and select Interactive.

2. Drag and drop the Search component into your site.

3. Publish your site.

Customizing the Search Experience

• Scope control: You can control which pages on your site are searchable.

• Fonts: You can change the fonts used in the search input and results.

• Colors: You can change the colors of the search input, results, and modal.

• Animations: You can add animations to the search input and results.

• Layout: You can change the layout of the search modal to be a sidebar or a fixed top bar.

Tips

• Use descriptive titles and descriptions for your pages to improve your search results.

• Make sure your search input is easy to find and use.

• Use a consistent design for your search experience.