• Satisfied Client.
    Satisfied Client.

    Remebering With Roses

    The Challenge. They wanted a new online presence that was more user friendly and better showcased their great handmade jewelry.

    The Solution. Simplified navigation. New store with Facebook integrated login. Joomla content manager for easy updating.

  • Make An Impression.
    Make An Impression.

    Don't hand out just any business card.

    All cards are custom designed.  Choose from single or double sided, full color or BW (if you must), ronded or straight corners, and with or without a UV coating.  

    Not only do they look good, they won't break the bank.  Contact me to find out more.

K2 with Simple Image Gallery Pro

  • Tuesday, 23 July 2013 23:56

This is a brief tutorial on adding a photo gallery to a K2 item using Simple Image Gallery Pro.  This method will add a photo gallery to the bottom of the K2 Item as seen above.

To start out we need to go to our K2 Items:  Log into the Joomla Control Panel.  Go to Components -> K2 -> Items

k2-sigpro-1

Select an existing Item or add a New Item.  Below I added a new item I labeled Test Item.  

Above the text editor you will see a row of tabs: Content, Image, Image Gallery, Media, Extra Fields, and Attachments.

We are going to select the "Image Gallery" tab as seen below.

k2-sigpro-4

There are 3 options for adding photos to the Image Gallery:

  1. Click "Create a new image gallery or edit an existing one" to upload files. This will only be available if Simple Image Gallery Pro is installed.
  2. Uploading a ZIP file 
  3. Entering a URL of a Flickr set.

For this example we are going to use option 1 and click on the link to create a new image gallery.

Once you click you will get a popup for the Simple Image Gallery.  
Click on the green "Add Images" and your screen will look like the image below.

k2-sigpro-5

Now you can drag images into the area from a explorer or finder window just like you would from folder to folder, or you can click on the green "Add Files" button.  

Select your images.  

Tip: If you need to select consecutive images, click on the first, hold shift and click on the last.  If you need to select multiple images not next to each other, hold down control while you click on each.

Once selected and choosen, click on "Start Upload"

When the images are finished uploading, close the Add Files window, Save and close the Simple Image Gallery window.

Phoca Photo Gallery

  • Friday, 19 October 2012 01:16

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.

joomla-menu

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.

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, please contact me.

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.

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.

upload-pre-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:

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".

upload-files

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.

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-folder

joomla-controls2

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.

Working with Image and Category Details

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 


Categories

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.

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 me for assistance.

 

This tutorial was taken from the Phoca Gallery Documentation and 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.  You can also contact me  via email or the contact form below if you have any questions.

 

Contact

812.455.4396
Phone
P.O. Box 181
Evansville, IN 47702
Address

Questions? / RFP

Invalid Input
Invalid Input
Invalid Input
Invalid Input
Invalid Input
Invalid Input
Invalid Input
Invalid Input


©  FRITSCHLE COMMUNICATIONS. ALL RIGHTS RESERVED