[Resolved] Image Swap on hover

[Author]

Posts

[vytenisK]

Is there anyway I can set it up so that a user can upload two images (one active, one rollover) and having the rollover image appear when the user hovers over the image?

[Luo Yang]

Hi vytenisK,

It is possible by adding another plugin "Hover Image":
http://wordpress.org/plugins/hover-image/

I have tested in my localhost, please try as following steps:

1) I assume you are using Types to create the two images:
one active, is using slug "active"
one rollover, is using slug "rollover"

2) download the plugin from wordpress:
http://wordpress.org/plugins/hover-image/
install it in your website

3) edit the plugin file hover-image.php
add a line in line 31:

function himage($atts, $content)
{
	$content = do_shortcode($content);
...

4) add shortcodes in your post content as this:

[himage][types field="active" align="none"][/types][types field="rollover" align="none"][/types][/himage]

[vytenisK]

Where do I add the shortcode? I tried putting it in my .php file but it didn't work.

[vytenisK]

And is it definitely

$content = do_shortcode($content);

And not

$content = do_shortcode("content");

[vytenisK]

I figured it out. You were right, I just forgot to put the the content function into my php file (new to WP). Thanks!

[vytenisK]

Actually, one more question. If I add a URL field in types as well (so the image links to a site), how would I do make the image link? Would t hat be done through the shortcode, or would have have to wrap

<?php the_content(); ?>

in an 'a' attribute?

[katrina]

Hello, I know this is a very old thread. Is this still the preferred method for adding a hover state that utilizes a Types custom field in a View?