Image gallery

Image gallery

Manage your article images and organize them into galleries.

Description

This plug-in will allow you to add multiple images to an article and create article image galleries. Each article can have own dedicated gallery. Galleries are being displayed either in the article's body with the content wrapped around or in a box with thumbnails that enlarge on a click using Lightbox.

For general install and uninstall instructions, please refer to Manage plug-ins section of user guide

Access

The path to the Image Gallery plug-in:

Click on the Articles link (which is located Under "Content" in Main menu at the top of your administrator panel).

Choose Image Gallery tab when adding/editing an article.

User level

This plug-in can be accessed only by users belonging to groups that are allowed to manage Image Gallery plug-in.

Actions

You can manage your image galleries for each article separately. Just choose Image Gallery tab when add/edit an article.

You must save the article before you can add images and create article's gallery.

Add images to an article

On the Image gallery tab click on the +Add new image link and choose previously uploaded image file(s) that you want to include to that article.

For more information on how to use File picker, please refer to this article.

Manage images

When added to an article, images are listed on Image gallery tab on the article editing page. You can use drag and drop to change their order, delete an image from the gallery or add Image Title and Description. Double-click an image to assign it Image Tittle and Description.

When you are done click on Apply button to save settings for the image.

To remove an image from a gallery just click Delete icon on the top right corner of the image preview.

Show image gallery on the article page

Show image gallery in a box

If you choose to display article within a box you should edit default.tpl file located in VIVVO_ROOT/templates/VIVVO_TEMPLATE_FOLDER/article and add the following line on desired place (for example right below <div id=“box_right_holder”>):

<vte:include file="{VIVVO_TEMPLATE_DIR}box/plugin_image_gallery_lightbox.tpl" />

Image thumbnails will be displayed in a box and they will enlarge using Lightbox gallery on a click.

Show image gallery within the article's body

You may choose your images to be displayed within an article and text to be wrapped around it.

To accomplish this you should edit default.tpl file located in VIVVO_ROOT/templates/VIVVO_TEMPLATE_FOLDER/article and add the following line on desired place right bellow <div id="article_body">:

<vte:include file="{VIVVO_TEMPLATE_DIR}box/plugin_image_gallery_stripe.tpl" />

First image will be displayed when article is being loaded and user can browse through gallery using arrows.

To get look & feel like on the screenshot bellow, remove the code for abstract image (starting around line 32 <vte:if test="{article.image}">, and ending around line 43 with </vte:if>).

Was this helpful?

cron