Support » Themes and Templates » Hover over thumbnail featured images

Hover over thumbnail featured images

Viewing 15 replies - 1 through 15 (of 17 total)
  • There’s quite a nice plugin for this that uses two images. The first displays as usual and the second displays on hover.
    It works by putting a [ihover] First image + Second image [/ihover] around the images.
    (obviously you need the plugin installed for it to work though!)
    For your second image you could use the thumbnail (maybe decrease the opacity) and then just add some text to it – thereby when you hover over it it fades out a little and you title appears!

    Thank you for the advice but I don’t understand where to put [ihover] into…

    [ Please do not bump, that’s not permitted here. ]

    Is this what you are trying to achieve?

    My apologies though, once you have the plugin installed, you use [himage] First picture, Second Picture[/himage] not the shortcode i originally said…

    Yes exactly! Where do I put the code in? Do I upload the second photo (with the faded image and text) in Media and link its URL?

    So you upload and install the plugin.
    Then on the page where you want the image to appear:

    [himage]First Picture Here followed by Second Picture[/himage]

    Upload the pictures into your media library then add them onto the page via the ‘add media’ button.

    I’ve tried adding it to the actual post page and the general Blog page where all thumbnails are shown but neither work. Am I inserting it in the write place?

    It should work on any page.
    For the example i showed you i made a page called test and this is what it looked like in the editor.
    I can post the html code if that’s of any help.

    yes that would be great!!

    So on the page ‘test’ that i created this is the HTML that is in the editor:

    [himage]<img class="aligncenter size-full wp-image-392" title="smal" src="http://chrislawtonphotography.co.uk/wp-content/uploads/2013/01/smal.jpg" alt="" width="200" height="200" /><img class="aligncenter size-full wp-image-391" title="small2" src="http://chrislawtonphotography.co.uk/wp-content/uploads/2013/01/small2.jpg" alt="" width="200" height="200" /> [/himage]

    You would obviously need to upload the images into your media library and then change the links.

    I still can’t manage to do it. Is there any other way?

    There probably is another way using javascript or other language but i’m not too much of an expert on those. I’d be willing to take a look at your problem with Hover Image plugin if you like.

    That would be great, what do you need?

    I’d need the wordpress login details but i don’t think the mods allow them to be dished out, nor can i give out my email – so if you like you can get in touch with my via my website. http://chrislawtonphotography.co.uk/contact/

    Is there no other way? Without wanting to be offensive I am a bit reluctant to give send my login details to someone I don’t know. Couldn’t I send you the copy of the style.css files, index, etc. whatever you think you might need?

    That’s quite understandable. Unfortunately i don’t think it has much to do with the other files. All I can do (and i know these might sound obvious) is just to double check that you A. have the plugin installed and B. make sure you are using the [himage] tag like i showed in the code above.
    In theory once you have the plugin installed you should be able to copy and paste that code above onto any page. Just make sure that you are viewing the page on the ‘text’ tab and not the ‘visual’ one as it includes HTML that the visual tab will not be able to interpret.

Viewing 15 replies - 1 through 15 (of 17 total)
  • The topic ‘Hover over thumbnail featured images’ is closed to new replies.