What are the newsletter Layout Options?

This article lists all available newsletter Layout Options and appropriate values. 

The following Layout Options are required:

Name: layout

Value: true or false

This toggles the normal web page layout (logo, right rail, etc.) from showing when viewing the newsletter in a browser (false = off, true = on). You’ll likely want to set this to false.


Name: newsletter.width

Value: This is the width that the newsletter will be rendered. Please note that you do not use a “px” after the value. Base this value on the width of your widest ad if you have a leaderboard ad. For example: 768 


Name: template

Value: newsletters/newsletter_default

Using this value allows you to use the functionality of the new Layout Builder.

The following Layout Options are optional:

Name: article.image.width

Value: When the width of the newsletter is modified it's recommended to adjust the image width for articles accordingly. Do not include "px" in the value


Name: article.url.params

Value: Appends attributes to every article from the newsletter-articles shortcode. These are attributes that your ESP could parse. Do not begin this value with "?" or "&". e.g. email=@{user_email}@


Name: background.color

Value: Hex color code. Change the background color of the overall newsletter


Name: body.top

Value: Some 3rd party trackers require content to be placed immediately after the opening body html element


Name: contact.link

Value: The link to your contact page


Name: contact.link.text

Value: Modify the text of the button


Name: contact.message

Value: Change the message associated with your contact call-to-action


Name: contact.style.button

Value: Inline CSS that overrides the styles for the button link


Name: contact.style.button.link

Value: Inline CSS that overrides the styles for the button link


Name: contact.style.message

Value: Inline CSS that overrides the styles for the message


Name: contact.style.message.link

Value: Inline CSS that overrides the styles for the message link


Name: contact.bg_color

Value: Hex color code


Name: disable.responsive.ads

Value: true or false

When set to true, it disables ePublishing’s responsive code for ads, allowing clients to rely on their ad provider's responsive ad code. 


Name: facebook.url

Value: The URL of your Facebook Page


Name: image.bg.color

Value: Hex color code. Controls the background color for images (useful when images are in portrait orientation, defaults to white).


Name: linkedin.url

Value: The URL of your LinkedIn Page 


Name: logo.background.color

Value: Hex color code. Change the background color in the header behind the logo.


Name: logo.padding

Value: Overrides the default 20px padding value around the logo. Include "px" in the value field (ex: 40px). Important: If this results in a value that is greater than what's entered in the newsletter.width Layout Option this will then become the newsletter width.


Name: logo.path

Value: A file path of the header image used in the newsletter. You can see this file path in Media Manager when you upload the image file. For example: /ext/resources/newsletter_logo.png


Name: logo.width

Value: The width that the logo will be rendered. Please note that “px” is required after the value. For example: 422px


Name: menu.name

Value: If you want to include a navigation bar in your newsletter issue, set up the navigation in Editorial > Navigation and use the name you applied to the navigation menu here.


Name: nav.position

Value: This is the position of the nav bar on your newsletter, acceptable values are top or below-header. Defaults to top if unused.


Name: newsletter.date

Value: If your site is using an Omail integration, you can enter the following Omeda shortcode for the value: @{mv_date_M/d/yyyy}@. If you do not add this Layout Option, the default date will be used (the date the newsletter issue was created).


Name: newsletter.title

Value: The title of your newsletter


Name: newsletter.unique.footer

Value: The value should be a blurb shortcode for a corresponding Editorial Content area that will be rendered in the footer of the newsletter (for example: [blurb name="newsletter1.unique.footer"]). Create Editorial Content that matches the name in quotes and insert your footer code in its body and publish it.


Name: omeda.deployment.type

Value: If your site is using an Omail integration, this will be a value provided by Omeda. 


Name: omeda.test.email

Value: If your site is using an Omail integration, the value is a vanity name and email address that gets included in Omail’s test sends (formatted like: "ePublishing Admin" <epubadmin@epublishing.com>). This is handy in the event the newsletter editor is not part of the Omail test list (this way, test lists don’t have to be adjusted through Omail’s settings). 


Name: pre.header

Value: The line of text that the user will see in their inbox beside the subject line. It does not actually appear anywhere in the body of the newsletter.


Name: pre.header.visible

