Phoca Gallery Tutorial - The Basics

Phoca Gallery is a free and fairly easy to use Photo Gallery component. This tutorial covers the basics of using the Phoca Gallery Plug-In for your Joomla website and assumes that you have correctly installed the Phoca Gallery plug-in into your website. We will cover the basics of adding and editing images and categories into your gallery. If you require more information about Phoca Gallery please visit these links:

Phoca Home Page
Phoca Gallery Documentation

First you'll need to login to your Joomla website control panel,
Click here for information on how to log into your Joomla Administration area

Once you're in Joomla, you'll need to navigate to the Phoca Gallery control panel. Mouse over the menu item "Components" and select "Phoca Gallery" from the drop-down menu.

Navigate to Phoca Gallery

You are now at the Phoca Gallery Control Panel. As you can see, there are many options available for this component. We will just cover the basics here, working with categories and images.

Phoca Gallery Control Panel

On the most basic level, Phoca Gallery is similar to Facebook or other online social networking site photo galleries, or personal photo software on your computer. You may have "Albums" separating your events, people, locations ECT. In Phoca Gallery, these are called Categories.

There are 2 different basic layouts to display your categories, the type of layout is determined by the type of menu item that your gallery is assigned to.

Category List Layout means you have, or are planning to have, more than one category in your gallery. This is helpful if you have multiple "albums" of photos or would like to separate sets of images in some way.

Category Layout means you are using one category for your gallery. This layout is useful if you only have one set of images that you wish to display and separating them is not a concern.

This information will be helpful when uploading photos and creating folders, which we will cover next.

If you require assistance with setting up your menu items, visit the Phoca Gallery documentation menu link page for more details.

The Basics

It's helpful to understand how Phoca Gallery works in order to organize and display your photos correctly. Your Gallery can be split into as many Categories as you choose, each category can contain a text description and as many images as you like, each with text descriptions - all of this may be organized in any fashion your choose.

In order for your images to be seen on your website, they must be placed in a category. Depending on the complexity and organization of your gallery, the number will vary, but you'll always be dealing with at least one category.

This method covers the easiest way to upload images and organize them as you go. There are a few steps, but if you follow the instructions correctly, Phoca Gallery will do all the work for you.

Uploading Images

The first thing to understand about Phoca Gallery is this: uploading an image and adding an image to your gallery are two separate things. You need to upload the images first, then add them to the gallery by putting them in a Category. This method will show you how to do both in one shot.

There are a few different ways to upload images to your website. For now, we'll just cover uploading single images one at a time through the Phoca Gallery control panel, as it is the easiest method to get started with.

To get there: click the "Images" button in the control panel or in the menu. This will take you to the "Images" page, which contains a list of your images. On the "Images" page - click the "Multiple Add" button near the top right of the screen in the image list.

Phoca Gallery Image Controls

This takes you to a window that contains the file directory for the images in your gallery. These folders contain the images for each category.

Before you upload, you'll need to select a folder to upload to. This will ensure your images are where you want them from the start. If you're adding new images to an existing category - simply click the name folder you wish to upload into. Any images you upload will be placed in this location.

Phoca Gallery Create Folder

If you don't have any folders, or wish to create a new folder, look at the very bottom of the window where it says "Folder" - Simply type a name that makes sense and hit "Create Folder". This folder will become a new Category. Select that one if you like by clicking it's name in the list.

Note: Folder names cannot contain spaces or special characters. Use dashes as an alternative to spaces. You can change the Category name later.

If you created a new folder, it will be added to the list and look something like this:

Phoca Gallery New Folder

Once you have selected the folder, you are ready to upload images. Near the bottom of the window is where you can do this. Under where it says Upload File, click "Choose File", find the image on your computer and hit "Start Upload".

Phoca Gallery Upload Page

Repeat this step for all of the images you wish to upload.

Note: If your images are larger than the dimensions listed in red ("Maximum Resolution") and you experience upload errors, you'll need to resize your images to be smaller before you upload.

Once you are done - click the green "up arrow" near the top left of the image list. This takes you back to the original list of folders.

Phoca Gallery Uploaded Images

Final Steps: Click the checkbox directly to the left of the any folder(s) you have uploaded new images into. Then click the "Save" button at the top right of the window.

  • Click and Save Phoca Gallery Folder
  • Joomla Save Button

