×

Element Settings: Image Settings

Modified on Fri, 17 Nov, 2023 at 2:14 PM

This article will discuss Image Settings available for elements on your pages. These settings allow you to control some miscellaneous behaviors for your image, such as lazy loading, link actions, and more.

Requirements: 


Table of Contents:


Lazy Loading?:

This setting determines if your image will wait to load until it is within the visitor’s web browser view. Enabling this setting for non-essential images can help improve page performance.

Back to Top


Quality:

This setting allows you to set a specific image quality to load. It is based on a percentage compared to the original image and can help improve page performance without requiring multiple copies of the same image.

Back to Top


Resize Width:

This allows you to set a maximum width to generate the image. Setting a value here will also generate different-sized images optimized for screens smaller than the value entered. Doing so can improve performance by automatically optimizing the image for the device or web browser size without requiring multiple copies of the same image.

Back to Top


Link Action Or URL:

This setting lets you turn the image into a clickable link that opens the specified URL. This can be a link to an external website by including the full URL with “http” or “https”, e.g., “https://www.google.com/”. Or it can be a custom action sent to the active page, e.g., “#top”.

Back to Top


Target:

This setting determines if the Link Action or URL specified will open in the same window or a new web browser tab.

Important Note: This setting is only available if a  value is typed into the Link Action Or URL field.

  • Same Window: This will have the Link Action or URL open in the same browser window and same tab.
  • New Tab: This will make the Link Action or URL open in a new web browser tab.

Back to Top


Align:

This setting controls where the image will be placed along the horizontal space within its container (row or column).

Important Note: The image width must be smaller than the container’s width to see the effect.

  1. Left: This will position the image on the left side of its container.
  2. Center: This will position the image in its container's center (horizontally).
  3. Right: This will position the image on the right side of its container.

Back to Top


Supported Elements:

This setting can be found in the following elements: 

Back to Top

Was this article helpful?

That’s Great!

Thank you for your feedback

Sorry! We couldn't be helpful

Thank you for your feedback

Let us know how can we improve this article!

Select at least one of the reasons
CAPTCHA verification is required.

Feedback sent

We appreciate your effort and will try to fix the article