DJ-Art Gallery
Overview files

All packages can be downloaded at http://www.design-joomla.eu/downloads/download.html

A complete list of availabe install packages:

  • DJ-Art Gallery component
  • DJ-Art Gallery plugin
  • DJ-Art Gallery module

Notice

Module and plugin are based on DJ-Art Gallery component. It means that they don't work without it.
 
Installation

Install all the packages in the ordinary way, start by installing DJ-Art Gallery component first.

Navigate Extensions > Install/Uninstall

 

install1

 

Choose the package and press Upload File & Install.

 

install2

 

 
DJ-Art Gallery component

The DJ-Art Gallery component allows you to add up to seven images into a single gallery, which you can display in an article using DJ-Art Gallery plugin or in a module position using DJ-Art Gallery module.

The main feature of the component is that you can crop a part of image that will be displayed in the front view of gallery and after clicking an image, it will enlarge to its original size.

See the basic steps to configure DJ-Art Gallery component:

 
Set parameters

First let's take a look at parameters view, where you can set image's dimensions.

Press Parameters at the top panel.

 

 

Then you will see a page:

 

dimensions

 

To understand thumbnails positions, let's look at the ready gallery.

 

th

 

Set the dimensions and press Save button.

Notice

Remember to keep aspect ratio of thumbnails.
 
Create a gallery

Let's start with creating an example gallery. Press Add at the top panel, then you will see a page:

 

add-images

 

Short description:

  • Name – enter a name of gallery
  • Select Article – select an article, where you want to display a gallery

 

First step is to choose position for every single image that you want to display in your gallery. There are available seven positions.

 

Main image Right image 1 Right image 2

Bottom image 1 Bottom image 2 Bottom image 3 Bottom image 4

 

To better understand these positions, let's look at the ready gallery:

 

positions

 

Now browse images:

 

 

Press Apply button to upload them.

 

 

Now you will see all images loaded in the Details View.

Next step is to crop a part of every image, that cropped part will be visible in the front view of gallery.

To do that, press Edit button:

 

edit-button

 

Then you will see a page:

 

edit-clear

 

 

edit

 

Short description:

  1. this is the whole image
  2. this is a part of image that will be displayed in gallery front view, press left mouse button in this area and you will be able to move that area all-over image
  3. this view shows the selected part of image

 

Choose the right area and press Save button. Remember to do that with all images.

Notice

Remember that the croped image after clicking on it in the gallery, will enlarge to its original size.

See an example:

Gallery front view:

 

gallery

 

Enlarged view after clicking the image:

 

edit-zoom

 
DJ-Art Gallery plugin

DJ-Art Gallery plugin is necessary to have a possibility to display the gallery in an arcticle view.

Remember to enable DJ-Art Gallery plugin in the Plugin Manager (Extensions > Plugin Manager):

 

plugin-manager

 

Check the plugin and press Enable button.

 

 

Now choose an article from Article Manager.

Notice

Remember to select the proper article, that one that you have selected in Details View before (see page 4-5 of this manual).

Put the tag inside an article:

{djartgallery} or {djartgallery-ID}

ID – put an ID number of gallery, this tag is useful when you have more than one gallery created

To check the id, navigate Components > DJ Art Gallery

 

id

 

Our gallery has ID=1, so tag will be look like:

{djartgallery-1}

Press Save button and that's it! Your gallery should be now visible in selected article.

 
DJ-Art Gallery module

DJ-Art Gallery module allows to show gallery in a module position.

Navigate Components > DJ Art Gallery and check an ID number of gallery.

 

id

 

Then navigate Extensions > Module Manager and put an ID number of gallery that you want to display in the module position.

 

 

Make sure that module is enabled.

Press Save button and that's it! Your gallery should be now visible in the module position.