About/Usage

This widget is an image gallery that opens the image on a modal box on click on desktop. The modals are only used on desktop. In the mobile, the images appear at full width and scrollable. The images are not clickable.

The images gallery should be placed on its own page. It can be used with the "Left Aside" template or the "No Asides" template.

Requirements

  • Max width of images: 600px
  • Max number of images in gallery: 50
  • Place images on host before using snippet.

Setup

To set up the widget, use the snippet generator and follow these steps:

  1. Enter title for the widget.
  2. Insert the image folder path. Type the path using the relative url. Include the end slash( / )
  3. Select this host the images/gallery will be placed.
  4. Select the layout desired for the gallery. (Masonry grid or classic grid)
  5. Click next
  6. On the next sceen, insert the desired alt text or caption for each image.
  7. Click neck
  8. Copy and past velocity snippet into the desired content area

Widget Styles

The widget styles are in the http://web-q-hospital.prod.ehc.com/global/hut/widgets/css/webq-widgets.css stylesheet. Make shure this is included in the /util/custom/start.vtl.

<link rel="stylesheet" href="https://web-q-hospital.secure.ehc.com/global/hut/widgets/css/webq-widgets.css"/>

Snippet Generator

(default: Image Gallery)