Juxtapose Images

“Juxtapose Images” is a wordpress plugin for juxtaposing two images in your blog or website. You can overlap two images with a slider that creates a beautiful effect to show the before and after of a photograph. Really easy to use. A perfect tool to compare similar pictures, ideal for explaining changes over the time, before and after stories, showcase your photo retouching capabilities, etc..

You can see the effect below.

glories_antesglories_despues

Why

This plugin started only as a wrapper of the Juxtapose javascript library. I found some sites using this library but all of them where using an iframed version or manually including the library. I thought that creating a wordpress plugin would be a good idea, allowing more people to use this effect.

How to use it

Just install and activate the plugin and use the [ juxtapose ] … [ /juxtapose ] shortcode, including two images of the same size in the content of the shortcode. This is how I see the code of this post, where a juxtapose slider is included.

Sometimes, a picture is worth a thousand words:

pantallazo

As you see, not rocket science if you are used to work with wordpress.

Some Tips

  • Use images with the same width and height.
  • For a better effect, choose photos taken from the same point of view, and try to find visual elements shared between both pics.
  • The plugin expect exactly two images.
  • Any text or css styles applied to the images will be removed, including any extra html

Bugs? Improvements? Have a better idea?

Right now the plugin is very simple. Easy to use and zero configuration. I have some ideas in mind for next versions but I would like to get some feedback from the users before starting extra functionalities that could end not being used.

If you think that something is missing, or that a special feature would be nice, please, leave a comment on this page.

Or if you find that something is broken, maybe an incompatibility with anothere plugin or theme, please leave a comment here or at wordpress plugin support page and I’ll try to fix ASAP.

Download and Install Plugin

Visit the Download plugin page.

 

One thought on “Juxtapose Images

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">