Step by step tutorial.

Description: This tutorial describes an easy way to add the modern-looking popups with lightbox effect to your website without hand coding using Dreamweaver and Lightbox Advancer for Dreamweaver.

1. Open your html page in Dreamweaver and select place on the html page where you want an image-target to be inserted.

 

2. Start LightBox Advancer.

 

3. Create new Lightbox using Add New Item button.

 

4.Add the image(s) into a list that will displayed in the LightBox.

 

5.Press Create Thumbnail button and select the base image for thumbnail creating.

 

6. Set thumbnail parameters and save thumbnail.

 

7. Check the results in the Live Preview window. Press Save & Close button to save created LightBox to your html document .

 

8. Lightbox successfully added. Save your html document and open your html page in a browser.

 



Tags: lightbox  dreamweaver  CS5  tutorial  extension  howto