Aesop Image Component Demo

Aesop Image Component allows you to easily add images to your post with many options. Go to the Image Component Documentation

Lightbox, Caption and Credits

By default, it has “Enlarge” option that you can click to open the image in full size. You can turn this option off. You can also add optional captions and photo credit.

[aesop_image img=”http://aesopstoryengine.com/wp-content/uploads/2016/10/cat.jpeg” imgwidth=”600px” align=”center” lightbox=”on” caption=”Optional Caption You Can Add Using Aesop. Isn’t she cute?” captionposition=”left” revealfx=”off”]

 

Size and Overlay

You can change the size of the image as you fit, including full width (100%). You can also add an optional “overlay” on top of the image.

[aesop_image img=”http://aesopstoryengine.com/wp-content/uploads/2016/10/cat.jpeg” align=”center” lightbox=”on” captionposition=”left” overlay_content=”

Overlay Text (H6 tag)

” revealfx=”off”]

[aesop_image imgwidth=”100%” img=”http://aesopstoryengine.com/wp-content/uploads/2016/10/cat.jpeg” align=”center” lightbox=”on” captionposition=”left” overlay_content=”

Overlay Text (H2 tag)

” revealfx=”off”]

 

 

What a full width image looks like:

[aesop_image img=”http://aesopstoryengine.com/wp-content/uploads/2017/04/pexels-photo-141784.jpeg” panorama=”off” imgwidth=”100%” align=”center” lightbox=”on” captionposition=”left” revealfx=”off” overlay_revealfx=”off”]

NEW: Panorama Mode

The latest Image Component feature gives you a way to display wide panoramic images. Move you cursors left and right.

[aesop_image img=”http://aesopstoryengine.com/wp-content/uploads/2017/04/pexels-photo-141784.jpeg” panorama=”on” imgwidth=”100%” align=”center” lightbox=”on” captionposition=”left” revealfx=”off” overlay_revealfx=”off”]

 

Reveal Animation

You can also add optional “reveal animation” Refresh the page to replay the animations.

[aesop_image imgwidth=”600px” img=”http://aesopstoryengine.com/wp-content/uploads/2016/10/cat.jpeg” align=”center” lightbox=”on” captionposition=”left” overlay_content=”

‘From Right’

” revealfx=”fromright”]

[aesop_image imgwidth=”600px” img=”http://aesopstoryengine.com/wp-content/uploads/2016/10/cat.jpeg” align=”center” lightbox=”on” captionposition=”left” overlay_content=”

‘From Left’

” revealfx=”fromleft”]

[aesop_image imgwidth=”600px” img=”http://aesopstoryengine.com/wp-content/uploads/2016/10/cat.jpeg” align=”center” lightbox=”on” captionposition=”left” overlay_content=”

‘In Place’

” revealfx=”inplace”]