Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search

Replace search icon with Font Awesome search icon or svg in Squarespace 7.1


Recommended Posts

  • georgeotsubo changed the title to Replace search icon with Font Awesome search icon or svg in Squarespace 7.1
  • Replies 6
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images

8 hours ago, georgeotsubo said:

Site URL: https://www.riosgarden.me/

Is it possible to replace the existing blurry search icon with the search icon from Font Awesome or svg ?

image.png.d71918df5e408f275f49ffa3d919a52a.png

You could apply the following codes in Design > Custom Css. 

.sqs-search-ui-button-wrapper.color-dark .search-input {
 background-image: url(https://api.iconify.design/fa/search.svg);
}

You can check the icon

https://api.iconify.design/fa/search.svg

Link to comment
6 hours ago, georgeotsubo said:

@HoaLT One other question, how do you hide the icon when it is searching? The spinner is showing on top of the iconimage.png.36288894d38fc00785e0fb6756b018f5.png

You can insert one addition config in Design > Css

.sqs-search-ui-button-wrapper.color-dark .search-input:focus {
  background-image: none;
}

 

Edited by HoaLT
Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...