Jump to content

Icons in Navigation

Recommended Posts

  • Replies 11
  • Views 362
  • Created
  • Last Reply

Top Posters In This Topic

Add to Design > Custom CSS. Replace with search image url

header.Header [href="/search-website"] {
    background-image: url(https://cdn.pixabay.com/photo/2022/07/31/20/00/little-boy-7356705__480.jpg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    color: transparent !important;
}

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
  • 3 weeks later...
On 9/12/2022 at 10:38 AM, sarahprime said:

I tried with this link https://drive.google.com/file/d/1N2XhuvbB_WK42LGpJWD6s3J3PGiZwsCJ/view?usp=sharing but it just made the word 'Search' transparent

Use a direct url, the gg drive won't work.

You can upload image to Squarespace site to get url

https://support.squarespace.com/hc/en-us/articles/205813928-Uploading-and-managing-files

suppose your file name is search.jpeg

when you uploaded it, it will have url: https://www.mirboonorth.com/s/search.jpeg

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
17 hours ago, sarahprime said:

I've moved it to secondary nav - Discover Mirboo North | South Gippsland, Victoria

Use this code

header.Header [href="/search-website"] {
    background-image: url(https://cdn.pixabay.com/photo/2022/07/31/20/00/little-boy-7356705__480.jpg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    color: transparent !important;
    background-color: transparent !important;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

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...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.