Value: The visible Editorial Content area that will display above the header in the newsletter. The value should be a blurb shortcode for a corresponding Editorial Content area that will be rendered in the footer area (for example: [blurb name="newsletter1.pre.header.visible"]). Create Editorial Content that matches the name in quotes and insert your footer code in its body and publish it.


Name: show.volume.issue

Value: true or false. When set to true, this will allow the volume and issue information to display on the newsletter issue. 


Name: style.font.headline

Value: Inline CSS that sets the headline font. Example: font-family: Helvetica, Arial, sans-serif; 


Name: style.font.teaser

Value: Inline CSS that sets the teaser font. Example: font-family: Helvetica, Arial, sans-serif; 


Name: style.footer.left.column

Value: true or false. Override the styles on the left column of the footer, ideal for increasing the width if the overall newsletter width has been changed.


Name: style.footer.right.column

Value: true or false. Override the styles on the right column of the footer, ideal for increasing the width if the overall newsletter width has been changed.


Name: style.title

Value: Inline CSS that affects the styles of all section titles e.g. The [newsletter-articles] title and the [newsletter-article] headline.


Name: twitter.url

Value: The URL of your Twitter Page 


Name: web.version.link

Value: This is used for a "View Web/HTML Version" link. The value should be a blurb shortcode for a corresponding Editorial Content area that will be rendered in the footer area (for example: [blurb name="newsletter1.web.version.link"]). Create Editorial Content that matches the name in quotes and insert your footer code in its body and publish it.


Name: youtube.url

Value: The URL of your YouTube Page 

Component-Specific Layout Options:

The following components in the Layout Builder will allow you to specify a name for the component using the Template attribute:

  • Article List
  • Event List
  • Gallery List
  • Video List
  • Table


You can assign a name to the component’s template and use additional component-specific layout options to further style the component to stand out from the rest of the newsletter.


The components mentioned above will allow you to set the following Layout Options:


Article List - when using a 1 column layout

  • tmpl.<template_name>.bg.color

  • tmpl.<template_name>.border.color

  • tmpl.<template_name>.image.bg.color

  • tmpl.<template_name>.image.align

Article List - when using a 2 column layout

  • tmpl.<template_name>.bg.color

  • tmpl.<template_name>.border.color

Event List

  • tmpl.<template_name>.border.color

Gallery List - when using a 1 column layout

  • tmpl.<template_name>.bg.color

  • tmpl.<template_name>.border.color

  • tmpl.<template_name>.image.bg.color

  • tmpl.<template_name>.image.align

Gallery List - when using a 2 column layout

  • tmpl.<template_name>.bg.color

  • tmpl.<template_name>.border.color

Video List - when using a 1 column layout

  • tmpl.<template_name>.bg.color

  • tmpl.<template_name>.border.color

  • tmpl.<template_name>.image.bg.color

  • tmpl.<template_name>.image.align

Video List - when using a 2 column layout

  • tmpl.<template_name>.bg.color

  • tmpl.<template_name>.border.color

Table (Note: this is set as white by default for max visibility)

  • tmpl.<template_name>.bg.color

  • tmpl.<template_name>.border.color


So, what does this mean? Let's say you add a single column Article List component to your newsletter and give it the name of "articles1" in the Template field in the attributes:

You can then fine-tune the styling of this component only by adding the following Layout Options:

tmpl.articles1.bg.color

tmpl.articles1.border.color

tmpl.articles1.image.bg.color

tmpl.articles1.image.align

The template name (“articles1” in this example) can also be applied to other components in the same newsletter if you have multiple components you want to style the same way. 

Value examples are as follows for the component-specific Layout Options:

  • tmpl.<template_name>.bg.color - The value in this Layout Option should be a hex color code (ex: #F0F0F0)

  • tmpl.<template_name>.border.color - The value in this Layout Option should be a hex color code (ex: #000000)

  • tmpl.<template_name>.image.align - This is the vertical alignment of the image within the component (use top, middle, or bottom for the value)

  • tmpl.<template_name>.image.bg.color - This is used when an image is in portrait orientation in the newsletter. The value in this Layout Option should be a hex color code (ex: #FFFFFF)