Image/Video Box Widget Custom Tag

Image box without image caption:

<widget-imageBox attributes/>

Or image box with image caption:

<widget-imageBox attributes>
	...
</widget-imageBox>

Video box without image caption:

<widget-videoBox attributes/>

Or video box with image caption:

<widget-videoBox attributes>
	...
</widget-videoBox>

In the caption cases, the image caption content goes between the opening and closing tags.

Allowed attributes:

align: Defines if the image/video box shall be left, center or right aligned.

Possible values: left, center, right

Note: The center value is only applicable for widgets that use the surround="false" layout.
alt: Defines the alt text attribute of the image.

If this attribute is set, then during automatic alternative text generation, the alt text plus a link to the image will be added to the alternative text, in lieu for the actual image. Unless the data-lsoft-no-alt-text-link attribute is also set (see below).

Possible values: Text
image-style (image box only) or video-style (video box only): Defines the styling of the image/video box.

Possible values: A list of styles, separated by semicolons, similar to the standard HTML style="..." attribute. The following styles are allowed:
- border: Defines the border around the image/video box.
- padding: Defines the padding outside of the image/video box (between the box and its surroundings or parent).
- padding-caption: Defines the padding between the image/video box and the caption (only applicable for widgets that have a caption).
data-lsoft-do-not-track: Defines if clicks on the image shall be exempt from tracking.

Possible values: true. Any other value, or omitting the attribute completely, means that the click on the image is tracked.
data-lsoft-no-alt-text-link: Defines if during automatic alternative text generation, a link to this image shall not be included in the alternative text, even if the alt attribute is set (see above).

Possible values: true. Any other value, or omitting the attribute completely, means that a link to the image may be added to the automatically generated alternative text (depending on the alt attribute).
link: Defines a clickable link. If specified, then the image will act as a clickable link that sends the user to the given URL.

Possible values: URL
name: Defines the optional widget name. You can specify any name you like to label the widget. This name is shown in the widget hierarchy panel (in design mode) and makes it easier to identify the widget in the hierarchy. It also makes it easier it identify the widget here in code mode. However, the name is entirely optional and does not have any additional functional purpose.

Possible values: Any text
src: Defines the actual image or video that is to be displayed. This value cannot be specified by typing it into the source code manually, but can only be inserted by clicking the corresponding widget option in the panel on the right, or the "Image" button in the toolbar. The former inserts the whole widget code, the latter inserts a standard <img> tag, that can then be edited into this widget tag instead.

In the editor, the value of the src attribute is not shown as normal text, but as a special visual placeholder that can be clicked to change the actual image or video.

Possible values: Image or video
surround: Defines if the image/video box shall have the "Surrounding content flows around the content box" layout or not.

Possible values: true or false
title: Defines the title attribute of the image.

Possible values: Text
widgetbox-style: Defines the styling of the surrounding widget box. Only applicable for widgets that use the surround="false" layout.

Possible values: A list of styles, separated by semicolons, similar to the standard HTML style="..." attribute. The following styles are allowed:
- background-color: Defines the background color of the widget box.
- border: Defines the border around the widget box.
width: Defines the fluid width of the image/video box.

Possible values: The width must be specified as two or three values, separated by semicolon. The first value must be a pixel value (with the "px" suffix) and the second value must be a percentage value (with the "%" suffix). Together they define the fluid width of the image/video box, which is either the given pixel width, or the given percentage of the parent width, whichever is smaller. These first two values are mandatory.
For example: 300px; 50%
The third value is optional. If present, it must be a pixel value (with the "px" suffix) and specifies the width of the image in Outlook (all other email clients ignore this third value). If not present, then Outlook uses the first value for the width instead (and Outlook always ignores the percentage width).
For example: 300px; 50%; 150px

Additional attribute when editing the message content of a mail job:

condition: Sets the widget condition for the image box. The widget will only be shown if this condition is true (or if there is no condition at all). See here about special issues when specifying a condition formula in code mode.

Possible values: Any valid calculation formula that does not have a number set or text set as its result.

Additional attributes when editing a standard template:

These additional attributes are only allowed when editing a standard template and if the widget is not already nested into a template-editableBlock. Otherwise the attributes are ignored if specified.
condition: Same as the "additional attribute when editing the message content of a mail job", see above.
imagereplaceable: Defines if the image of this widget shall be replaceable by the template end user or not.

Possible values: true or false

Examples:

<widget-imageBox
		align="right"
		src="[IMAGE]"
		surround="true"
		width="200px; 50%"/>

<widget-videoBox
		align="left"
		alt="alt text goes here"
		video-style="border:5px dashed #05ff00; padding:3px 2px 4px 1px; padding-caption:1px;"
		link="https://www.lsoft.com"
		src="[VIDEO]"
		surround="false"
		title="title goes here"
		widgetbox-style="background-color:#0063ff; border:11px dotted #ff0053;"
		width="120px; 100%">
	Caption goes here...
</widget-videoBox>