Using -AO- Tags in Your Custom Stationery

  • Updated

Using the native Act-On CSS tags included in the stock stationery, you can enable composer settings for use with your own custom stationery allowing you the same functions you would have if you started with our stock stationery.

Information in this article is about emails created in the Legacy Email Composer. For the most up-to-date way of creating emails in Act-On, see the Email Composer User Guide.

-ao-line-spacing:

  • Default: 1.5
  • Defined by the line-height setting in the composer's main message content, can be set to 1, 1.25, 1.5, 2.
  • Equivalent to the CSS line-height property and is applied to paragraph text in the message body.

-ao-link-color:

  • Default: unset (browser default)
  • Defined by the link color setting in the composer, can be set to any hex color.
  • Equivalent to the html+css "<span><a href='' style='color: #XXXXXX'><Sample text</span>" for message body text containing links.

Links

-ao-link-underline:

  • Default: underline
  • Defined by the link underline setting in the composer, set to underline by default.
  • Equivalent to the html+css "<span><a href='' style='text-decoration:none'>Click here</a>" for message body text.

Corners

-ao-corner:

  • Default: set in stationery
  • Defined by the above setting in the stationery, and will apply the selected value to the composer's corner radius setting.
  • Equivalent to the CSS property "border-radius" and can accept similar values. However, please note that on stock stationery the border rounded corners are displayed as images and tables for greater email client compatibility.

Border

-ao-border-width:

  • Default: set in stationery
  • Defined by the above setting in the stationery, and will apply the selected value to the composer's border width setting.
  • Equivalent to the CSS property "border-width" and can accept similar values. However, please note that on stock stationery the border controls are converted into images and tables for greater email client compatibility.

-ao-border-color:

  • Default: set in stationery
  • Defined by the above setting in the stationery, and will apply the selected value to the composer's border color setting.
  • Equivalent to the CSS property "border-color" and can accept similar values. However, please note that on stock stationery the border controls are converted into images and tables for greater email client compatibility.

Background

-ao-background:

  • Default: transparent
  • Variable: BACKGROUND-COLOR
  • Defined by the outer background color setting in the composer. Applies to the message body.
  • Equivalent to the HTML attribute "bgcolor" when applied to <body>. Can accept similar values, with hex values being required.

-ao-background-inner:

  • Default: transparent
  • Variable: BACKGROUND-INNER-COLOR
  • Defined by the inner background color setting in the composer. Applies to the message content areas. Areas of the message document without layout sections, headers, or footers will show the outer background instead.
  • Equivalent to the HTML attribute "bgcolor" when applied to <td>. Can accept similar values, with hex values being required.

-ao-content-background: ***

  • Default: transparent
  • Defined by each layout section's background-color property. Will be overridden by a custom layout property set within the composer.

-ao-background-inner-alt

  • Default: transparent
  • Variable: BACKGROUND-INNER-ALT-COLOR
  • Defined by the footer background color setting in the composer. Corresponds to the HTML attribute "bgcolor" when applied to <td>. Can accept similar values, with hex values being required.

Padding

-ao-padding-top: ***

  • Default: 0px
  • Defined by the message styling padding settings, and applies to padding around the message body section (excludes header and footer)

-ao-padding-right: ***

  • Default: 0px
  • Defined by the message styling padding settings, and applies to padding around the message body section (excludes header and footer)

-ao-padding-bottom: ***

  • Default: 0px
  • Defined by the message styling padding settings, and applies to padding around the message body section (excludes header and footer)

-ao-padding-left: ***

  • Default: 0px
  • Defined by the message styling padding settings, and applies to padding around the message body section (excludes header and footer)

-ao-h-font-family:

  • Default: set in stationery
  • Defined by the message header font-family setting
  • Equivalent to the CSS font-family property

-ao-h-font-size:

  • Default: set in stationery
  • Defined by the message header font size
  • Equivalent to the CSS font-size property

-ao-h-line-spacing:

  • Default: 1.5
  • Defined by the line-height setting in the header, can be set to 1, 1.25, 1.5, 2
  • Equivalent to the CSS line-height property

-ao-h-color:

  • Default: set in stationery
  • Defined by the header text color setting in the composer, can be set to any hex color
  • Equivalent to the html+css <span style='#XXXXXX'>Sample Text</span> for header text

