Custom Image Module

All you need to know about setting up Image Module

The custom image module is a tool to enhance and customize the appearance of images in a project. Here's how to use the different features in the module:

1. Image Type: To choose the layout of the image, go to the Image Type option and select one of the available options, such as Normal, Curved, Masked, Flip Out Lightbox, or Text on Image.
   
   

    

2. Border Style: To add a layout to the image's border, go to the Border Style option and select an option, such as Curved Top or Curved Bottom.
3. Image Masking: To enhance the image with various masking effects, go to the Image Masking option and select from the available options, such as Hexagonal, Pill, Designer, Quote, and more. To use a custom mask, select the Custom option.
4. Flip Style: To add a hover-over effect to images, go to the Flip Style option and choose one of the options, such as Normal, Horizontal, or Vertical.
5. Image Lightbox: To display images in a larger view when clicked, use the Image Lightbox feature.
6. Text on Image Settings: To add text to an image that becomes visible on hover, go to the Text on Image Settings option. Here, you can add an image, text, text colour, text background colour, and overlay colour.
   
7. Add caption: To add a caption to the image, go to the Add caption option. Here, you can add caption styling, a title, lazy load, and image clickability to enhance the appearance and functionality of the image.
8. General Style: To control the style settings of the custom image module, go to the General Style option. Here, you can adjust the image alignment and add a border.
9. Visibility Controls: To hide the module for different devices with specific screen sizes, go to the Visibility Controls option and select options like Hide for Desktop, Hide for Tablet, and Hide for Mobile.