Solved

Web gallery

Posted on 2011-03-16
3
373 Views
Last Modified: 2012-05-11
Hi,

I'm looking for the most effective way to develop a gallery website based on these requirements.

1. I have 1000 images 300x250px and 700x650.
2. I want to display 3 images per row and add a hover effect so that the large image is displayed when a user hover over the image.
3. I want to link each image to a URL and specify the under the image as well as a category.
4. Provide users with an ability to search for images based on categories.

Here's my current approach.

Create 2 separate folders, separate the images based on size and then by category.
Create a template consisting of 3 rows
Generate code automatically by inserting a URL and image location for each category and paste/replicate for each
Use a search plugin & add hover effect

Is there an easier way of getting this done? Is there a template where I can upload images with a csv to associate it with each image?

Looking for the quickest solution to build this. Preferably in 3 hours maximum.

Thank you
0
Comment
Question by:faithless1
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
3 Comments
 
LVL 110

Accepted Solution

by:
Ray Paseur earned 500 total points
ID: 35156406
There are lots of image gallery scripts, and a Google search will find them by the hundreds.  IIRC, Coppermine is one name that is well thought of.  I can also tell you from my own experience that JAlbum is a good tool.  Open-source web site frameworks (Wordpress, Joomla, Drupal) usually have plug-ins that you can tailor.

Depending on whether you are flexible with your requirements, you may be able to customize something based on one of the open-source modules.
0
 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 35158392
Another way to do it is to consider installing WordPress and then adding one of the many excellent gallery plugins for it such as NextGen.

The advantage to WordPress is that it is incredibly easy to use and install and has all of the features you want above.  
0
 
LVL 29

Expert Comment

by:Pravin Asar
ID: 35159155
Here is a simple solution.

Check the sample implementation at

http://www.iascbrevard.com/mothersdaypictures.php

1. All Files are dumped in a one directory.
2. For each image - an thumbmail file is created with T_ prefix, regular full size image has prefix R_
    For creating these, I used the EastThumbNail software
    http://www.fookes.com/ezthumbs/

3. PHP script reads the directory (only T_*.* files) and spits out the scroller.[marquee tag)

4. Simple javascript functions, changes the image in the main viewer area.

function ShowImage(tImgTag) {

      var rImgTag = document.getElementById('rImage');

      if (!rImgTag) { return; }

      rImgTag.src = tImgTag.src.replace ('T_', 'R_');

}



I have another flex based image gallery at

http://javascriptjournal.com/ws/?p=25


0

Featured Post

Free learning courses: Active Directory Deep Dive

Get a firm grasp on your IT environment when you learn Active Directory best practices with Veeam! Watch all, or choose any amount, of this three-part webinar series to improve your skills. From the basics to virtualization and backup, we got you covered.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This guide will walk you through the essential considerations and tech stack for building scalable websites. Know how to grow your business the smart way!
When crafting your “Why Us” page, there are a plethora of pitfalls to avoid. Follow these five tips, and you’ll be well on your way to creating an effective page.
The goal of this is to tech the user how to export photos out of Lightroom and the different options they have. Select which photos you want to export : Select where you want to export and with which options : Export :
In this sixth video of the Xpdf series, we discuss and demonstrate the PDFtoPNG utility, which converts a multi-page PDF file to separate color, grayscale, or monochrome PNG files, creating one PNG file for each page in the PDF. It does this via a c…

697 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question