You should be taken to a screen that says Creating thumbnails. This will process the new images into the gallery - resizing your new images and creating your new categories, if you added them. Wait for it to finish processing your images and you should be all set. It will take you back to the images page when it's done.

View the gallery to make sure everything got put where you wanted it. Click the "Preview" link near the very top right of the window to open your website and navigate to your gallery page.

Joomla Preview Button

Here is what it might look like on your live site

  • New Category added
    New Category on Site
  • New Images Added
    New Images on Site

You may wish to edit the names of the categories and images. You may also add descriptions to your images and categories. You can do this in the the category and image lists. We'll cover that next.


To view, edit and organize your existing images and upload more images simply click the "Images" button in the control panel.

This is a list of all the images in your Gallery.

Phoca Gallery Image List

Quick tip: If you have multiple categories, you can sort the list to view only the images in a particular category by using the "Select category" drop down at the top right of the list.

Phoca Gallery Category Filter

From here, we can edit titles and descriptions for each image individually. Simply click the name of the image to bring up the details.

There are a lot of things you can do here. For this basic tutorial, we'll just cover the Name and Description. To change the name of your image, type what ever you like in the "Name" field at the top of the list.

Image Details 01

Quick Tip: You can also change the category the image appears in by selecting the desired category from the "Category" drop down list near the top of the list.

Near the bottom of the page, you can enter a description for the image in the text editor. This description will be displayed above your photos that are inside this category on your website.

Joomla Text Editor

Quick Tip: if you wish to add Search Engine Meta Descriptions or Tags to your images, you can do so directly above the Description text editor.

Add Meta Tags

Click the "Save" button at the top right of the window to save and return to the list of images.

Deleting or Removing Images

You may wish to remove images from your gallery. You can either delete them permanently, or "Unpublish" them - which leaves the image in your gallery, but removes it from view on your website. You can "Publish" it later to bring it back.

Delete Button

To Delete images: Click the check box directly to the left of the images you wish to delete. Then simply click the "Delete" button near the top right of the window.

To "Unpublish" an image: In the image list there is a column titled "Published" to the right of the Title. If the image is published, there is a green check mark in this column. Simply click the check mark to unpublish it. The check mark is now a red x. To re-publish, click the x to turn it back into a check mark.

  • Publish Button
  • Un-Publish Button


To edit categories details simply press the "Categories" Button in the control panel or menu. This will bring up a list of your categories. Click the title of the category to view and edit its information. This works exactly like the Images Detail described in the previous section.

Adding a description to your Category will display your text directly above the images on that particular category.

When you're done - click the "Save" button near the top right of the screen.

This will take you back to the list of Categories. To return to the Control Panel, use the Phoca Gallery menu - click "Control Panel". Or preview your changes by using the preview button at the top right of the window.

Common Issues and Troubleshooting

Errors when uploading images:

Be sure to take a look at the Maximum Size and Resolution numbers, listed in red directly over the upload box. If you have images that are larger than these, and you get an error - you will need to resize them to be smaller before you upload.

Be sure that your files are JPG, GIF, or PNG. Some other file types are supported, but it's best to go with one of those 3.

You may also need to rename your files before you upload. On the internet, files and folders cannot contain spaces or certain other characters. Dashes are okay.

More reference on image names and uploading can be found here

Images not showing / not in correct location on website

If you added your photos to the wrong category, go to the images list, find the images and set the correct category near the top.

If your images are not in the gallery at all, go back to the "Multiple Add" screen in the "Images" page. Find the images you uploaded in the list / folders. Click the checkbox to the left of the image name(s), the select the correct category from the drop down list above the list of images, then click save.

Image / Category Descriptions not showing or not formatted correctly

The settings for this may not be configured as you wish them to be. These settings are not covered in this tutorial, but can be found in the "Parameters" tab. Contact us for assistance.

Again, this tutorial is just a starting point covering the most basic functions of Phoca Gallery. Full documentation and support forum for this product can be found on the Phoca Gallery website.

Phoca Home Page
Phoca Gallery Documentation

NOTE: We do not provide complementary assistance with further customizations on Phoca products. If you require further assistance with Phoca Gallery please visit their forum or contact us for an Estimate on your project.

If you are an Existing NetSense Media Client, you can contact us with additional questions.