A guide to adding captions under images in your Joomla article content

Last Updated:
Category:
Basic Tutorials

Joomla! 3.3 (3.2) allows you to add images also using “Images and links” – this section lets you display images and links in your articles using standardized layouts. By the way, this feature can be hidden by a user with Admin permissions in the Article Manager Options.

Joomla! 3.x Images and Links option tab

By default Captions are not showed in most Gavick templates. But if you want to show captions under Full article image – it request small changes (customization) in template file:

  1. Using Joomla edit mode or FTP client open this file: templates/gk_TemplateName/html/com_content/article/default.php
  2. Find line where you will see following code (~188 line):
    src="<?php echo $images->image_fulltext; ?>" alt="<?php echo $images->image_fulltext_alt; ?>"/>

    before closing </div> please add following code:

    <p class="img_caption"> <?php echo htmlspecialchars($images->image_fulltext_caption) ?></p>
  3. Save changes or upload changed file to your sever.

Article with caption under image

As you see this caption uses “img_caption” CSS class – so you can customize it – adding your own style to change appearance.

Image Captions after migration from old Joomla! version

If you saw that all captions has gone, please don’t panic there is a solution. Use a free plug-in called EasyImageCaption that can re-apply legacy captions that disappear after moving to J!3.x. This plugin generates captions from images’ TITLE or ALT tags in articles and displays them below (or above) the images. It has been developed as an alternative to Joomla!’s built-in javascript caption solution as well as to the JCE editor’s caption plugin.

A guide to adding captions under images in your Joomla article content 3.225 (64.44%) 9 votes

This article was first published

Villa Belluci - View our NEW theme
×

Tutorials & tips delivered regularly

Expand your purchase with regular tutorials and tips to making your site better, direct to your email.