Left-aligned image with lightbox

Small left aligned images use the class “left” to get them to display on the left side of the text you’ve entered.

This post shows you how to insert a small left-aligned image using the the light-box function. For other instructions, please refer to the links on the left.

To insert a small left-aligned image into a page or blog, use the “insert image” function in your toolbox, and then alter the tag so that it looks like the one in the sample code below.

All Spiffy Stores themes also have the ability to use the light-box function, so that images can be clicked on to view a larger “zoomed” image.

The image to the left has been inserting using the light-box function. When you hover over the image, you will see that your cursor becomes a hand. Click on the image, and you’ll see the light-box in action.


HTML code for embedding the above image with lightbox

<a href="/files/your-image-name.jpg" rel="lightbox" title="Put some text in the title tag so it shows up here.">
    <img src="/files/your-image-name.jpg"  class="left"/>
</a>


Textile code for embedding the above image with lightbox


You’ll need to combine HTML and textile to use the lightbox feature;
<a href="/files/your-image-name.jpg" rel="lightbox" title="Put some text in the title tag so it shows up here.">           
!(left)/files/your-image-name.jpg(This is the alt tag)!
</a>