Search bar icon and other icons

  • I have Kadence Pro and I am wondering is it possible to change out the search icon with another icon in the search bar? As well as any other icon within the theme not just ones in the header (ie the back to top icon)? I’d like to use either font awesome ones or even ones that I find elsewhere (ie iconscout.com).

Viewing 1 replies (of 1 total)

  • Hello @lifewithkadie

    Unfortunately, the header’s search item doesn’t let you use a custom icon. However, you can use an HTML item instead of the search item. Add the following HTML to add a button that will open the theme search modal. Then, you can replace the “Search button” text with your chosen icon. 

    <button class="search-toggle-open drawer-toggle search-toggle-style-default" style="color: black; background-color: yellow;" aria-label="View Search Form" data-toggle-target="#search-drawer" data-toggle-body-class="showing-popup-drawer-from-full" aria-expanded="false" data-set-focus="#search-drawer .search-field">
Search button</button>
Viewing 1 replies (of 1 total)
  • The topic ‘Search bar icon and other icons’ is closed to new replies.