Add a gallery
Galleries allow you to organize multiple photos, illustrations, graphs, or any other visual elements of your choice.
To create a gallery, access the Basic section on the left side of the editor. Then, simply drag the Gallery icon to the desired location on your page.
On the Type tab, you can format the display of your gallery as:
- Thumbnail
- Grid
- Slideshow
- Slider
- Mosaic
On the Image tab, build your gallery in three different ways:
- Drag and drop your image;
- Click on Upload an image;
- Open the library.
To upload an image, simply drag and drop your image OR click on Upload an image.
To sort the order of your images, drag and drop up/down on the list.
To remove a picture, click the Recycling bin icon.
On the Settings tab, there are two sections: Options and Appearance.
In the Options section, you can choose:
- A transition effect for your images;
- A randomized display of your images;
- To enable navigation buttons as visible;
- To enable an action by clicking on the image (e.g. no action, resizing, or hyperlink).
In the Appearance section, you can choose to:
- Set the size, position, and spacing of thumbnail;
- Set the scale of the image (fill or adjust).
To customize the style of your gallery, left-click on the Gallery feature, then on Style.
On the Shape and Background tab, you can modify:
- List of shapes;
- Background color;
- Background image.
On the Advanced tab, you can modify:
- Margins;
- Round Corners;
- Borders;
- Drop Shadow.
Gallery module on mobile devices
IMPORTANT:
Given the number of mobile devices on the market, as well as the diversity of screen sizes, mobile display is one of the constant challenges for web developers.
At WebSelf, in a Gallery module, the caption of an image is displayed ¨On hover ̈ as configured in the Caption Settings.
However, when the image is ¨enlarged on the click¨, an issue occurs, because it is no longer possible to display the caption. This is a standard on the web for mobile.
If you want to create a gallery containing images with a detailed legend of a product, instead of using a Gallery module, it is recommended to use a separate Image module for each product, in order to create a mosaic; then set up a link in the Image module that will send your visitor to a "Hidden Page" that will contain the details of the product.
To learn more about creating a hidden page: Hiding pages.