2cubed Posted June 6 Share Posted June 6 Can anyone tell me what kind of code I'd need to put into the custom CSS to get my buttons to change color on hover? I'm using the "primary" and "secondary" buttons. By default there is an overlay on hover and I can't even find where that is in the style editor. I tried to insert some code that I thought would work but I failed lol CSS is not my strong suit. Attached is a picture of one of the buttons I'm trying to change! Thanks! Link to comment
inside_the_square Posted June 6 Share Posted June 6 Hey @2cubed this is a great question - and one of my favorite things to code for Squarespace! 🙌 The tricky part in Squarespace CSS is that there are over 10 unique button selectors. Primary and secondary selectors are good catch-all codes that can work for some button types, but something specific like the newsletter block uses a more unique selector. Update the word red in this code to the color name/color code you want to use: .newsletter-form-button:hover{ background:red!important } Side note - a standard opacity change happens to some buttons on a hover, so add opacity:1!important to your code if it's not the full color you want. Hope that helps and best of luck with your project! Code queen and CSS behind InsideTheSquare.co 😃 Free CSS tutorials: insidethesquare.co/tutorials-for-squarespace🥳 Free 7.1 training course: itssevenone.com/training👍 CSS Cheat Sheet - codes for 7 & 7.1: insidethesquare.co/css📚 CSS for Squarespace course: customcodeacademy.com Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment