Nabiloh 1 Share Posted July 25, 2020 Hello SS Community, I am looking for a way to change the colour of social icons on hover in the navigation bar. I am using the template Tremont (7.0) Thank you! Link to post
0 tuanphan 9,339 Share Posted July 25, 2020 Can you share link to your site? We can check easier. You can send your question to my email to get faster answer. How to: Setup password & share url Insert Custom CSS Open Page Header Upload Custom Font Find Block ID, Data Section ID Contact Squarespace Customer Care -- Yup! Link to post
0 tuanphan 9,339 Share Posted July 28, 2020 18 hours ago, Nabiloh said: www.johnsummitmusic.com Add to Home > Design > Custom CSS. Repeat for other icons #siteHeader [href*="facebook"]:hover .SocialLinks-link-icon { fill: red; } #siteHeader [href*="instagram"]:hover .SocialLinks-link-icon { fill: blue; } #siteHeader [href*="twitter"]:hover .SocialLinks-link-icon { fill: green; } Nabiloh 1 You can send your question to my email to get faster answer. How to: Setup password & share url Insert Custom CSS Open Page Header Upload Custom Font Find Block ID, Data Section ID Contact Squarespace Customer Care -- Yup! Link to post
0 Nabiloh 1 Author Share Posted July 28, 2020 Thank you, you're amazing! One final request, would it be able to use hex codes with the hover colors? Link to post
0 tuanphan 9,339 Share Posted July 28, 2020 yes you can use red, yellow, green... #ff0, #f1f2f3f4, #f0f0f0 rgb(255,255,255), rgb(0,1,2) rgba(255,255,255,0.1) or hsl Nabiloh 1 You can send your question to my email to get faster answer. How to: Setup password & share url Insert Custom CSS Open Page Header Upload Custom Font Find Block ID, Data Section ID Contact Squarespace Customer Care -- Yup! Link to post
0 Nabiloh 1 Author Share Posted July 28, 2020 You rock! One final question, on the Shop page, I applied a header injection to show a different logo because that page has a white background, it works perfectly on Chrome, but not on Firefox. Any idea why? Link to post
0 tuanphan 9,339 Share Posted July 31, 2020 On 7/29/2020 at 5:48 AM, Nabiloh said: You rock! One final question, on the Shop page, I applied a header injection to show a different logo because that page has a white background, it works perfectly on Chrome, but not on Firefox. Any idea why? Remove your code, add this to Page Settings > Advanced > Header <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script> <script> $(document).ready(function() { $('h1.image img').attr('src','https://static1.squarespace.com/static/5ce6eaeb3635390001e51764/t/5f1f223d6dd88f02ead0c474/1595875901364/Summit_ICON_transparent.png'); }); </script> Nabiloh 1 You can send your question to my email to get faster answer. How to: Setup password & share url Insert Custom CSS Open Page Header Upload Custom Font Find Block ID, Data Section ID Contact Squarespace Customer Care -- Yup! Link to post
Question
Nabiloh 1
Hello SS Community,
I am looking for a way to change the colour of social icons on hover in the navigation bar. I am using the template Tremont (7.0)
Thank you!
Link to post
Top Posters For This Question
4
4
Popular Days
Jul 28
4
Jul 25
2
Jul 27
1
Jul 31
1
Top Posters For This Question
Nabiloh 4 posts
tuanphan 4 posts
Popular Days
Jul 28 2020
4 posts
Jul 25 2020
2 posts
Jul 27 2020
1 post
Jul 31 2020
1 post
Popular Posts
tuanphan
Add to Home > Design > Custom CSS. Repeat for other icons #siteHeader [href*="facebook"]:hover .SocialLinks-link-icon { fill: red; } #siteHeader [href*="instagram"]:hover .SocialLinks-li
tuanphan
yes you can use red, yellow, green... #ff0, #f1f2f3f4, #f0f0f0 rgb(255,255,255), rgb(0,1,2) rgba(255,255,255,0.1) or hsl
tuanphan
Remove your code, add this to Page Settings > Advanced > Header <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script> <script> $(documen
7 answers to this question
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment