Smart Email Builder Tools
|Time: Less than 5 minutes|
|Suggested Skills: HTML, CSS but not required|
|Objective: This article covers various tools within the Smart Email Builder that adjust the design in both the CSS and the HTML. To learn more about the steps to create a campaign with the Smart Email Builder, visit Designing an Email Using the Smart Email Builder.|
What's the difference between inline styling and CSS?
Inline: Inline styles are applied directly to the element itself. You can edit the inline styling through clicking on a content area and using the toolbar at the top of the editing window. You can also open the HTML and edit directly.
CSS: This stands for Cascading Style Sheet. Think of it as a template style-guide. It dictates how "tagged" elements appear within the campaign. You can edit styling that is supported by the CSS through the side-menu, which allows you to make a change to various elements in your design, such as headers, text regions, etc. So rather than edit multiple elements, which could take a long amount of time, this tool allows you to make the edit once and it affect all relevant regions. Jump to CSS Tools.
|B||Apply the bold font style to selected text.|
|I||Apply the italic font style to selected text.|
|U||Apply underlining to selected text.|
|ABC||Apply a strikethough selected text.|
|Align selected content (or a paragraph in which the cursor is located) based on a left-hand margin. If the alignment doesn’t change, alignment may have already been applied.|
|Align selected content (or a paragraph in which the cursor is located) based on the vertical mid-point.|
|Align selected content (or a paragraph in which the cursor is located) based on a right-hand margin.|
|Justify selected content (or a paragraph in which the cursor is located).|
|Change the text color.|
|Highlight the text using a selected color.|
|Paste copied text from Word. You copy the text to a window that opens when you click this button. You can edit the copied text and then insert it into the text content block.|
|Apply a font style that you choose to selected text.|
|Apply a font size that you choose to selected text. Font sizes are measured in pixels (px).|
|Bullet selected paragraphs.|
|Number selected paragraphs.|
|Decrease the indent for selected paragraphs.|
|Increase the indent for selected paragraphs.|
|Create a link at the cursor position.|
|Remove a selected link.|
|Insert a specialized link into the email campaign that, if clicked, will display additional content, such as an article, in a new browser window. This allows you to tease content. Note: These links cannot be copy and pasted.|
|Insert a link anchor.|
|Insert or edit an image.|
|Clean up messy code.|
|Learn about the editor.|
|Edit the HTML source for a text content block.|
|Insert a new table or edit a selected table.|
|Customize properties for table rows.|
|Customize properties for table cells.|
|Insert a table row above the current row.|
|Insert a table row below the current row.|
|Delete the current table row.|
|Insert a table column before the current column.|
|Insert a table column after the current column.|
|Delete the current table column.|
|Split merged table cells.|
|Merge table cells.|
|Add a horizontal line (rule).|
|Remove formatting of selected content in the editor.|
|Show or hide guidelines or invisible elements, such as link anchors or tables.|
|Apply superscript to selected text.|
|Apply subscript to selected text.|
|Add a symbol that you choose.|
|Insert a token.|
|Insert a survey link.|
|Insert an RSS element.|
The above menu may be different based on the template you've chosen, as the CSS can be constructed in a variety of ways. Learn more about how to build a template to be compatible with the Smart Email Builder. This is a general overview of the CSS menu for a very basic template.
Themes: Choose a theme to automatically dictate the styling of your email design.
Colors and Layout: Set the background color and image of your email design.
Top Bar: Set the text color, font, size and link color for the Top Bar content area.
Headlines: Set the text color, font, and size of the Headline content area(s).
Sub-Headline: Set the text color, font, and size of the Sub-Headline content area(s).
Content: Set the text color, font, size and link color for the general content area(s).
Action Link: Set the text alignment, color, font and size of your Action Link(s).
Footer: Set the text color, font, and size of the Footer content area.
Content Area Tools
|Copy the content area.|
|Move the content area down.|
|Move the content area up.|
|Remove the content area.|
|Hide/Show the image area associated with the content area.|