- AuthorPosts
- February 22, 2021 at 12:08 pm #34065Heather SheltonGuest
Hi, all!
Thanks for building a great web tool. I’ve included one of my pages here: https://museum-hub.org/contact/. I can’t seem to figure out how to get my buttons and links to be different colors upon hover. I have built the site using the Zita Pro premium theme. The block editor only seems to affect the colors, not links and buttons. Thanks for the help!
February 22, 2021 at 2:18 pm #34126Jesse OwensKeymasterHi Heather-
Thanks for reaching out, and for using the Post and Page Builder for WordPress.
Your link styles are going to be controlled by the theme, and the hover styles for buttons are preprogrammed. You could change these with Custom CSS. If you can describe the hover effect you’d like to accomplish, we’ll be happy to help you out by writing some CSS rules for you.
I agree that this would be a really useful feature for the Post and Page Builder, so I’ve gone ahead and created a feature request for our developers for this.
February 22, 2021 at 5:43 pm #34136Heather SheltonGuestHi, Jesse,
The button static color is #5798B2 with white text. On hover, it’s light gray with black text and an underline for accessibility. Do I add the CSS to the theme customizer or the Customize Design settings within that block? THANK YOU!
February 22, 2021 at 5:48 pm #34160Jesse OwensKeymasterHi Heather-
You’ll want to add the CSS to the Theme Customizer.
The button looks a little different than you described, I want to double-check that we’re talking about the Get In Touch button near the top of your contact page?
Here’s the code that worked for me on that button (the hover text is already black):
a.btn.btn-color-2.btn-large.btn-block:hover { text-decoration: underline !important; background-color: lightgray; }
This will use the system default “Light Gray” color, but you can replace that with a different color code if you need to.
February 23, 2021 at 11:26 am #34177Heather SheltonGuestThank you, Jesse! Works like a charm.
- AuthorPosts
- The topic ‘[Resolved] Link Hover Colors with 3rd-Party Theme’ is closed to new replies.