Dreamweaver Photo Album/ Picture Gallery
Requirements: You need the Dreamweaver and
Fireworks software and basic knowledge of Dreamweaver
In this tutorial you will learn how to create a complete web photo
album in Dreamweaver within minutes! The photo album will contain
thumbnails that when clicked on will show the larger size of the
pictures with navigation to go forward or backward to view the entire
album. A web photo album can be used to showcase products, portfolios,
art and photography galleries and more.
To get started keep all the images you would like to use in one
folder. You only need the large size images. Fireworks will automatically
create the thumbnails.
Once you have all your images stored in a folder, here are the
steps you need to follow to create a photo album in Dreamweaver.
- Open your Dreamweaver site.
- Create a folder for your photo album (e.g. album)
- Open any page within the site
- Choose Commands/Create Web Photo Album from the toolbar
- Give the album a title (this will show in the thumbnail
- You can enter subheading info if you like (this will show
in the pages with the enlarged pictures)
- Choose the Source images folder by using the folder icon
to browse to the relevant folder (this will be the folder
where you have stored all the images)
- Choose the destination folder (from our example 'album')
- Choose the thumbnail size from the drop-down menu
- You can enter the number of columns you would like to display
- The rest can be left as is or changed according to your
requirements for optimization
- Click on OK
- You will see Fireworks creating the thumbnails for all the
- Once this is done, you will receive a message saying that
the photo album has been created and you can view the album.
- The album will now be in it's simple unformatted state. You
will have a folder called album under which there will
be 3 folders as follows:
- thumbnails - contains the thumbnails
- images - contains the images in its original form
- pages - contains the pages in which the larger images are
inserted along with the navigation to navigate between pictures
and go back to home
- index.htm page which will have all the thumbnails with links
to the larger images
- You can now go to the index page and apply your template
(if you have one) to format the page and also use CSS
Styles to format the text. The gallery now will look like
its part of the site. You can do this for all the pages in the
pages folder (under the gallery folder).
Amazing Photo Gallery Website Templates
Free Dynamic Flash & XML Photo Galleries that can be updated using Notepad!
Please Like, Tweet or Share this page if you found this resource useful!
Join us on Facebook to keep updated with all the latest tutorials and web design freebies from EntheosWeb!