Advanced Editor User’s Guide Page 3 ©Constant Contact, Inc. All rights reserved. 2/08 Preface What This Guide Contains Terms Used in this Book Exploring the Advanced Editor Why Use the Advanced Editor? An Introduction XHTML/HTML Template Text Mode Style Mode A Look at the Code HTML in the Advanced Editor Spacer Images 1 Emails versus Web Pages Using Styles Advanced Editor User’s Guide Page 4 ©Constant Contact, Inc. All rights reserved. 2/08 How Constant Contact Uses Styles Styles in Constant Contact CSS Syntax Common CSS Properties and Values De ning and Adding Styles Adding Style De nitions Adding Style De nitions to Constant Contact Tags Using the Font Tag with Style Classes Using Constant Contact Tags Constant Contact Tag Overview Types of Tags Property Tags Block Tags Wizard Display vs. HTML Mode Display Tag Reference 2 2 Forwarorw; r18;퀀d.../Forwar&#x/For;&#xwar1;贀d IfPr&#xIfPr;op;rty;xis;&#xts00;opertyExists.../IfPr&#x/IfP;&#xr18o;&#xpert;&#xyExi;&#xsts0;opertyExists 3 PhysicalAddr&#xPhys;&#xical;r;Ǝs;&#xs000;ess.../PhysicalAddr&#x/Phy;&#xsica;&#xlAdd;&#xr18e;&#xss00;ess Pr&#xPr18;&#xoper;&#xty00;operty.../Pr&#x/Pr1;ope;&#xrty0;operty Advanced Editor User’s Guide Page 5 ©Constant Contact, Inc. All rights reserved. 2/08 3 3 SimpleURLPr&#xSimp;&#xleUR;&#xLPr1;ope;&#xrty0;operty.../SimpleURLPr&#x/Sim;&#xpleU;&#xRLPr;op;rty;operty Using Prede ned Variables Account Variables Global Account Variable Changes Contact Properties List of Contact Properties Contact Data Uploading Contact Data Where Variables Display in the Advanced Editor Property Tag PropertyPair Tag Explanation of Pr&#xPr18;&#xoper;&#xty00;operty Tag Common Tasks Using Contact Properties Adding Contact Information Using Contact Custom Field Information Locating Variables and Paragraphs in Your Email Avoid ForEach Loops Tables and Overall Layout Customizing Emails 5 Advanced Editor User’s Guide Page 6 ©Constant Contact, Inc. All rights reserved. 2/08 Preparing Your Design A Note About Link Tracking Image Maps Creating a Custom Email Using Your Own Code Debugging your Email Tip: Line Numbers Reported by Advanced Editor Testing your Email Common XHTML Errors Best Practices General Design Guidelines Know Your Audience Maximize Performance Tables, Width, and Nesting Color Flexibility Coding Standards Additional Email Design Resources 6 Advanced Editor User’s Guide Page 7 ©Constant Contact, Inc. All rights reserved. 2/08 Preface This guide describes how to customize emails using the Constant Contact Advanced Editor. While the Wizard allows you to make many changes to your emails, the Advanced Editor gives you a far greater ability to make additional The Advanced Editor User Guide is for account holders who want to customize their emails beyond the standard templates. Users should be familiar with web design tools, including HTML and XHTML. What This Guide Contains The following table lists the contents of this guide. Exploring the Advanced Discusses why you might want to use the Advanced Editor and introduces you to the user interface. Also includes a brief overview of XHTML. Chapter 1 Using Styles modify the layouts of permission reminders, footers, and links that Constant Contact provides. Chapter 2 Using Constant Contact Tags Describes how to use Constant Contact tags to modify the lay outs of permission reminders, footers, and links that Constant Contact provides. Chapter 3 Using Prede ned Variables Lists the prede ned variables and explains how they are used to personalize your emails. Chapter 4 Customizing Emails provides an overview of steps to design and test your email. Chapter 5 Best Practices Discusses email design basics, and some limitations of HTML and XHTML code. Chapter 6 The following are the text conventions used in this guide. Typeface In text, italics are used for emphasis. In reference information, italics denotes values you supply Words in courier font denote keywords and sample code. name = [name of Bold text indicates clickable items in a user interface. Preview Terms Used in this Book The following table lists terms and acronyms used in this document: Term account properties Information that Constant Contact stores about your account, such as your contact name, address, and web site, and makes them available in emails. Advanced Editor User’s Guide Page 8 ©Constant Contact, Inc. All rights reserved. 2/08 Term Advanced Constant Contact editing environment that allows you to make changes to your email that are not available in the Wizard. A statistic on the Reports tab that tracks the number of unique clicks on click-through links. through links Links in your email to your website that are tracked. Constant Contact tracks the href attribute sup plied in the anchor tag. Constant Contact tags XML custom tags for implementing Constant Contact templates, properties, and the Wizard. An email user who has given you permission to send emails. properties Information that Constant Contact stores about your contacts and makes them available in emails for you to personalize your messages. The HTML formatted email message that you create by using the Constant Contact Wizard. You can customize this email using the Advanced Editor before sending it to your list of contacts. email client Application that displays email messages. It can be either a client-side application running on an individual computer (such as Outlook, Eudora, or Communicator) or a web-based email application link tracking Constant Contact reports statistics on links de ned in emails to keep track of how many contacts open the emails and click to your web site from the email. several templates that Constant Contact provides. Those emails your contacts received and viewed. Wizard The user interface you use to create a Constant Contact email from a template. XHTML EXtensible Hyper Text Markup Language. It is a stricter and cleaner version of HTML, which is almost identical to HTML 4.01, and is aimed to replace HTML. Web application standard for transmitting data independent of software and hardware. Allows web developers to de ne custom tags for use in XHTML documents. Advanced Editor User’s Guide Page 9 ©Constant Contact, Inc. All rights reserved. 2/08 Exploring the Advanced Editor The Constant Contact Advanced Editor allows you to make changes in your email that you cannot do in the Wizard. While the Wizard allows you to make many changes to the colors and fonts and contents of your email, there are some occasions where you’ll want to customize your email even more. This chapter provides an overview of the Advanced Editor, and covers: Why you might use the Advanced Editor An introduction to the Advanced Editor Why Use the Advanced Editor? structions to build the Wizard you used to create your email. That is, when you choose a template category and style from the Template Picker, Constant Contact generates a Wizard according to the template instructions. You can view (but not edit) these instructions in the Advanced Editor. However, you can use the Advanced Editor to make changes that are not available in the Wizard. Typically, when customizing an email, you start out by choosing a template from one of the many standard templates available in the Template Picker. But if you need more control over your HTML layout, you may want to import your HTML or XHTML into the custom template, and edit it using the Advanced Editor. Using the Advanced Editor to modify your email for a more unique look, you can: Make minor changes to the layout, like changing the location of sidebars. Modify or add more styles. Personalize your emails (this is also available through the Wizard). Move sections to a different area of the email. An Introduction This section gives you an overview and describes the different modes of the Advanced Editor. To open the Advanced Editor: Log in to Constant Contact. a. Open an existing email by clicking on its name. b. Click Edit Email. a. Click Create an Email. b. Name the email and click Next. If using the Classic Email Wizard i. Choose a template and click Next. i. Choose the link “Use My Own Code” in the lower left. ii. Choose HTML or XHTML and click Next. Advanced Editor User’s Guide Page 10 ©Constant Contact, Inc. All rights reserved. 2/08 If using the New Wizard i. Choose the link “Use My Own Code” in the lower left. ii. Choose HTML or XHTML and click Next. In the Wizard, click the Advanced Editor link on the bottom left of the window. The Advanced Editor window There are links to the editor’s modes: HTML – Displays the instructions for generating an email. The code includes Constant Contact properties and tags in addition to HTML tags. Text – Displays the layout instructions for generating a text-based email. *Style mode is only available when you choose XHTML. XHTML/HTML Template When you rst open the Advanced Editor, the HTML mode is selected. However, you may notice that this is not ordinary HTML. You’ll see code that includes many Constant Contact speci c tags such as: OpenTracking &#xOpen;&#xTrac;&#xking;&#x 60/;/ Advanced Editor User’s Guide Page 11 ©Constant Contact, Inc. All rights reserved. 2/08 These are Extensible Markup Language (XML) tags. XML allows for a standard way to transmit unique data. A web the data. XHTML has stricter syntax rules than HTML, to improve performance and avoid platform-speci c issues. Constant Contact created unique XML tags to describe data speci c to managing emails and display emails in the Wizard. Text Mode The Text mode displays the instructions for generating a text-based email. It contains all the Constant Contact tags Style Mode FONT-FAMILY: Georgia,’Times New Roman’,Times,serif; FONT-SIZE: 10pt; COLOR: #000000; BACKGROUND-COLOR: #FFFFFF; MARGIN: 10px; FONT-FAMILY: Georgia,’Times New Roman’,Times,serif; FONT-SIZE: 16pt; COLOR: #996600; Refer to Chapter 2, Using Styles for more information. A Look at the Code The code that you see in the HTML mode is not strict HTML code: it is a combination of standard HTML, XHTML, and Constant Contact tags used to build the Wizard and display your email properly. HTML in the Advanced Editor All emails have the same basic HTML structure. For example, &#xtitl;title !--Title that appears on Subject line of &#x!--T;&#xitle;&#x 60t;&#xhat ;؊p;&#xpear;&#xs 60;&#xon 6;�Sub;&#xject;&#x 60l;&#xine ;`of;&#x 60e;&#xmail;&#x--00;email-- Advanced Editor User’s Guide Page 12 ©Constant Contact, Inc. All rights reserved. 2/08 ...Content of HTML document... You will see some common HTML tags that control how the document looks: &#xp000;p &#x/p00;/p iv0;div &#x/div;/div and all tags must have beginning and end tags. For example, XHTML requires all tags to be closed (e.g., &#xp000;p.../ p). XHTML is very similar to HTML, but when you begin using XHTML, you may run into common coding errors. These common errors are described in “Common XHTML Errors” in Chapter 5. zation which is responsible for standardizing HTML and other web standards. See http://www.w3schools.com for tutorials and reference information. Spacer Images You will see references to a spacer image (spacer.gif). For example, table border=”0” cellpadding=”0” cellspacing=”0” &#xtabl; 60; ord;r=0;&#x 60c;llp;i;&#xng=0;&#x 60c;lls;&#xpaci;&#xng=0;&#x 60w;&#xidth;&#x=100;&#x%000;width=”100%” td colspan=”1” &#xtd 6;ol;&#xspan;&#x=1 6;�row;&#xspan;&#x=100;rowspan=”1”img height=”5” src=”http://imgcc.com/spacer.gif” &#x/td0;width=”600”//td This is a common way for web designers to control layout. The spacer image is a 1 pixel by 1 pixel transparent GIF that expands to the width and height speci ed. In the above example, spacer.gif draws a row that is 600 pixels wide by 5 pixels high. Comments indicate blocks of related information. For example, !-- BEGIN: Logo Include &#x!-- ;悾&#xGIN:;&#x 60L;&#xogo ;`In;lud; 60;&#x--00;-- ... Content of Logo Include block... !-- END: Logo Include &#x!-- ;؎N; : 6;�Log;&#xo 60;&#xIncl;&#xude ;`--;-- tend to have the following sections: Title Introduction Advanced Editor User’s Guide Page 13 ©Constant Contact, Inc. All rights reserved. 2/08 promotions, press releases, and so on Contact information or email signature When you open the Advanced Editor from the Wizard, you don’t see the results of changes you made in the Wizard. To see your Wizard changes, click Preview, from either the Wizard or the Advanced Editor. Constant Contact then displays your email according to the instructions shown in the Advanced Editor, using the information you supplied in the Wizard as shown in the following gure. Advanced Editor User’s Guide Page 14 ©Constant Contact, Inc. All rights reserved. 2/08 Preview simulates the process of generating an email, which occurs when you schedule the email. From Preview, you can right-click and view the HTML source code that Constant Contact generates, as shown in the example below. This HTML code may look more familiar to you. Now that Constant Contact has expanded the information to hold the values you supplied in the Wizard, you are looking at plain HTML: sans-serif;FONT-SIZE: 14pt;FONT-WEIGHT: bold;COLOR: #FF0000;” This is my headline. This is the code that your contacts receive in their mailboxes. Emails versus Web Pages With Constant Contact, you are creating web-based emails for viewing within email applications. It is important to designed speci cally for email viewing through email applications. These email applications can be either: Email clients – programs resident on a users’ computer, such as AOL, Eudora, Lotus Notes, Outlook Express Mail.com, and Yahoo! on the email client your contacts use. applications. Advanced Editor User’s Guide Page 15 ©Constant Contact, Inc. All rights reserved. 2/08 Using Styles You can modify and add styles in the Advanced Editor to have greater control over the look of your email. This chap how to display HTML elements and help separate layout elements from content elements. An advantage of using styles is that they can ripple through, or cascade, to all HTML elements associated with that style throughout the document, without having to be de ned each time that element is used. The result is cleaner code that is much easier to work with. Styles can be de ned: At the top of an HTML document (internal styles). Within a speci c HTML element (inline styles). Many ISP’s strip out references to external les. once by editing a single CSS document. To make a global change across all emails, simply change the style in this head section of each HTML document with a &#xlink;link tag as follows: href=”websitestyles.css” / Internal styles are used to de ne visual elements that are unique to a single document. You de ne internal styles at the top of an HTML document (in the head section) by using the &#xstyl;style tag, like this: style &#xstyl; 60;&#xtype;&#x=tex;&#xt/cs;&#xs000;type=”text/css” .body { background-color: #ffffff; margin: 10px 0px 10px 0px; font-weight: bold How Constant Contact Uses Styles how all the styles are de ned for the current email. To add or modify style information, you edit the styles here. Advanced Editor User’s Guide Page 16 ©Constant Contact, Inc. All rights reserved. 2/08 If you modify the style that is on the Global Colors and Fonts page, it will update to re ect those changes. Inline styles apply to a single occurrence of an HTML element. De ne inline styles with the style attribute within the HTML tag. The style attribute can contain any CSS property: p style=”color: sienna; margin-left: &#xp 60;&#xstyl;=co;&#xlor:;&#x 60s;&#xienn; 6;�mar;&#xgin-;&#xleft;&#x: 60; px;20px” This is a paragraph However, when Constant Contact sends your email, it actually generates inline styles. This is because some email browsers strip any style information that appears at the top of an email message. Preview your email and then view it in source code to see how Constant Contact expands all its properties and generates HTML code. Notice that the &#xstyl;style section has been mostly replaced by inline styles as follows: td align=”left” colspan=”1” rowspan=”1” &#xtd 6; li;&#xgn=l;ït ;،o;&#xlspa;&#xn=1 ;`ro;&#xwspa;&#xn=1 ;`va;&#xlign;&#x=top;valign=”top” style=”font-family: Arial, Helvetica, sans-serif; font-size: COLOR: #000000;” What’s the font tag doing here? If we are using styles, the ont;font tag should not be necessary. However, some web- based email applications, like AOL Web Mail, strip inline styles. For Constant Contact to ensure that your email ren see “Using the Font Tag with Style Classes” on page 20. Styles in Constant Contact In the Style mode of the Advanced Editor, you can see that CSS styles are used to display fonts, whitespace, and colors. You can add more styles to the class de nitions in the Style mode, as long as you use standard CSS-de ned syntax. You can also add new HTML elements, including Constant Contact tags, in the HTML mode, and add their class de nitions in the Style mode. The Advanced Editor incorporates this style information when generating your CSS Syntax The class selector allows you to name or classify types of elements according to their type. For example, some templates contain event classes to describe how to lay out an Event (template) email. The event CSS de nes a class for different elements in an event: its name, text, headlines, and details. In the Styles mode, the rules for each class selector are de ned as shown in the following example. Notice each class selector starts with a period. FONT-SIZE: 12pt; FONT-WEIGHT: bold; COLOR: #000066; FONT-SIZE: 10pt; COLOR: #000000; Advanced Editor User’s Guide Page 17 ©Constant Contact, Inc. All rights reserved. 2/08 FONT-WEIGHT: bold; FONT-SIZE: 10pt; COLOR: #000000; FONT-STYLE: italic; FONT-WEIGHT: bold; FONT-SIZE: 12pt; FONT-WEIGHT: bold; FONT-SIZE: 10pt; COLOR: #000066; FONT-WEIGHT: bold; Common CSS Properties and Values Property Category Properties Background background background-attachment background-color background-image background-position background-repeat Controls the background of an element. You can set the background to be a color or an image, position an image on the page, or repeat the background image vertically or horizontally. Text word-spacing Controls the appearance of text. CSS 2 speci cation allows you to specify direc tion (justi cation) and unicodebidi. Advanced Editor User’s Guide Page 18 ©Constant Contact, Inc. All rights reserved. 2/08 Property Category Properties Speci es font types. CSS 2 speci cation allows you to specify font-size-align and Border border border-color border-style border-width border-bottom border-right border-left De nes the borders around an element. De nes the space around elements. You can use negative values to overlap content, and you can set the top, right, bottom, and left margins using separate properties. A shorthand margin property allows you to change all the margins at border and the element content. You can change the top, right, bottom, and left padding using separate properties. A shorthand padding property allows you to control multiple sides at once. Negative values are not allowed. ers (bullets), and where to place them. A allows you to specify the length of the De ning and Adding Styles able when using XHTML format; it does not display if you are using the Custom HTML format. Adding Style De nitions style information as long as you follow CSS syntax. You can use any of the CSS styles in your emails. However, not all styles are supported in all email applications. Use only alphanumeric characters in style names. Advanced Editor User’s Guide Page 19 ©Constant Contact, Inc. All rights reserved. 2/08 Use the Style mode to de ne class styles only (.Classname). You cannot de ne ID styles (#IDname) or styles for tags To add styles: De ne your styles in the Style mode. For example: color: #000179; background-color: #00008B; font-size: medium; Do not include comments in the Style mode. In the HTML mode, reference your style. For example: body ody;&#x 60c;&#xlass;&#x=bod;&#xy000;class=”body” ensures that more email clients display your styles as intended. Adding Style De nitions to Constant Contact Tags If you are using XHTML, you can add styles to Constant Contact tags as you do with other HTML tags. The following font-weight: bold; font-size: larger; In the HTML mode, reference your style as follows: Some Constant Contact tags, such as the Forward tag, support the class attribute for you to modify styles. In the Style mode: font-weight: bold; font-size: small; color: #00008B; text-align: center; In the HTML mode, Forward is referenced as follows: Forward orw; rd ;،l; ss=;orw; rds;&#xtyle;class=”forwardstyle”Forward to a &#x/For;&#xward;Friend/Forward The class inside the Forward tag affects only the anchor ꀀa tag. You may need to add p &#xp 60;las;&#xs=fo;&#xrwar; sty;&#xle00;class=”forwardstyle”Forward orw; rd ;،l; ss=;orw; rds;&#xtyle;class=”forwardstyle” Advanced Editor User’s Guide Page 20 ©Constant Contact, Inc. All rights reserved. 2/08 Forward to a &#x/For;&#xward;Friend/Forward &#x/p00;/p Using the Font Tag with Style Classes Even though Constant Contact emails use styles, you often see the deprecated ont;font tag used throughout the emails in the Advanced Editor. This is to support some web-based email applications that strip inline styles. When adding style information within your email, use a font tag and a separate class for font-family, font-size, and color Only font (font-family, font-size, color), background (background-color), and border (bordercolor) are supported in the Constant Contact Wizard. Any other style is editable through the Constant Contact Advanced Editor. Do not use the abbreviated CSS styles. All styles must be de ned as a class and each class selector must begin with a period. A style that displays on the Wizard must have a title attribute. The title attribute speci es the style prompt text on the Wizard. If a style does not have a title attribute, it does not display on the Wizard. Email applications are inconsistent in how they support styles. As a result, some CSS styles may not display as expected in some email applications. Borders are troublesome, for example. Be sure to test your design by opening an email in various email applications to ensure it displays correctly. Advanced Editor User’s Guide Page 21 ©Constant Contact, Inc. All rights reserved. 2/08 Using Constant Contact Tags The XHTML instructions in the Advanced Editor that build your email include Constant Contact de ned tags. Some tags are strictly for creating templates and their accompanying Wizards. However, you may want to use some of these tags in your emails. Constant Contact Tag Overview These tags are inserted into your code in the HTML mode, just like any other HTML or XHTML tags. Do not edit Constant Contact tags in the Advanced Editor unless you are familiar with web design tools and HTML. Types of Tags There are two major groupings of Constant Contact tags: those you can use in the Advanced Editor, and those used by Constant Contact template designers. You will see all of them but cannot use the tags that are used internally by Constant Contact template designers. Tags can be grouped into categories, as shown in the following table. Available Tags In the Wizard, de nes a text eld and a section tab. Property See “Property Tags” on page 23 for descriptions, and ad ditional information. Performs an action. Standard tags that re quire little to no editing. Advanced Editor User’s Guide Page 22 ©Constant Contact, Inc. All rights reserved. 2/08 Available Tags header, body, and footer inserted into the Wizard by Constant Contact. These tags are used to manipulate the default values and are not typically used by Constant Contact tags are used to customize your email in several ways: Using Block tags to cut and paste elements in your email. Using Message Header, Body, and Footer tags to add links and make very minor changes to the layout. email will not report opens. You can use tags to make changes in each major section within the email: Message Header, Footer, and Body. The following table supplies page numbers for more information on the tags you can use within your email. To modify Constant Contact Tags to Use See Page Message header Message footer Message body ... Forwardン�o30;&#xr30w;ィ�r30;팀.../Forward0/3;༰&#xo30r;0w3;ਰ&#xr30d;0 IfPropertyExists0I3;༰&#xP30r;0o3;�p30;ะr;0t3;�y30;ะx;0i3;�s30;&#xt30s;0.../IfPropertyExists0/3;�I30;༰P;0r3;�o30;&#xp30e;0r3;�t30;&#xy30E;0x3;�i30;&#xs30t;0s3; PhysicalAddress0P3;�h30;&#xy30s;0i3;రਰl;ィരരr;ャ�s30;&#xs300;.../PhysicalAddress0/3;�P30;&#xh30y;0s3;�i30;쌊0l3;ਰ팍0r3;ะ&#xs30s;0 Property0P3;�r30;&#xo30p;ャ�r30;&#xt30y;0.../Property0/3;�P30;&#xr30o;0p3;ะ&#xr30t;0y3; SignupBox0S3;�i30;&#xg30n;0u3;�p30;ରo;0x3; .../SignupBox0/3;�S30;&#xi30g;0n3;�u30;&#xp30B;0o3;0 SignupLink0S3;�i30;&#xg30n;0u3;�p30;&#xL30i;0n3;�k30;.../SignupLink0/3;�S30;&#xi30g;0n3;�u30;&#xp30L;0i3;�n30;&#xk300; &#xSimp;&#xleUR;&#xLPro;&#xpert;&#xy000;&#x/Sim;&#xpleU;&#xRLPr;&#xoper;&#xty00;SimpleURLProperty.../SimpleURLProperty Advanced Editor User’s Guide Page 23 ©Constant Contact, Inc. All rights reserved. 2/08 Property Tags Constant Contact has several tags for de ning properties that hold information about your email (not all of these are available to you). These include: ImagePr&#xImag;Pr1;ope;&#xrty0;operty Pr&#xPr18;&#xoper;&#xty00;operty Pr&#xPr18;&#xoper;&#xtyPa;&#xir00;opertyPair SimpleURLPr&#xSimp;&#xleUR;&#xLPr1;ope;&#xrty0;operty URLPr operty The value for these properties are stored in a Constant Contact database. These properties contain default values as speci ed in a standard template. When you enter information in the Wizard and save it, the properties are updated with your information. When you click Preview, Constant Contact dynamically builds the email, displaying the current values for the properties from its database. and holds the title of your email: A user edits the title box in the Wizard... click Preview. Advanced Editor User’s Guide Page 24 ©Constant Contact, Inc. All rights reserved. 2/08 Block Tags Constant Contact template designers use Block tags with HTML to control the layout of your email. Block tags Intr&#xIntr;od;&#xucti;&#xon00;oduction Pr&#xPr18;&#xomot;&#xion0;omotion These tags also control the Wizard layout. For example, an email containing the code: Article title=”Article rti;le ;`ti;&#xtle=; rti;le ;怐1” ...code to layout article email and that appear on article page of Wizard creates the Wizard as shown below: Many of the Constant Contact tags determine the appearance of the Wizard and have no affect on the emails that are generated. Only a few tags are used for modifying your email. These are listed in “Constant Contact Tag Overview” starting on page 21. The article appears as a button on the sidebar, and displays this article page when clicked. The article title displays as a label on the button and on the banner of this page. Advanced Editor User’s Guide Page 25 ©Constant Contact, Inc. All rights reserved. 2/08 Wizard Display vs. HTML Mode Display the Wizard. If you used the Wizard to create your email, you may notice that the information from the Wizard does not display in the HTML mode in the Advanced Editor. This is because Constant Contact provides some basic func tionality and requirements for every email. The Wizard automatically displays the following pages: Message Header Contains the email’s subject, contact person, and from and reply email addresses. The wizard also allows you to choose to display a permission reminder at the top of your email. Message Footer Contains general required account information such as your physical address. Use the Wizard to add links to allow contacts to forward this message to a friend or to join your email list. Global Fonts and Contains style information for many elements that display in the Wizard. This tool allows you to specify font styles and colors, and change the colors of some graphic elements of the layout (i.e., background color). Tag Reference The following section provides a reference for the Constant Contact tags that are available to you. You can add and De nes a link in your email to encourage email contacts to con rm their email addresses. This is NOT industry stan dard. The onr;&#xmOpt;&#xin00;Con rmOptin tag is only useful for changing the appearance or behavior of the permission reminder link. Constant Contact automatically supplies this tag in a Wizard edit box when you select Permission Reminder in the Message Header section. Message Body Optional Attributes Value Name of the style class (from the Style mode) that contains font and color information for this tag. Do not send the contact welcome Reference the link style by specifying a class, for example, Con rmStyle: Advanced Editor User’s Guide Page 26 ©Constant Contact, Inc. All rights reserved. 2/08
Advanced Editor User S Guide