Retrieve Images from a Folder

Directory as a content source

The directory option is a useful way of populating the modules with images either as a stand alone image gallery or as a gallery with images that then can be linked to relevant content.

Content elements available when using the directory option

imageElements

Naming convention for images

The zentools module has the capacity to create the title, text and link destination elements from the images file name. In order to separate these items you need to follow the following naming convention:

  • title-text-articleid-itemid

 

An example file name looks like this:

  • Black+and+white-Portrait+of+a+woman-173-5.jpg

Resizing files with spaces in the name.

File names with spaces in the them are notoriously problematic to process.  The + character is used int he Zentools module to namespace a non breaking space in the module output to get around instances where servers won't process filenames with spaces in the title.

You can see a real live example of how this works on the slideshow demo in the first example which uses the overlay theme or in the screenshot below.

 

slideshowImagedirectoryExample

 

Creating links to content items

As you can see from the above example we have the numbers 173 and 5 appended to the file name. These numbers refer to the Joomla articleid and itemid respectively. But don't worry if that seems a little compex as finding them in Joomla is relatively simple.

Articleid

The article id is the id Joomla assigned to your content when you create a new content item. You can find this id in one of two places. 

Finding the article id in the Joomla admin.

1. Navigate to the article manager in your site's administrator. Via the main Joomla menu go to content > article manager.

2. Look for the ID column which is the last column in the article manager.

3. Scroll down to the article you want to link to and make a note of the id. The number here is the number that you place as the article id - in the example above we are linking to article 173.

4. Add the id you found above to your image file name as noted in the naming conventions above.

Finding the article id via the url.

This option is slightly trickier but there is no need to shy away from it if you are feeling even just a little bit adventurous. Although to use this option you do need (in most cases) to ensure that you have SEF urls disabled. 

1. Navigate to the page you want to link to.

2. Look at the url in the browser address bar. In the example above we have would have navigated to this url: 

http://zentools.joomlabamboo.com/index.php?option=com_content&view=article&id=173&Itemid=5

3. Make a note of the article id which is shown directly after the text article&id=

4. Add the id you found above to your image as noted int he naming conventions above.

Finding the itemid

The itemid is essentially the menu idenitifer attached to the item you want to display. Joomla's pages are rendered based on module and menu assignments and so the number used here can make a large difference to the page that the link directs the user to.

Once again there are two methods of determining the itemid on a Joomla website.

Finding the item id in the Joomla admin.

1. Navigate to the menu manager in your site's administrator. Via the main Joomla menu go to menu > main menu.

2. Look for the ID column which is the last column in the menu manager.

3. Scroll down to the article you want to link to and make a note of the id. The number here is the number that you place as the article id - in the example above we are linking to the itemid 5.

4. Add the id you found above to your image file name as noted in the naming conventions above.

Finding the article id via the url.

This option is slightly trickier but there is no need to shy away from it if you are feeling even just a little bit adventurous. Although to use this option you do need (in most cases) to ensure that you have SEF urls disabled. 

1. Navigate to the page you want to link to.

2. Look at the url in the browser address bar. In the example above we have would have navigated to this url: 

http://zentools.joomlabamboo.com/index.php?option=com_content&view=article&id=173&Itemid=5

3. Make a note of the item id which is shown directly after the text Itemid=

4. Add the id you found above to your image as noted int he naming conventions above.