 e-mail design with Constant Contact |
  |
| Shauna |
 Jan 16 2014, 08:47 AM
Post
#1
|
|
Group: Members Posts: 2 Joined: 14-January 14 Member No.: 20,229  |
I am new to html/xhtml and am trying to design a custom auto-response welcome e-mail through Constant Contact. Please bare with me, as I am brand new to the language and have what I have so far through online tutorials and how-to's. So far what I have as far as coding is:
<html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:cctd="http://www.constantcontact.com/cctd"> <head> <title>$Letter.Subject</title> </head> <body class="body"><CopyRight>Copyright © 1996-2014 Constant Contact. All rights reserved. Except as permitted under a separate written agreement with Constant Contact, neither the Constant Contact software, nor any content that appears on any Constant Contact site, including but not limited to, web pages, newsletters, or templates may be reproduced, republished, repurposed, or distributed without the prior written permission of Constant Contact. For inquiries regarding reproduction or distribution of any Constant Contact material, please contact legal@constantcontact.com.</CopyRight> <center><img src="https://origin.ih.constantcontact.com/fs194/1104566193416/img/884.jpg?ver=1382665583000" alt="VKOP_Header_01" align="left"/> <img src="https://origin.ih.constantcontact.com/fs194/1104566193416/img/885.jpg?ver=1382665583000" alt="VKOP_Header_02" align="left"/> <img src="https://origin.ih.constantcontact.com/fs194/1104566193416/img/886.jpg?ver=1382665583000" alt="VKOP_Header_03" align="left"/> <img src="https://origin.ih.constantcontact.com/fs194/1104566193416/img/887.jpg?ver=1382665584000" alt="VKOP_Header_04" align="left"/> <img src="https://origin.ih.constantcontact.com/fs194/1104566193416/img/888.jpg?ver=1382665584000" alt="VKOP_Header_05" align="left"/> <img src="https://origin.ih.constantcontact.com/fs194/1104566193416/img/889.jpg?ver=1382665584000" alt="VKOP_Header_06" align="left"/> <img src="https://origin.ih.constantcontact.com/fs194/1104566193416/img/890.jpg?ver=1382665585000" alt="VKOP_Header_07" align="left"/> </center> <center><img src="https://origin.ih.constantcontact.com/fs194/1104566193416/img/931.jpg?ver=1389707727000" alt="VKOP_Header_08" align="left"/></center> <table align="center" border="0"> <tr><td bgcolor="#FFCB40"><a href="http://www.visitkop.com/featured-retail-dining"><font face="arial, helvetica" color="000000" size="2"><strong>Retail & Dining</strong></font></a> |</td> <td bgcolor="#FFCB40"><a href="http://www.visitkop.com/hospitality"><font face="arial, helvetica" color="000000" size="2"><strong>Hotels & Attractions</strong></font></a> |</td> <td bgcolor="#FFCB40"><a href="http://www.visitkop.com/business"><font face="arial, helvetica" color="000000" size="2"><strong>Business</strong></font></a> |</td> <td bgcolor="#FFCB40"><a href="http://connectkop.com"><font face="arial, helvetica" color="000000" size="2"><strong>Getting to KOP</strong></font></a> |</td> <td bgcolor="#FFCB40"><a href="http://connectkop.com/transit-options/theconnector/"><font face="arial, helvetica" color="000000" size="2">the<strong>connector</strong></font></a></td></tr> </table> <br></br> <!--BEING: "MAINTABLE"--> <text align="left" ><font face="arial, helvetica" color="#FF6347" size="3"><strong>WELCOME</strong></font></text> <br></br><br></br> <text align="left"><font face="arial, helvetica" color="#000000 " size="2">Welcome to the King of Prussia District's eNewsletter <strong>Simply Informative</strong>! On the first Tuesday of each month you will receive our e-mail newsletter detailing news, promotions and events happening in King of Prussia, PA! Occasionally, we will send out event notices on other days of the week for special events that we think you'll enjoy.<br></br><br></br> We encourage you to explore <a href="http://www.visitkop.com"> <font color="000000"> <strong>visitKOP.com</strong></font></a> to learn about our 500+ premier retail shops, 60+ restaurants, 15 relaxing and luxurious hotels, exciting events, business resources and so much more! <br></br><br></br> Please note that privacy is important to us; therefore, we will not sell, rent, or give your address to anyone. At any point, you can select the lik at the bottom of every e-mail to unsubscribe (although we hope that never happens!).<br></br><br></br> If you have any questions or comments, feel free to contact us.<br></br><br></br> Thank you again for registering!</font></text> <center><img src="https://origin.ih.constantcontact.com/fs088/1104566193416/img/197.gif?ver=1389707727000" alt="eric_goldstein" align="left"/></center> <text align="left"><font face="arial, helvetica" color="#000000 " size="2"><br></br><br></br><br></br><br></br><br></br><br></br> Eric Goldstein<br></br> <em>Executive Director</em></font></text><br></br><br></br><br></br> <center><img src="https://origin.ih.constantcontact.com/fs194/1104566193416/img/940.jpg?ver=1389707727000" alt="koperks" align="center"/></center> </body> </html> I have an option to use 'xhtml' and 'style' pages, although I am generally lost as far as CSS. For my style sheet all I have is as follows: .BODY{ BACKGROUND-COLOR: #231F20; MARGIN: 0px 10px 0px 10px; } .MAINTABLEBG{ BACKGROUND-COLOR: #FFFFFF; .SUBTITLETEXT{ FONT-FAMILY: Arial,Helvetica,Sans-serif; FONT-SIZE: 8pt; COLOR: #231F20; } The MAINTABLEBG does not function as I don't have a clearly defined main table, something I have been trying to create. My goals are to 1.Create a white box surrounding the main body text so the perimeter is grey and the text is black with a white background (it is only white now for readability as I have been struggling trying to create the white background). 2.Make the yellow line with links below the header solid and centered and without the grey spacing between links. Preferably this line would span the width of the photo above it 3.Add an auto-response personalized name before welcome (a feature which is included in the generic welcome letter but I can't figure out what coding in the generic is this feature. 4.I also noted in a test e-mail that the pictures move around based on the size of the e-mail when I open in and only when i expand it fully is everything placed correctly, how can I fix this? Any help would be greatly appreciated! |
  |
 
|
| pandy |
Jan 16 2014, 09:49 AM
Post
#2
|
|
🌟Computer says no🌟  Group: WDG Moderators Posts: 20,730 Joined: 9-August 06 Member No.: 6 |
Is that supposed to be processed and changed on the Constant Contact server before it is sent out? Because it contains variables and several of the elements used don't exist and the page looks peculiar in a browser and would probably be even worse in an email client.
Hard to know what to do about it without knowing what it will be transformed into... |
|
|
|
| Shauna |
Jan 16 2014, 10:24 AM
Post
#3
|
|
Group: Members Posts: 2 Joined: 14-January 14 Member No.: 20,229 |
I'm building it in Constant Contact. Maybe I should ask more basic questions. For example, when I'm defining a class in Constant Contact I am writing
<table class="maintable"> and then when I put something in the style sheet i.e .MAINTABLE{ Background-color:000000; } it is not making the style changes. It only worked for the body when I defined the body class in html and make changes to the style sheet. I'm not sure why it won't work for other classes. |
|
|
|
| pandy |
Jan 16 2014, 11:11 AM
Post
#4
|
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,730 Joined: 9-August 06 Member No.: 6 |
I'm not familiar with that service.
In the example you gave now, the color value lacks a hash sign. It should be like this. CODE background-color: #000000 |
|
|
|
|
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:
|
Lo-Fi Version | Time is now: 19th April 2024 - 12:29 PM |
Invision Power Board
© 2024 IPS, Inc.
Licensed to: HTMLHelp.com, LLC