Working With Mambo
Image Gallery
There are quite a few image gallery add-ins for Mambo. However, most may not
work on Active Web Hosting servers due to the fact we keep 'safe mode' activated.
However, you can create a simple, yet useful image gallery using Mambo itself,
without any extra components, modules, etc. This method may also be preferred as
it also lets you control what images are displayed on your site. Remember, you
are responsible for any and all images which are displayed on pages on your
domain.
Create Your Gallery Offline
Before you start, you'll want to create a gallery directory on your hard
drive so you can upload it to your Mambo directory. After that, you can just
add photos in the directory you wish in your gallery. Create subdirectories for
each category such as photos, artwork, etc. And maybe in those
create subdirectories such as flowers, etc. Organize things as you wish.
Remember to make thumbnail images for each image you want to display. You can
do this using a paint program such as
Paint Shop Pro
PhotoShop
or Gimp. If you have Windows XP,
you can also create thumbnails by doing the following:
Right click on an image or group of images that you want to reduce the size of.
Select Resize Pictures.
Click the Advanced button.
Click next to Custom. A good size is 120 x 120 for most Mambo templates
though you can make them larger if you wish.
Click on the box next to Make pictures smaller but not larger. Be sure
that Resize the original pictures (don't make copies) is unchecked.
Click Ok.
It's best to rename the files so that they do not have any spaces in the filenames
and instead of (Custom) use -thm added on to the original filename.
A good bulk renaming tool for Windows is
The Rename.
Setting Up A Mambo Gallery
Upload your gallery directory (delete any thumbs.db files first) to your
Mambo directory. Do not place it in the images or any other
subdirectories.
In the Mambo Administration area, go to
Content -> Section Manager.
Click on the New icon at the top of the page.
Type in Gallery for both the Section Title and the
Section Name.
Click the Save icon at the top of the page.
Go to Content -> Category Manager.
Click on the New icon at the top of the page.
Type in a name for your category for both the Category Title and
Category Name. This could be anything such as Artwork,
Photos, or whatever you plan to put into your gallery. Think of these
Categories as albums.
Choose Gallery from the Section drop town box.
Click the Save icon at the top of the page.
Adding A Gallery Page
Go to
Content -> All Content Items.
Click the New icon at the top of the page.
Type in a title (and title alias) for the page. This is what will show up on
the page and in the list of content items.
Choose Gallery for the section, then choose a category.
While it might seem like it would be easiest to create you pages with Mambo's
built-in WYSIWYG (What You See Is What You Get) editor, it's probably best to
enter the code using plain HTML. To do this, click on the HTML icon which
is located in the toolbar above the text box, the last icon in the second row.
This gives you a plain text editor to work in. Type in the following code to
start. Note that highlighted areas you should replace to fit your specific page.
<p align="justify">
Put your discriptive text here. You could put what type of camera and conditions
were used for this set of photos, or what type of paints or pencils, etc. you
used to draw the picture, or even a link to a license agreement to use clip art.
If you're presenting wallpaper or clip art, instructions can go here to tell
users how to download the images and use them.
</p>
<div align="center">
<table cellpadding="3" cellspacing="0" border="0" width="100%"><tr>
<!-- This Is A Block To Display An Image -->
<td valign="top" align="center"><font size="1">
<a href="gallery/your_category/your_image.jpg" target="_new">
<img src="gallery/your_category/your_image-thm.jpg" border="0" alt="Image Description">
</a><br>
Type in your description here.
</font></td>
<tr></tr> <!-- This Separates Rows Of Images -->
<!-- This Is A Block To Display An Image -->
<td valign="top" align="center"><font size="1">
<a href="gallery/your_category/your_image.jpg" target="_new">
<img src="gallery/your_category/your_image-thm.jpg" border="0" alt="Image Description">
</a><br>
Type in your description here.
</font></td>
</tr></table></div>
Note the areas in red need to be changed to match your path to your gallery and filename
of your images and thumbnails. Also it's best to give each image an alt
text and a description. Each area consists of blocks and these blocks
can be copied, pasted and edited to add more images. Note the row separater of
<tr> and </tr> tags. Use these to start another row of images. Be
sure you do not put too many in one row and throw your template or page off.
Click the Update button at the lower right of the editor window when you
are done. Don't worry if your images do not show up in the WYSIWYG editor. They
most likely will not. Finally, click the Save icon at the top of the
page.
Create A Menu Item To Your Gallery
Go to Menu -> mainmenu. Click on the New
icon at the top of the page.
In the Content area on the top left, find Table - Content Section
and click in the circle to the left of it. Click the Next icon at the
top of the page.
Type in Gallery for the Name.
Click on Gallery from the list of Sections.
Parent Item should remain top.
Select your access level.
On the right in the Parameters, find Category Description and
change that to hide.
Change the following to hide: Date Column, Author Column, Hits Column,
Table Headings, Navigation Bar, Order Select, Display Select, and Filter.
Click the Save icon at the top of the page.
Refresh your new page and click on your Gallery link in your menu.
|
