How to import an Expression Media Gallery into your web page using Expression Web 3

Creating image gallery in Expression Media and adding it to your webpage using Expression Web may seem a difficult task, but this article will walk you through all the steps to accomplish it. We will first learn how to create an image gallery in Expression Media.

How to create an image gallery in Expression Media 2

  1. Launch Expression Media.
  2. Go to File > Import Items > From Files/Folders…
  3. menu

  4. In the Choose Media File or Folder dialog box, browse to the location of the images.
  5. Select the images you want to insert in your gallery and click Import.
  6. choose_media_dlg 

  7. A Catalog would be created as shown below:
  8. catalog 

    A Catalog is a visual database of images where you can organize and manage them. 

    Next you would create a gallery of all or selected images.

    NOTE: While creating a gallery, Expression Media imports all the images in the catalog to the gallery. If you want to add only selected images, hide the images (Find > Hide Selected) that you do not want to add.

  9. Go to Make > HTML Gallery… to launch the HTML Options window.
  10. html_opt 

    Give a title and leave the other options as they are (Exploring these options, is not in the scope of this article) and click Make…

  11. Choose a folder (location) and choose Create New Folder.
  12. browse_for_folder 

  13. Rename the folder and click OK.
  14.  progress

     gallery_comp 

  15. Click OK and your gallery will be created.

How to incorporate the gallery into your website in Microsoft Expression Web

  1. Launch Expression Web and open the website in which the gallery is to be incorporated.
  2. Open the gallery folder in the explorer and arrange the window in such a way that you can drag it into Expression Web.
  3. Click and drag the folder into the folder list.
  4. Now open the webpage where you want to insert the gallery. Right click on the location and choose ‘Hyperlink’ from the menu. In the Insert Hyperlink window (shown below) choose ‘index.htm’ from the images folder we imported earlier and click OK.
  5. insert_hyperlink

  6. A link with the name of the gallery will be placed in the webpage. Save and preview your page in the browser. Then as you click on the link in the webpage, the gallery would be displayed in another browser window. See image below:
  7. final_browser                

Filed Under: Expression Web

Tags:

About the Author: Minal is a freelance web and graphics designer. She specializes in designing Logos, Stationery, Graphics and Icons as well as website templates using graphical tools like Photoshop, Illustrator and Expression Web. Twitter @saffronstroke

RSSComments (1)

Leave a Reply | Trackback URL

  1. […] How to import an Expression Media Gallery into your web page using Expression Web 3 « Microsoft Exp… saffronstroke.com/2009/09/07/import-expression-media-gallery-in-ew3 – view page – cached #RSS 2.0 Microsoft Expression Web Tips, Tricks, Templates, Logo, Banner and Stationery Designs – SaffronStroke » How to import an Expression Media Gallery into your web page using Expression Web 3 Comments Feed Microsoft Expression Web Tips, Tricks, Templates, Logo, Banner and Stationery Designs – SaffronStroke Eye Wear Designs Insert Code Snippets in Microsoft Expression Web 3 — From the page […]

Leave a Reply