Hover Effect
-
on my site posts I have the hover effect set up…I noticed however that with my social sharing buttons it does the same hover effect and on ads I have in the post when you hover of the post it shows up too…is there a way I can fix it so the hover effect only applies to text and not to my social share buttons and my ads in the post?
Thanks,
MK
-
Hey,
Please post a link.
Thanks,
HannahThis is one post that shows that issue:
http://yourpathtohealthyliving.com/can-high-protein-diets-help-you-lose-weight/
Thanks,
MK
Try adding this to your custom css box in theme options:
.addtoany_list.a2a_kit_size_32 a:hover { background-color: #eee !important; } .yarpp-thumbnails-horizontal .yarpp-thumbnail:hover { background-color: #eee !important; }Hope that helps!
HannahGreat! Thanks!
Also, how can make the background of the social sharing buttons white…right now it’s still greyish color…
For the yarpp related posts…when I hover over it, it’s all grey…can I have it so the background is white and when I hover over it the text is blue and the text remains greyish when not hovered over?
Can I also do that with the ads that run at the top of the post…remove the hover effect and the grey background that borders the ads?
1.
.addtoany_list.a2a_kit_size_32 a { background-color: #fff !important; }2. The background already turns white when I hover? You can use this to change the text on hover:
.yarpp-related .yarpp-thumbnail-title:hover { color: #025fa9 !important; }3.
.g-4 .post .entry-content a { background: transparent; }Hope that helps!
HannahThanks.
The grey border and hover around the ads at the top of the post are still there…I would like that to be white/transparent.
Also, the grey border around the related posts yarpp is still there as well…I would like that to be white/transparent.
You seem to be adding this css:
.post .entry-content a { padding: 6px 12px; background: #eee;That is too vague.. it is causing your issue above. What are you trying to target?
Kadence Themes
If you look at this post:
http://yourpathtohealthyliving.com/can-high-protein-diets-help-you-lose-weight/
I want to get rid of the grey around the related posts and I want to get rid of the grey and blue hover around the ads that are in the posts.
yes I know that. I’m saying that the only reason it’s there is because of the css you are adding above. and it’s better to fix that then to add more css to undo what you are adding above.
Kadence Themes
oh okay.
How do I fix that?
Just delete it?
Because I do want the hover effect for the previous and next post and any link to further content.
Just want it gone from the latest post and ads etc.
When I deleted the vague css, it did fix those two issues, but it also reverted the links at the bottom of the post linking to the original article to a hyperlink and not a button…
Same happened to the ‘continue’ link for the posts that appear when you click on either ‘category’ or ‘archive’
So if you change that css to have .postlist it will know to target only the readmore on the postlist.
.postlist .post .entry-content a { background: #eee; padding: 5px 10px; color: #444; margin: 5px; display: inline-block; }can I make it so when I hover over it the button changes to blue?
Also, can I make a button for any hyperlink that I have in my posts…
http://yourpathtohealthyliving.com/cold-temperatures-and-chili-peppers-help-burn-fat/
1. Try this css to change the background on hover:
.postlist .post .entry-content a:hover { background: #025fa9; }2. Try this:
.single-post a, a:visited { background: #eee; padding: 5px 10px; color: #444; margin: 5px; display: inline-block; }Is that what you mean?
Hannah
Also, can I make a button for any hyperlink that I have in my posts…
Use the button shortcode. Don’t make every link a button you will end up with issues as before. If you want to add a button in your content just add a button using the theme shortcodes.
Kadence Themes
The topic ‘Hover Effect’ is closed to new replies.
