Dynamic Content Style Guide

Print Friendly and PDF Follow

Dynamic Content is a great way to bring Events and News into your email messages. Before you can utilize Events and News, a Dynamic Content Style needs to exist. The following styles are a great starting point for attractive styles. Feel free to set them to your brand colors.

Event Style 1: Date Box - Title - Text - Link

Event_Style_1.png

Steps to create:

Select Layout:
DateBox_Title_Text_Link.bmp

Call to Action Text:

 Read More

Settings used to create the style shown above:

Borders: Primary Secondary Tertiary Buttons
    Color: Red
Size: 1px
Sides: All
   
Background Color: Primary Secondary Tertiary Buttons
      Red  
Headers: H1 H2 H3  
 

Color: Dark Gray
Font: Verdana
Bold
Font Size: 18
Line Height: 3

Color: White
Font: Verdana
Font Size: 18
Line Height: 27
Color: Black
Font: Georgia
Font Size: 30
Line Height: 40
 
Text: Body Hyperlink Buttons  
 

Color: Black
Font: Verdana
Font Size: 14
Line Height: 21

Color: Red Color: Black
Font: Arial
Font Size: 14
 
Buttons: Primary      
  Padding: M
Radius: 0
     

 

Event Style 2: Date Box - Title - Text

Event_Style_2.png

Steps to create:

Select Layout:

DateBox_Title_Text.png

Call to Action Text:

 N/A

Settings used to create the style shown above:

Borders: Primary Secondary Tertiary Buttons
    Color: Blue
Size: 2 px
Sides: All
   
Background Color: Primary Secondary Tertiary Buttons
      Blue  
Headers: H1 H2 H3  
 

Color: Black
Font: Arial
Bold
Font Size: 20
Line Height: 18

Color: White
Font: Arial
Font Size: 20
Line Height: 18
Color: Blue
Font: Arial
Font Size: 24
Line Height: 24
 
Text: Body Hyperlink Buttons  
 

Color: Black
Font: Arial
Font Size: 14
Line Height: 21

Color: Blue Color: Black
Font: Arial
Font Size: 14
 
Buttons: Primary      
  Padding: M
Radius: 0
     

 

Event Style 3: Title - Date Box - Text -Link

Event_Style_3.png

Steps to create:

Select Layout:
Title_DateTime_Text_Link.png

Call to Action Text:

 Learn More >>

Settings used to create the style shown above:

Borders: Primary Secondary Tertiary Buttons
         
Background Color: Primary Secondary Tertiary Buttons
         
Headers: H1 H2 H3  
 

Color: Red
Font: Arial
Bold
Font Size: 15
Line Height: 15

Color: Black
Font: TimesNewRoman
Font Size: 14
Line Height: 14
Color: Black
Font: TimesNewRoman
Font Size: 24
Line Height: 14
 
Text: Body Hyperlink Buttons  
 

Color: Black
Font: Arial
Font Size: 14
Line Height: 21

Color: Red Color:
Font:
Font Size:
 
Buttons: Primary      
  Padding: M
Radius: 0
     

 

News Style 1: Left Thumbnail Image - Title - Text - Button

News_Style_1.png

Steps to create:

Select Layout:
LeftThumb_Title_Text_Button.png

Call to Action Text:

 Read More

Settings used to create the style shown above:

Borders: Primary Secondary Tertiary Buttons
  Color: Light Gray
Size: 1 px
Sides: Bottom
     
Background Color: Primary Secondary Tertiary Buttons
         Blue
Headers: H1 H2 H3  
 

Color: Blue
Font: Helvetica
Font Size: 18
Line Height: 18

Color: Black
Font: Arial
Font Size: 18
Line Height: 27
Color: Black
Font: Arial
Font Size: 16
Line Height: 24
 
Text: Body Hyperlink Buttons  
 

Color: Dark Gray
Font: Helvetica
Font Size: 13
Line Height: 16

  Color: White
Font: Helvetica
Font Size: 13 px
 
Buttons: Primary      
  Padding: M
Radius: 0
     

 

News Style 2: Image - Title - Text - Button - TwoColumn

News_Style_2.png

Steps to create:

Select Layout:
Image_Title_Text_Button_TwoCol.png

Call to Action Text:

 Read More

Settings used to create the style shown above:

Borders: Primary Secondary Tertiary Buttons
         
Background Color: Primary Secondary Tertiary Buttons
         Blue
Headers: H1 H2 H3  
 

Color: Blue
Font: Helvetica
Font Size: 18
Line Height: 30

Color: Black
Font: Arial
Font Size: 18
Line Height: 27
Color: Black
Font: Arial
Font Size: 16
Line Height: 24
 
Text: Body Hyperlink Buttons  
 

Color: Dark Gray
Font: Helvetica
Font Size: 13
Line Height: 16

  Color: White
Font: Helvetica
Font Size: 13px
 
Buttons: Primary      
  Padding: M
Radius: 0
     

 

RSS Style 1: Title - Text - Full Width
RSS_Style_1.png

Steps to create:

Select Layout:
Title_Text_Full.png

Settings used to create the style shown above:

Borders: Primary Secondary Tertiary Buttons
         
Background Color: Primary Secondary Tertiary Buttons
         
Headers: H1 H2 H3  
 

Color: Black
Font: Georgia
Font Size: 18
Line Height: 21

Color: Black
Font: Arial
Font Size: 18
Line Height: 27
Color: Black
Font: Arial
Font Size: 16
Line Height: 24
 
Text: Body Hyperlink Buttons  
 

Color: Dark Gray
Font: Helvetica
Font Size: 14
Line Height: 20

 Color: Blue Color: Black
Font: Arial
Font Size: 14px
 
Buttons: Primary      
  Padding: M
Radius: 0