Contz Posted April 6, 2020 Share Posted April 6, 2020 Site URL: https://andrea.co Hi there, I have a question. How do I change the hover color of my search icon? I've tried with this, but it doesn't work .Header-search-form a:hover { fill: #0a97a9 !important; stroke: #0a97a9 !important; color: #0a97a9 !important; } Thanks Andrea Link to comment
tuanphan Posted April 6, 2020 Share Posted April 6, 2020 Use this CSS .Header-search-form-submit:hover svg { stroke: red !important; } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Contz Posted April 6, 2020 Author Share Posted April 6, 2020 Thanks a lot. Do you know if there is a way to change the search icon onto the search page? Thanks Andrea Link to comment
tuanphan Posted April 6, 2020 Share Posted April 6, 2020 Search Page Icon uses Image, not color. You can use this code .sqs-search-page-input { background-image: url(paste new icon url here) !important; } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
sugarkw Posted May 6, 2020 Share Posted May 6, 2020 Hi there! @Contz I love your site- how were you able to change your header- do you have 7.1? Right now I have a "search" button but I want a magnifying glass connecting people to to the /search page... (ideally I would like a search bar embedded but it sounds like from reading other posts in the forum that isn't doable with 7.1.) @tuanphan would these codes work for my site too? Do i put them in settings>advanced>code injection or in the Custom CSS? Or is there a way to change my (button) to an image? Thanks!!! www.thebagboyz.com Link to comment
tuanphan Posted May 6, 2020 Share Posted May 6, 2020 7 minutes ago, sugarkw said: Hi there! @Contz I love your site- how were you able to change your header- do you have 7.1? Right now I have a "search" button but I want a magnifying glass connecting people to to the /search page... (ideally I would like a search bar embedded but it sounds like from reading other posts in the forum that isn't doable with 7.1.) @tuanphan would these codes work for my site too? Do i put them in settings>advanced>code injection or in the Custom CSS? Or is there a way to change my (button) to an image? Thanks!!! www.thebagboyz.com add to home > design > custom css replace with your glass icon url Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
sugarkw Posted May 6, 2020 Share Posted May 6, 2020 Hey there! Thanks @tuanphan. I tried: .sqs-search-page-input { background-image: url https://www.thebagboyz.com//s/magnifyingglass.png !important; } Into the design>custom CSS and it doesn't seem to be working. Sorry! I am a failure. Any advice? Or did I screw it up? (First I saved the image, inserted it as a file onto my not-linked section). Link to comment
tuanphan Posted May 6, 2020 Share Posted May 6, 2020 5 hours ago, sugarkw said: Hey there! Thanks @tuanphan. I tried: .sqs-search-page-input { background-image: url https://www.thebagboyz.com//s/magnifyingglass.png !important; } Into the design>custom CSS and it doesn't seem to be working. Sorry! I am a failure. Any advice? Or did I screw it up? (First I saved the image, inserted it as a file onto my not-linked section). Your code is invalid. .sqs-search-page-input { background-image: url(paste new icon url here) !important; } eg .sqs-search-page-input { background-image: url(https://beaverhero.com/wp-content/uploads/2020/05/artboard-1-.jpg) !important; } See how to upload image/file: https://support.squarespace.com/hc/en-us/articles/205813928-Uploading-and-managing-files Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
sugarkw Posted May 9, 2020 Share Posted May 9, 2020 Hi there- I tried to fix it again. I can't get the search icon to work - I sent you an admin invite for the site. It did not add an icon in the navigation with a link to the search page, (preferably next to the cart). I have a search "button" there now, but I want the icon. Instead whatever I did messed with the search bar within the search page. I will of course compensate you for your time- I hope its an easy fix! Link to comment
sugarkw Posted May 9, 2020 Share Posted May 9, 2020 I have attached the screenshots for www.thebagboyz.com Link to comment
tuanphan Posted May 10, 2020 Share Posted May 10, 2020 Done. Line 01-Line 17 in Custom CSS box Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
sugarkw Posted May 10, 2020 Share Posted May 10, 2020 @tuanphanYou are amazing!!! Truly. Thank you! Link to comment
Recommended Posts
Archived
This topic is now archived and is closed to further replies.