Try Now
More in this section
Blogs RSS feed

Project #1 - Image gallery User Control (Part 1)

by Ivan Osmak

Note : The images in this project are taken from www.sxc.hu and are ownership of their respective authors. I’ve used animals because the constraints for using actual people are a bit more complex.

For the first project I’ve chose something simple yet very useful: an Image gallery User Control. The scenario is very common. Let’s say you run a web site for a local chamber of commerce. So, here and there members of this chamber go to conventions, trips, throw parties and stuff like that. They shoot tons of pictures while there and they want this pictures to accompine the report from the event.

Image gallery intro

The plan of action

If we think of this on a very abstract level, there are three basic functionalities we need to provide for Image Gallery.

  1. Upload images / manage galaries
  2. Display thumbnails for chosen gallery on the page
  3. Pop up a new window with actual size of an image when user clicks on the thumbnail

Now, the good news is that we’ll take advantage of Sitefinity’s built in features and will have to do on our own just the bullet #2 from the list.

Upload images / manage galleries

You are probably aware of the fact that one of the core modules of Sitefinity is File Manager. Yeah, now it’s pretty obvious… hehe. So open the File Manager in Sitefinity and create one folder where you will hold all the galleries. Let’s be excentric and call it “ImageGalleries”. Inside of this folder you would then create folders that represent particular gallery (like in my example, there is “Animal” gallery and “Flowers” gallery). The last thing you need to do is upload the images inside of the gallery folder (you see files animal1.jpg through animal6.jpg in my screenshot). And that’s it… the “Image and Gallery Managment System” :) is done.

File manager screenshot

In part 2 of this series we are going to create a user control that will display thumbnails on the page provide the pop up functionality which will display the real size image in a new window.

1 comment

Leave a comment
  1. Sitefinity blog Project #1 - Image gallery User C Jun 07, 2007

    […] Project #1 - Image gallery User Control (Part 2) February 21st, 2007 — iosmak NOTE : This post is a part of a series. Read first part if you’ve missed it. […]

    Leave a comment