Archived topic
need help in adding css and html
4 replies · Started by Sunny on July 6, 2019
Hi, I need help in adding css and html to have desired effect.
I want to use image hover effect from one of these
https://miketricking.github.io/bootstrap-image-hover/
on clicking a particular hover effect, it shows the code for css and html that needs to be added.
I am confused, where to add the code to have desired effect on a particular image.
for example, I have an image in a post. I want to have the desired effect by using css and html from the link that I have posted above.
How to achieve that?
any pointers are highly appreciated.
I understand that I can use simple css to target post specific images. Or i can add the css in add css option in customise theme option. What I don't understand or rather get is , how to add html for the particular image to achieve the desired hover effect.
Any pointers appreciated.
Hi there,
You would need to add the image using their HTML. So for the first example it would be something like this:
<div class="hovereffect">
<img class="img-responsive" src="http://placehold.it/350x200" alt="">
<div class="overlay">
<h2>Hover effect 1</h2>
<a class="info" href="#">link here</a>
</div>
</div>
Keep in mind that sometimes these effects won't work out of box like this in WordPress.
Definitely worth a shot but might need to check with the author to see if there are necessary tweaks in the code.
Thanks Leo, i tried it but it is breaking the customisations that I have done in my themes.
Appreciate your time.
Hmm not sure why that would be.
Might be worth to look around for a solution that would work for WordPress by default.