Quick find

Use Webflow's search bar to speed up your workflow and boost your efficiency as you create your Webflow projects.

This video features an old UI. Updated version coming soon!
This video features an old UI. Updated version coming soon!

In this lesson:

  1. Launch quick find
  2. Customize quick find settings
  3. Type in your query
  4. Browse the results
  5. Choose your action

Quick find is a powerful search bar in the Designer that will speed up your workflow and boost your efficiency as you build in Webflow.

With a few keyboard strokes or a click of a mouse, quick find lets you:

  • Add elements onto the canvas without the need to open the elements panel
  • Add or edit a symbol without opening the add panel → symbols panel
  • Find an asset and add it onto the canvas or access its settings without opening the assets panel
  • Convert links to div blocks or text blocks and vice versa
  • Select on-page elements (including classes and symbols) on the current page without the need to scroll through the canvas or the navigator to find it
  • Create a new page, go to a specific page or a specific Collection item detail page without having to go through many steps to find and open that page.
  • Open a Collection in the Collection manager to modify your collection items just by pressing enter.

Launch quick find

You can launch quick find with Command + E (on Mac) or Control + E (on Windows).

You can also launch quick find with Command + K on Mac or Control + K (on Windows).

Customize quick find settings

By default, the finder excludes some of the actions mentioned above. You can include or remove any of the default actions in the finder settings.

To access the finder settings:

  1. Hover over the finder search bar
  2. Click the settings icon

Once you've customized your finder, click inside the finder to start searching.

Type in your query

Your query can be any word from classes and page names. Or, your query can be specific, like the name of:

  • An element (slider, map, button, etc.)
  • An asset or the extension of an asset
  • A page
  • A collection page (like the name of a blog post)

You’ll see the results in the all results tab.

Need to know: Quick find will show you the top 50 results. Make sure to choose the right query while searching for the item you’re looking for.

Browse the results

When you use quick find, the results will appear under the all results tab. They'll also be filtered and listed under separate tabs based on their type.

Again, you can customize the finder to include or exclude any of these content.

Shortcut keys: You can select any result using the up and down arrow keys. You can also press Tab and Shift + Tab to quickly move between results.

Choose your action

Now, let's use these results to make our workflow faster. We'll cover:

Adding items onto the canvas

You can add new items onto the canvas by searching for the type of element or the symbol or asset name. Then, add the item in one of the following ways:

  1. Select the result using the keyboard and press Enter
  2. Click the result
  3. Click and drag the result anywhere on the canvas or in the Navigator
Good to know: Adding items using the first two methods will drop the element next to an inline element, or under a block element. To learn more, check out the elements panel guide.

Adding symbols

If you hover over a symbol instance in the search result, you’ll be able to click the edit icon to rename the symbol.

Adding images

Search for words like png, doc, jpeg to see a list of those types of assets.

Pro tip: You can adjust your finder settings to streamline your current process. For example, when searching for assets and symbols, you can hide other actions to avoid the clutter in all results. This way, your results will only show the type of content and actions that you want to find for your current task.

Creating an entire layout using only quick find

You can create the layout of a whole section using only your keyboard with quick find.

Use quick find to locate and add an element onto the canvas.

To apply classes as you go:

  1. Press Command + Enter (on Mac) or Control + Enter (on Windows)
  2. Type the class name and press Enter
  3. Repeat to add as many elements as you need to lay out your page

Selecting elements and symbols on the canvas

You can also find and select elements and symbols on the current page. To easily identify on-page elements, go to the on-page elements tab.

Once you locate the element you’re looking for, use your keyboard’s arrow keys or your mouse to select the item in the results panel. Now, that item will be selected on the canvas. If the item is way down the page, the canvas will scroll down to show you the selected element.

Pro tip: If you want to select a class to edit its styling, search for the class name and select the element. Then, if the style panel isn’t open on the right, press S on your keyboard to access it.

Converting elements to other types of elements

You can select a link element (a link block, text link, or button) on the canvas and type "convert to" in quick find to convert it to a different type of link or into a Div block or Text block. You can do the opposite as well and convert div blocks or text blocks to links using the same method:

  1. Select the element on the canvas
  2. Launch quick find
  3. Type in "convert to"
  4. Choose the option you want from the list

Going to specific pages

You can use quick find to open any page in your project — any static page, utility page, or collection item detail page.

Let's say you’re looking for a specific blog post page. You'll have to:

  1. Open the pages panel
  2. Go to the collection page template
  3. Scroll through hundreds of blog posts in the dropdown list to locate and open that page

With quick find, you only need to type the name of the page in the quick find bar and press enter to go to that blog post page.

Pro tip: Search for the word "template" and go to the pages tab to see all the collection template pages in your project

You can also create a new static page from within the finder, type "new page" and choose the "create new page" option in the results. You'll be taken to the new page creation process.

Learn more: adding pages

Accessing the collection manager of a specific collection

You can search for the name of any of your collections and hit enter to open the Collection manager and update any of the items.

Accessing the settings of an asset

You can also quickly access the settings of any asset. Just hover over the quick-find result and click the settings icon that appears.

Learn more: Managing assets

Clone this project
Try Webflow — it's free

Production for this lesson

Directed by

-

Produced by

-

Written by

-

Article by

-

Edited by

-

Designs by

-

Need more help? Want to report a bug? Contact support
Have feedback on the feature? Submit feature feedback