Image
After inserting a block in Live Preview, you can configure the settings
Last updated
Was this helpful?
After inserting a block in Live Preview, you can configure the settings
Last updated
Was this helpful?
Browse Image: Image Selection
Image URL: A web address that specifies the location of an image
Field: It contains Business Object attributes
Index: The number of the row in the Business Objects Data table
This setting allows you to position your image within the frame of your screen
This setting allows you to adjust the size of the image. There are 3 options available:
Unset: The replaced content is not resized
Cover: This option will resize your image to fully “cover” the size of your Fullscreen Background area. This may stretch your image, depending on its original size
Contain: This option will resize your image so that its longest dimension (width or height) will match 100% of the Fullscreen Background, fully “containing” your image. This may leave empty space, depending on your image’s dimensions. You can pair this setting with one of the Background Repeat options to fill that space
You can set the alignment of an image (left, right, center)
It allows you to change the width of the image in PX, %, or Auto
It allows you to change the height of the image in PX or Auto
It specifies an alternate text for an image if the image cannot be displayed
Static: Enter text
Dynamic:
Field: It contains Business Object attributes
Index: The number of the row in the Business Objects Data table
Static: Enter URL
Dynamic:
Field: It contains Business Object attributes
Index: The number of the row in the Business Objects Data table
Open in New Window: When the audience clicks the image which has an embedded link, it will open in New Tab
Add "No Follow": "No follow" is a link attribute used by websites to instruct search engines, especially Google, not to pass the link juice from one website to the other.
It allows you to add shadow effects around an element's frame by selecting a shadow style (None, Light, Custom)
It allows you to specify the style, width, and color of an element's border
It allows you to define the radius of an element's corners
The opacity property sets the opacity level for an element
Solid: Applies a single color uniformly within the whole of an object by selecting the Background color
Gradient: It applies a continuous blend of two or more colors, where one color gradually fades and changes into another. You can choose the Gradient Style:
Linear: Change the angle of the gradient
Radial: Change the positioning (right center, left top, left center, etc)
First color & first color location
Second color & second color location
It allows you to add shadow effects around an element's frame by selecting a shadow style (None, Light, Custom)
It allows you to specify the style, width, and color of an element's border
It allows you to define the radius of an element's corners
Inner Spacing (Padding): Padding is inside the border (or edge) of your element. Increasing the padding will “push” your content into the middle of your box, away from your borders. If you remove the padding, your content will take up the entire box
Outer Spacing (Margin): Margin is on the outside of the border of your element. If you increase the margin, it will increase the space between this element and the ones next to it. If you remove your margin, there will be no extra space between your elements
It allows you to adjust the position of the image
The z-index property specifies the stack order of an element
An element with greater stack order is always in front of an element with a lower stack order
The ID of a block, which is used in Custom CSS, Custom Javascript
The class of a block, which is used in Custom CSS, Custom Javascript
You can configure the Hover Styles by turning off the status of Default Hover Styles
a. Background color
Solid: Applies a single color uniformly within the whole of an object by selecting the Background color
Gradient: It applies a continuous blend of two or more colors, where one color gradually fades and changes into another. You can choose the Gradient Style:
Linear: Change the angle of the gradient
Radial: Change the positioning (right center, left top, left center, etc)
First color & first color location
Second color & second color location
It allows you to add shadow effects around an element's frame by selecting a shadow style (None, Light, Custom)
It allows you to specify the style, width, and color of an element's border
It allows you to define the radius of an element's corners
Inner Spacing (Padding): Padding is inside of the border (or edge) of your element. Increasing the padding will “push” your content into the middle of your box, away from your borders. If you remove the padding, your content will take up the entire box
Outer Spacing (Margin): Margin is on the outside of the border of your element. If you increase the margin, it will increase the space between this element and the ones next to it. If you remove your margin, there will be no extra space between your elements
It allows you to adjust the position of the hover
The z-index property specifies the stack order of an element
An element with greater stack order is always in front of an element with a lower stack order
You can set the condition to display the block
Condition: It includes None, Show when, Hidden when
Field: It contains Business Object attributes
Index: The number of the row in the Business Objects Data table
Operator: It includes contains, does not contain, starts with, doesn't start with, ends with, doesn't end with, etc.
Value: you can input the value or select an attribute from Business Object or Event
