Skip navigation
Currently Being Moderated

How to Insert Web Gallery in Web Page?

Jun 2, 2009 3:57 AM

I created a Web Photo Gallery in Adobe Bridge CS4. I want to INSERT it in a web page using Dreamweaver. The problem is that the Web Gallery is an index.html file and appears to be a web page itself. But I need it to just be part of a web page that contains my background images, texts and links. The Web Gallery is NOT a flash animation.





  • Currently Being Moderated
    Jun 2, 2009 4:35 AM   in reply to Ief_DR

    Hopefully you know some HTML & CSS


    What you need to do is open the Gallerys Index page that was created and copy and paste the code where the gallery was started and paste that into your current page.  (Making sure you keep a backup of your original files in case of problems).

    Mark as:
  • Currently Being Moderated
    Aug 13, 2009 4:14 PM   in reply to Nadia-P

    I'm having problems doing the same thing. In Bridge CS4 I created a Lightroom Flash Web Gallery. I want to insert this gallery in a pre-existing web page I have created in Dreamweaver CS4.


    I tried the response above...copying and pasting the code from the index page generated by the Bridge Flash Gallery. This didn't work.


    Why is this so difficult? In previous versions you could just insert a flash file right into a page in Dreamweaver. Why is Bridge creating a separate "index" page that is useless for existing Dreamweaver pages??


    Is there a workaround for this? Obviously I'm short on time and want to use Bridge's automated features. But now I'm losing time on the Dreamweaver end because I have to make special exceptions to house the file, which didn't work anyway.


    What am I doing wrong and is there a more detailed explanation??


    Thank you so much!

    Mark as:
  • Currently Being Moderated
    Aug 14, 2009 6:42 AM   in reply to mojopin8

    With so many questions about this, I decided to create a test gallery using Bridge and I must admit, it's not as easy as one would think to incorporate it into an existing site.  Admittedly I didn't spent too much time on this, but I agree, it should be much easier to implement.



    Here's a few links dealing with Photo Galleries and Slideshows that may be useful:

    Photo album using spry


    Image gallery


    LightBox 2




    Phatfusion lightbox - photos, flash


    PrettyPhoto: ox-clone/


    Scrolling Images





    Adobe® Community Expert : Dreamweaver

    ---------------------------------------------------------------------- ----

    Unique CSS Templates | Tutorials | SEO Articles

    ---------------------------------------------------------------------- ----



    Mark as:
  • Currently Being Moderated
    Sep 26, 2009 5:34 PM   in reply to Ief_DR



    Here's a simple solution for this:


    1. Publish the gallery from bridge as you would normally.


    2. Open up your template page (wherever you want to INSERT the gallery) in Dreamweaver.


    3. Click on the page where you want to insert the gallery.


    4. Go to code view (or split)


    5. paste:


    <iframe src ="galleryFolder/index.html" width="100%" height="100%"> </iframe>


    and you're done



    Of course you can change the width and height as you please.

    Mark as:
  • Currently Being Moderated
    Sep 26, 2009 8:14 PM   in reply to Ief_DR

    See David Powers's announcement:



    Mark as:
  • Currently Being Moderated
    Jun 21, 2010 11:46 AM   in reply to Ief_DR


    I have gone through both your tutorials and they worked great for Flash based galleries generated with Bridge, however I'm struggling with the sizing of the HTML gallery. What I would like is for the gallery to stay properly sized without any scroll bars needed or appearing.


    Here is a link to the page with a problem and I've posted the code below.


    Thanks in advance for your help.




    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">

    <html xmlns="">


    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

    <title>Wylie Galt Advertising Website Design Samples</title>

    <link href="css/layout.css" rel="stylesheet" type="text/css" />

    <style type="text/css">


    home_imagearea {

    width: 1000px;


    #home_text {

    background-color: #CCC;

    width: 860px;

    margin-right: auto;

    margin-left: auto;

    padding-top: 5px;

    padding-right: 20px;

    padding-bottom: 5px;

    padding-left: 20px;

    margin-top: 12px;



    </style><script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>

    <link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />

    <style type="text/css">


    body {

    background-color: #FFF;






    <div id="wrapper">

      <div id="top"></div>

      <div id="navigation">

        <ul id="MenuBar1" class="MenuBarHorizontal">

          <li><a href="index.html">home</a>      </li>

          <li><a href="about.html">about</a></li>

    <li><a href="interactive.html">interactive</a></li>

    <li><a href="broadcast.html">broadcast</a></li>

    <li><a href="print.html">print</a></li>

    <li><a href="articles.html">articles</a></li>

    <li><a href="contact.html">contact</a></li>



      <div id="body">

        <div id="imagearea"><div id="rightlogo"></div>

          <div id="gallery"><iframe  src="galleries/web/index.html" width="700" height="600" name="web"></iframe>





      <div id="footer"></div>


    <script type="text/javascript">


    var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});





    Mark as:
  • Currently Being Moderated
    Jun 18, 2013 2:35 AM   in reply to Nadia-P

    Hi Nadia


    I see your post about flash gallery, can u assist?


    I am happy with my flash gallery but I would like to put an image (Static one) on the actual page itself, maybe left or right hand side of gallery, is this easy to do?


    Thank you



    Mark as:
  • Currently Being Moderated
    Jun 18, 2013 3:21 PM   in reply to k11ngy

    This is a very old discussion begun in 2009.  Unfortunately, Nadia is not a participant here anymore.  If you still need help with your layout, please start a new discussion with an appropriate subject line and provide a link to your web page.  Answers to layout questions are contained in your code.



    Nancy O.

    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (1)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points