-ao-h-link-color:

  • Default: set in stationery
  • Defined by the header link color setting in the composer, can be set to any hex color
  • Equivalent to the html+css <span><a href='' style='color: #XXXXXX'>Header link</a> for header text

-ao-h-link-underline:

  • Default: underline
  • Defined by the link underline setting in the composer, set to underline by default
  • Equivalent to the html+css <span><a href='' style='text-decoration: none'>Click here</a> for header text

-ao-h-background:

  • Default: transparentVariable: BACKGROUND-HEADER-COLOR
  • Defined by the header background color setting in the composer.
  • Equivalent to the HTML attribute "bgcolor" when applied to <td>. Can accept similar values, with hex values being required.

-ao-h-alignment:

  • Default: center
  • Variable: HEADER-ALIGNMENT
  • Defined by the header alignment setting in the composer
  • Equivalent to the CSS property "text-alignment". Can be set to center, left, or right.

-ao-h-padding-top: ***

  • Default: 0px ***
  • Defined by the message styling padding settings, and applies to padding around the message header

-ao-h-padding-right: ***

  • Default: 0px ***
  • Defined by the message styling padding settings, and applies to padding around the message header

-ao-h-padding-bottom: ***

  • Default: 0px ***
  • Defined by the message styling padding settings, and applies to padding around the message header

-ao-h-padding-left: ***

  • Default: 0px ***
  • Defined by the message styling padding settings, and applies to padding around the message header

Footer

-ao-f-font-family: ***

  • Default: set in stationery
  • Defined by the message footer font-family setting
  • Equivalent to the CSS font-family property

-ao-f-font-size: ***

  • Default: set in stationery
  • Defined by the message footer font size
  • Equivalent to the CSS font-size property

-ao-f-line-spacing: ***

  • Default: 1.5
  • Defined by the line-height setting in the footer, can be set to 1, 1.25, 1.5, 2
  • Equivalent to the CSS line-height property

-ao-f-color: ***

  • Default: set in stationery
  • Defined by the footer text color setting in the composer, can be set to any hex color
  • Equivalent to the html+css <span style='#XXXXXX'>Sample text</span> for footer text

-ao-f-link-color: ***

  • Default: set in stationery
  • Defined by the footer link color setting in the composer, can be set to any hex color
  • Equivalent to the html+css "<span><a href='' style='color: #XXXXXX'>Footer link</a> for footer text

-ao-f-link-underline: ***

  • Default: underline
  • Defined by the link underline setting in the composer, set to underline by default
  • Equivalent to the html+css "<span><a href='' style='text-decoration: none'>Click here</a> for header text

-ao-f-background: ***

  • Default: transparentVariable: BACKGROUND-FOOTER-COLOR
  • Defined by the footer background color setting in the composer.
  • Equivalent to the HTML attribute "bgcolor" when applied to <td>. Can accept similar values, with hex values being required.

-ao-f-alignment: ***

  • Default: center
  • Variable: FOOTER-ALIGNMENT
  • Defined by the footer alignment setting in the composer
  • Equivalent to the CSS property "text-alignment". Can be set to center, left, or right.

-ao-f-padding-top: ***

  • Default: 0px ***
  • Defined by the message styling padding settings, and applies to padding around the message footer.

-ao-f-padding-right: ***

  • Default: 0px ***
  • Defined by the message styling padding settings, and applies to padding around the message footer.

-ao-f-padding-bottom: ***

  • Default: 0px ***
  • Defined by the message styling padding settings, and applies to padding around the message footer.

-ao-f-padding-left: ***

  • Default: 0px ***
  • Defined by the message styling padding settings, and applies to padding around the message footer.
  • These tags are entirely optional, however, your custom stationery will have limited functionality within the composer.
  • Please note that controls in the composer should dramatically reduce the number of customizations that previously could only be done in stationery.
  • -ao-corner, -ao-border-width, -ao-border-color all govern the stationery provided defaults for the border settings in the editor which do work in all clients since these are rendered into tables and images, as well as update the composer’s border settings when stationery with different -ao-border-* defaults is selected from the droplist.

Was this article helpful?

Have more questions? Submit a request