Two Column Layout Widget Custom Tag

<widget-twoColumnlayout attributes>
	<widget-twoColumnlayout-left attributes>
		...
	</widget-twoColumnlayout-left>
	<widget-twoColumnlayout-right attributes>
		...
	</widget-twoColumnlayout-right>
</widget-imageContentBox>

The order and nesting of the outer <widget-twoColumnlayout> tags and the inner <widget-twoColumnlayout-left> and <widget-twoColumnlayout-right> tags is important and must be specified as shown above. Also there must not be any code outside of the two nested inner tags (i.e. other code is allowed only in the places denoted with ... in the sample above).

The actual content for the left content box part goes between the opening and closing <widget-twoColumnlayout-left> inner tags and that for the right content box goes between the opening and closing <widget-twoColumnlayout-right> inner tags.

Allowed attributes for the outer <widget-twoColumnlayout> tag:

col-padding: Defines the padding between the two content boxes. I.e. the horizontal padding between the left/right boxes (in left/right layout) or the vertical padding between the top/bottom boxes (in top/bottom layout).

Possible values: Number with "px" suffix.
layout: Defines the distribution of the two content box columns, when shown in left/right layout, by specifying the ratio that is to be used to distribute the available width between the left and right columns.
Possible values: Two numbers, separated by a colon, e.g. 1:1 or 5:7.

Note: The entered layout ratio may be reduced by LISTSERV Maestro. See the widget description for more information.
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
transform: Defines how the content boxes transform between the two-column left/right layout and the top/bottom layout, i.e. defines if the left column corresponds to the top box or the bottom box (and the right column to the remaining other box).
On compliant email clients, the layout that is shown depends on the available display width. With enough space, the widget is shown in the two-column left/right layout, but with less display width (less than 640px) the widget automatically transforms and is instead shown in the top/bottom layout, where the former left column is now either the top or bottom box, depending on this "transform" attribute.

On non-compliant email clients (including desktop Outlook), the widget is always shown in the transformed top/bottom layout, where the original left column is either the top or bottom box, depending on this "transform" attribute.

Possible values: top-left or bottom-left (and top-left-outlook, see below)

Advanced feature: As explained above, in Outlook the widget is always shown in top/bottom layout, as Outlook is one of the non-compliant email clients. To work around this, you can specify a third possible value: top-left-outlook. In all other email clients, this value is interpreted exactly like the top-left value, and they behave accordingly (see above).
But in Outlook, the widget then behaves differently than with the normal top-left value: Instead of using a fixed top/bottom layout, Outlook then uses a fixed left/right layout. So top-left-outlook has three possible results: In a compliant client, you get dynamic left/right or top/bottom. In a non-compliant client you get fixed top/bottom. And in Outlook you get fixed left/right.
widgetbox-style: Defines the styling of the surrounding widget box.

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.
- padding: Defines the padding inside of the widget box (between the outer box and the two content boxes).

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

condition: Sets the widget condition for the two column layout. 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.
Additionally, the widget itself must have one of the following widgets nested into one or both of its column boxes: A template-editableBlock, a widget-imageBox, or a widget-imageContentBox, where the latter two must also have the imagereplaceable attribute set to true.
If the above is not the case, then these attributes are ignored if specified.
cloneable: Defines if this widget shall be cloneable by the template end user or not.

Possible values: true or false
condition: Same as the "additional attribute when editing the message content of a mail job", see above.
conditioneditable: Defines if this widget shall allow the template end user to edit the widget condition (or define one, if the widget currently does not have one) or not.

Possible values: true or false
deletable: Defines if this widget shall be deletable by the template end user or not.

Possible values: true or false

Allowed attributes for the inner <widget-twoColumnLayout-left> and <widget-twoColumnLayout-right> tags:

class: Sets one or more style class attributes for the content box, similar to the standard HTML class attribute.

Possible values: List of class names.
contentbox-style: Defines the styling of the left or right content box (respectively).

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 content box.
- border: Defines the border around the content box.
- color: Defines the text color of the content box.
- font-style: Defines if the font of the content box shall use the "italic" style or not. The only allowed value for this style is italic. If any other value is specified, it is ignored and the normal non-italic font is used. The normal font is also used if this style is not present at all.
- font-weight: Defines if the font of the content box shall use the "bold" weight or not. The only allowed value for this style is bold. If any other value is specified, it is ignored and the normal non-bold font is used. The normal font is also used if this style is not present at all.
- font-size-rel: Defines the size of the content box font, relative to the default font size, in percent. The size is always interpreted with the unit "%", even if no unit is specified. If a different unit is specified, it is ignored and "%" is used instead. If an invalid size or unit value is specified, it is ignored and the widget uses the default font size instead (as specified in the "Fluid Design Widget Default Font" panel on the right). If this style is not present, the widget also uses the default font size. Also, the specified size must be one of the standard sizes that is also available in the widgets properties dialog in design mode. If a different size is specified, the default font size is used instead.
  Note: Although similar, this style is not the same as the standard font-size style. Most importantly, you can only use the "%" unit and can only specify one of the standard sizes.
- padding: Defines the padding inside of the content box (between the box and its content).
- text-align: Defines the alignment of the text in the content box. Only the values left, center, right and justify are allowed. If any other value is specified, it is ignored and the content box uses the inherited alignment. The inherited alignment is also used if this style is not present at all.
- text-decoration: Defines if the font of the content box shall use the "underline" style or not. The only allowed value for this style is underline. If any other value is specified, it is ignored and the normal non-underlined font is used. The normal font is also used if this style is not present at all.

Examples:

<widget-twoColumnLayout
		col-padding="10px"
		layout="1:1"
		transform="bottom-left">
	<widget-twoColumnLayout-left
			contentbox-style="padding:1px 0 1px 0;">
		Left/Bottom content goes here
	</widget-twoColumnLayout-left>
	<widget-twoColumnLayout-right
			contentbox-style="padding:1px 0 1px 0;">
		Right/Top content goes here
	</widget-twoColumnLayout-right>
</widget-twoColumnLayout>

<widget-twoColumnLayout
		col-padding="10px"
		layout="1:2"
		transform="top-left"
		widgetbox-style="background-color:#fff4aa; border:15px dashed #7b4269;
						 padding:12px 11px 12px 11px;">
	<widget-twoColumnLayout-left
			contentbox-style="color:#0026ff; background-color:#fffb95;
							  border:5px dotted #004aff; padding:3px 2px 4px 1px;">
		Left/Top content goes here
	</widget-twoColumnLayout-left>
	<widget-twoColumnLayout-right
			contentbox-style="color:#7b4269; background-color:#79ff00;
							  border:5px dashed #00ff69; padding:3px 3px 3px 3px;">
		Right/Bottom content goes here
	</widget-twoColumnLayout-right>
</widget-twoColumnLayout>