Product Image Shadowbox Gallery

Real Simple, Real Easy, Very Professional

The power in selling online is in the presentation. The ability to show multiple versions of a product or to show available accessories is a must. Previously you had to hand-code this kind of feature in the editor to get a proper gallery (blah!).

The Shadowbox System is the ability to automatically display up to six (6) product images in a clean and simple format. When the visitor mouses-over the thumbnails, the main image on the screen changes automatically to a larger view. If the visitor clicks on the thumbnail or the man image, a Shadowbox Gallery kicks in and fills the screen. The lights are dimmed and the visitor has the ability to view and scroll through the images one at a time or let the autoplay feature automatically scroll for them; all in full size up to 1024px, and with descriptions displayed at the top.

How to use the new feature?

Real Simple: Go to the Edit Item Details section your administration, expand the Shadowbox Image Display attributes, select from one (1) to six (6) images to Upload, add an optional Description, click Update. That's it!
 

Real Easy: The engine will set your images to a maximum of 1024px wide and create the thumbnails needed. It will automatically display the Shadowbox with your item to your visitors on their Item Details page. By default the Shadowbox will be align to the Right, set to 300px wide, have a Black shadow at 65% Opacity. If you would like to change these defaults, you can edit them in the Admin Edit Configuration screen under Appearance & Color.

NOTE: When preparing your images for upload, make them ALL the same HEIGHT & WIDTH - this makes for a much more pleasing and smoother experience for your customers.

Optional Power Users

Real Professional: If you want more power - we give that to you as well.
Placement: The ability to place the Shadowbox anywhere in your description is a must for some webmasters. Just type the [shadowbox] tag in your content. That is shadowbox with the brackets. There are also two attributes that can be passed (width & alignment) and are used as follow:

• [shadowbox] Will use the default settings.
• [shadowbox align=left] Will align the Shadowbox to the Right, Left or Center
• [shadowbox width=300] Defines the width of the main image.
• [shadowbox align=center width=500] Sets both Alignment & Width

To add style to your Shadowbox, just edit the following three styles in the Style Editor:

• cartShadowbox
• cartShadowboxThumb
• cartShadowboxThumbTable

We have defaulted these to Black Borders and Silver Background - but as you can see in the live example, adjusting the colors can add additional impact. If you don't see the borders, go to your Style Editor in the Cart Admin, and click the Update & Rebuild button.