Image

Description

The [img] shortcode is an easy way to insert an image as a thumbnail. The image will automatically be resized to fit the specified thumbnail dimensions, but you can also view the full-size version in a lightbox by clicking on the thumbnail. Other customizable parameters include thumbnail alignment, image title and image description.

Basic usage

[img src="image.jpg"]

Simply specify the image to be inserted with the src parameter. By default, the thumbnail will be 100x100 pixels in size.

Live demo

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eu nulla vitae elit interdum sagittis eget a leo. Aenean et mauris massa. Proin feugiat risus id metus laoreet at condimentum metus pharetra. Ut sollicitudin dolor sit amet libero scelerisque quis vestibulum nibh rhoncus.

Advanced usage

[img src="image.jpg" width="150" title="Hello world" desc="Description goes here." align="left"]

This example demonstrates how to specify additional parameters like custom thumbnail size, image title, image description and alignment.

Live demo

Aligned to the leftAligned to the left

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eu nulla vitae elit interdum sagittis eget a leo. Aenean et mauris massa. Proin feugiat risus id metus laoreet at condimentum metus pharetra. Ut sollicitudin dolor sit amet libero scelerisque quis vestibulum nibh rhoncus. Etiam est nibh, feugiat porta porta sed, blandit at est. Aenean facilisis dui viverra lectus viverra iaculis. Nulla quis odio lectus. Aenean metus tellus, malesuada sit amet aliquam non, viverra a purus. Nam molestie venenatis egestas. Nulla et interdum justo. Nunc ac rutrum ligula. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Integer nibh orci, facilisis et interdum sed, sollicitudin vitae ipsum. Etiam pretium blandit dignissim.

CenteredCentered

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eu nulla vitae elit interdum sagittis eget a leo. Aenean metus tellus, malesuada sit amet aliquam non, viverra a purus. Nam molestie venenatis egestas. Nulla et interdum justo. Nunc ac rutrum ligula.

Aligned to the rightAligned to the right

Aenean et mauris massa. Proin feugiat risus id metus laoreet at condimentum metus pharetra. Ut sollicitudin dolor sit amet libero scelerisque quis vestibulum nibh rhoncus. Etiam est nibh, feugiat porta porta sed, blandit at est. Aenean facilisis dui viverra lectus viverra iaculis. Nulla quis odio lectus. Aenean metus tellus, malesuada sit amet aliquam non, viverra a purus. Nam molestie venenatis egestas. Nulla et interdum justo. Nunc ac rutrum ligula. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Integer nibh orci, facilisis et interdum sed, sollicitudin vitae ipsum.

Parameters

  • src - image path URL.
  • title - image title.
  • desc - image description.
  • align - thumbnail alignment.
  • width - thumbnail width.
  • height - thumbnail height.

Using parameters
src
title
desc
align
width
height