8 Replies Latest reply on Jun 18, 2013 3:21 PM by Nancy OShea

    How to Insert Web Gallery in Web Page?

    Ief_DR Level 1

      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.





        • 1. Re: How to Insert Web Gallery in Web Page?
          Nadia-P Level 5

          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).

          • 2. Re: How to Insert Web Gallery in Web Page?

            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!

            • 3. Re: How to Insert Web Gallery in Web Page?
              Nadia-P Level 5

              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






              Scrolling Images






              Adobe® Community Expert : Dreamweaver



              Unique CSS Templates | Tutorials | SEO Articles






              • 4. Re: How to Insert Web Gallery in Web Page?



                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.

                • 5. Re: How to Insert Web Gallery in Web Page?
                  Zabeth69 Level 5

                  See David Powers's announcement: http://forums.adobe.com/thread/497139



                  • 6. Re: How to Insert Web Gallery in Web Page?
                    jwylie11 Level 1


                    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 http://www.wyliegalt.com/print.html and I've posted the code below.


                    Thanks in advance for your help.




                    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

                    <html xmlns="http://www.w3.org/1999/xhtml">


                    <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"});





                    • 7. Re: How to Insert Web Gallery in Web Page?

                      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



                      • 8. Re: How to Insert Web Gallery in Web Page?
                        Nancy OShea Adobe Community Professional & MVP

                        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.