I see where you can change the button style, but how do you make one of these buttons change to a full color background with white text when it's hovered over to look like the 4th row of buttons (the ones shown in jry19's comment above) on this page: http://themes.muffingroup.com/betheme/shortcodes/typography#buttons
Also, I'm using the client shortcode and would like the bottom bar that shows up when you hover over it to be a blue color like you see in the first row of the client ones here: http://themes.muffingroup.com/betheme/shortcodes/loops/
We have some pre-defined colors and that's the these buttons got different bg color on hover. If you want, you can change this bg on hover with custom css as well.
2. The color of this line, you can change with:
ul.clients.clients_tiles li .client_wrapper::after { border-bottom-color: #000 !important; }
Ok, I tried that and now a hover color shows up, but it's gray even though I told it to use the color #29aae2 in the CSS you gave me.
Also, you can see that I'm using Javascript so when you click on the button it pops up a box in the window for people to register for our event. However, the page then refreshes like clicking the button is linking to somewhere else. I've tried changing the target code of the button to everything but can't figure it out. Any thoughts?
Ok, that fixed my hover color for the button, but I'm still having a problem with the Javascript.
When you click on the button a box should pop up for you to register. I've done this using this Javascript on other websites before without any problem, but for some reason when I do it on this theme it pops up the box and then reloads the page. Can you help me figure out why it would be reloading the page please?
What I'm trying to say is that I don't think the problem has anything to do with the custom script. I've used this custom script before on other websites and had no problems. The script is super simple and used for embedding, so it shouldn't be causing the page to reload.
I think the problem has something to do with the way the button reacts when clicked. I've removed the link specifications, but that doesn't seem to have fixed it.
I have checked with the company that provides the javascript for this and they confirmed that it has nothing to do with the script. They said, "You have an `href` attribute on your link. Just remove it and it should work."
As I mentioned, I did remove the link specifications in the code for the button. My code looks like this: [button title="Register Now" icon="" icon_position="" color="#29aae2" large="0" class="guestlist-event-399144"]
Do I need to add some custom css to stop it from linking if that's causing the page to reload?
Comments
button styles can be changed under Theme options > Global > General section.
2. The color of this line, you can change with:
ul.clients.clients_tiles li .client_wrapper::after { border-bottom-color: #000 !important; }2. We also need link to page where this button is.
This CSS code is a little complicated but works:
a.button.button_js.button_stroke_custom:hover:not(.action_button) {background-color: #ff0000 !important;
}
Thanks!
Its nice to hear