Component Menu

    Components

    Responsive Image

    This component is similar to the Banner image component, but it won't crop the image because it has no image size restrictions. This component supports both Image and GIF formats.


    Edited 1 year 6 months ago

      Desktop

      Mobile

      Step By Step:

       

      1. First, in the Layout Canvas, click on the “+” button, search for the Responsive Image component, and insert it on the Canvas.

       

      2. This component can also be used inside Container-type components, such as Two Columns, Advanced Container, and others.

       

       

       

      Component customization:

       

      1. To open the settings, click twice on the component

       

      2.At this point, it is necessary to import the image that will be displayed in desktop and mobile format.

       

      3. Pay attention to the requirements for these images:

       

        • Image format: your image needs to be png, gif, jpg, or jpeg.

        • File Size: your image must have a maximum size of 2MB

        • Image title: inform a name for the image, since it’s important for SEO.

        • Image Alt: inform a description for the image, since it’s important for accessibility resources

       

       

      4. If you want this image to redirect the user to another webpage/URL, you can insert a link in the field “URL on image”. Then, select a URL Target option.

       

      5. Click on the “Apply” button to save your modifications.