HTML - Beginner Help With Email Html Newsletter?
Hey, I built an email newsletter for a friend of mine using GoLive! It was fairly simple he wanted a header graphic and a green box on the left where he could put information about classes he was teaching/things relating to the articles in the email newsletter. Problem is... is that none of the ways I found to build it would come through safely in any email client, be it gmail, thunderbird, or otherwise.
I was hoping to find one of two things: a good template we could paste his stuff into, or a free program that we could build his newsletter that would be generally readable in most mail clients. What advice would you offer to me, I'm not extensively familiar with HTML again, i just recently got back into it after a break (too long, cuz i know little to nothing now except how to pick apart and analyze code, just not how to build from scratch!) Hence why I was using Adobe GoLive. If you could recommend a template or a program that would be free, that'd be fine... otherwise any comments or info would be great. thanks. Similar TutorialsHello to all. I have designed a newsletter in html that i am ready to email out to people. Only thing is the client wants the image to be displayed instantly with no attachments. So basically embedded into the email. Does anyone know how to do this? Reading other people's comments i am sure there is a way. If i insert the html ito the email itbecomes an attachment which i do not want? PLEASE HELP!!! Thanks Gray Hi, so I'm trying to make this e-mail newsletter. It's entirely images, tables and text. So no javascript, just plain stuff. I tried attaching it as a signiture file and I had trouble sending it. It also didn't come out right. I'm trying to avoid using a software. Its basically just a block of HTML I need to show up as the only content in an email. If you just put HTML into a email text field, it just shows the HTML code in the email as text. Any ideas? And i am having a problem. Here is an example i made for the problem. It is being made my someone who has no knowledge of html in dreamweaver and then the code being tweaked by someone who knows html to be perfect. A sample line of code that comes up is this. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> </head> <body> <img width="195" height="755" src="file:///C|/Users/dog/AppData/Roaming/Adobe/Dreamweaver CS4/en_US/OfficeImageTemp/clip_image002_0003.png" align="left" hspace="12" vspace="10" alt="Text Box: blah blah. " /> </body> </html> When i try to test emailing the file the picture does not show up. I know the reason. It is because it is on my computer and it cant find it. But the question is how do i get around this? The pictures and pieces of the newsletter are being made in a combination of Microsoft Word and Photoshop. Would i have to upload each picture to the internet and do it that way? Or is there a way i can imbed the pictures into the newsletter? I am using this through a yahoo email address using a program that allows you to send emails with html content through emails that do not allow html, such as yahoo. I appreciate any help. Thanks in advanced. Hello i'm new here and i'm in need of some help... i'm trying to send out a newsletter blast but when i copy the code from front page into the thirdparty to send out the newsletter when we send out a test the messege loooks all wrong why woould that be?? it shifts everything down or to the side..... please help.. here is the code from front page that i paste into the third party HTML Code: <html> <head> <title>Untitled-2</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <style> <!-- div.Section1 {page:Section1;} p.MsoNormal {margin:0in; margin-bottom:.0001pt; font-size:12.0pt; font-family:"Times New Roman";} --> </style> </head> <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> <div align="center"> <table id="Table_01" width="750" height="600" border="0" cellpadding="0" cellspacing="0"> <tr> <td colspan="9"> <a href="http://www.bootbarn.com/"> <img src="http://bootbarn.ws/newsletter/Blue%20Hornet/Welcome%20Letter/images/welcome_01.jpg" width="755" height="104" alt="" border="0"></a></td> </tr> <tr> <td rowspan="2"> <img src="http://bootbarn.ws/newsletter/Blue%20Hornet/Welcome%20Letter/images/welcome_02.jpg" width="8" height="650" alt=""></td> <td colspan="7"> <img src="http://bootbarn.ws/newsletter/Blue%20Hornet/Welcome%20Letter/images/welcome_03.jpg" width="738" height="609" alt=""></td> <td rowspan="2"> <img src="http://bootbarn.ws/newsletter/Blue%20Hornet/Welcome%20Letter/images/welcome_04.jpg" width="9" height="650" alt=""></td> </tr> <tr> <td> <a href="http://www.bootbarn.com/navigate/men"> <img src="http://bootbarn.ws/newsletter/Blue%20Hornet/Welcome%20Letter/images/welcome_05.jpg" width="95" height="41" alt="" border="0"></a></td> <td> <a href="http://www.bootbarn.com/navigate/women"> <img src="http://bootbarn.ws/newsletter/Blue%20Hornet/Welcome%20Letter/images/welcome_06.jpg" width="107" height="41" alt="" border="0"></a></td> <td> <a href="http://www.bootbarn.com/navigate/youth"> <img src="http://bootbarn.ws/newsletter/Blue%20Hornet/Welcome%20Letter/images/welcome_07.jpg" width="89" height="41" alt="" border="0"></a></td> <td> <a href="http://www.bootbarn.com/brand"> <img src="http://bootbarn.ws/newsletter/Blue%20Hornet/Welcome%20Letter/images/welcome_08.jpg" width="94" height="41" alt="" border="0"></a></td> <td> <a href="http://www.bootbarn.com/multiview/viewspecial/1/view/view"> <img src="http://bootbarn.ws/newsletter/Blue%20Hornet/Welcome%20Letter/images/welcome_09.jpg" width="111" height="41" alt="" border="0"></a></td> <td> <a href="http://www.bootbarn.com/multiview/viewspecial/1/view/view/0/12/new/All/All/All/All"> <img src="http://bootbarn.ws/newsletter/Blue%20Hornet/Welcome%20Letter/images/welcome_10.jpg" width="136" height="41" alt="" border="0"></a></td> <td> <div style="position: absolute; width: 711px; height: 587px; z-index: 1; left: 106px; top: 113px; border-style: outset; padding-left: 4px; padding-right: 4px; padding-top: 1px; padding-bottom: 1px" id="layer1"> <p class="MsoNormal"><font face="Arial" style="font-size: 11pt"> <span style="font-family: Arial">Dear (First Name),</span></font></p> <p class="MsoNormal"><font face="Arial" style="font-size: 11pt"> <span style="font-family: Arial"> </span></font></p> <p class="MsoNormal"><font face="Arial" style="font-size: 11pt"> <span style="font-family: Arial">Welcome to Boot Barn!</span></font></p> <p class="MsoNormal"><font face="Arial" style="font-size: 11pt"> <span style="font-family: Arial"> </span></font></p> <p class="MsoNormal"> <span style="font-family: Arial"><font face="Arial" style="font-size: 11pt"> We are excited to include you into our fast-growing e-mail program –and as a thank you for signing up with us, please enjoy a special <b>15% </b>off your next order.</font></span></p> <p class="MsoNormal"><font face="Arial" style="font-size: 11pt"> <span style="font-family: Arial">Just use code: <b> <span style="FONT-WEIGHT: bold">welcome</span></b> at checkout to redeem the offer. <u><a href="http://www.bootbarn.com/">Shop now</a></u></span></font></p> <p class="MsoNormal"><font face="Arial" style="font-size: 11pt"> <span style="font-family: Arial"> </span></font></p> <p class="MsoNormal"><font face="Arial" style="font-size: 11pt"> <span style="font-family: Arial">You can expect to receive special and sometimes exclusive offers in future e-mail newsletters, along with product updates related to our many brands.</span></font></p> <p class="MsoNormal"> </p> <p class="MsoNormal"> <font face="Arial" color="black" style="font-size: 11pt"> <span style="color: black; font-family: Arial">Boot Barn is a place you can trust. We’re proud to offer one of the world's largest boot <span class="grame">selections for</span> over 30 years!<b><span style="FONT-WEIGHT: bold"> </span></b> </span></font><font face="Arial" style="font-size: 11pt"><span style="font-family: Arial"> We started in <span class="grame">California in 1978 and we've been global for many years. </span>We are backed by over <u> <a href="http://www.bootbarn.com/indexflatfile/store_locator.html">80 retail store locations</a></u> in states ranging from California to Arizona, Nevada, New Mexico, Wyoming and.Montana.<span class="grame"></span></span></font></p> <p class="MsoNormal"> </p> <p class="MsoNormal"><span class="grame"> <font face="Arial" color="black" style="font-size: 11pt"> <span style="color: black; font-family: Arial">We carry the best boots in the business. Many of the brands we carry have a rich heritage and legacy of designing and manufacturing footwear for several decades! We strive to offer the best selection of top quality leather footwear in the styles you are looking for, and we are known for </span></font> <font face="Arial" style="font-size: 11pt"><span style="font-family: Arial">providing our customers with great quality service<U2:P></U2:P></span></font></span><font face="Arial" style="font-size: 11pt"><span style="font-family: Arial"> Over the years, we've expanded our product assortment to include men's, women's and youth clothing and a wide assortment of accessories.</span></font></p> <p class="MsoNormal"></p> <p class="MsoNormal"> <font face="Arial" color="black" style="font-size: 11pt"> <span style="color: black; font-family: Arial">And, while many websites wait for the one big blow-out sale to offer you value prices, we offer them everyday! Check our <a title="http://www.bootbarn.com/indexflatfile/about.html#lowprice" style="color: blue; text-decoration: underline" href="http://www.bootbarn.com/indexflatfile/about.html#lowprice"> low price guarantee</a>. </span></font><font face="Arial" style="font-size: 11pt"><span style="font-family: Arial">And, to be clear, we have a no nonsense privacy policy that NEVER shares, rents or <span class="grame">sells</span> your personal information and email addresses to outside third parties.<U3:P></U3:P></span></font></p> <p class="MsoNormal"><font face="Arial" style="font-size: 11pt"> <span style="font-family: Arial"> </span></font></p> <p class="MsoNormal"><font face="Arial" style="font-size: 11pt"> <span style="font-family: Arial">So, thanks for your interest and we look forward to serving your needs,</span></font></p> <p class="MsoNormal"><font face="Arial" style="font-size: 11pt"> <span style="font-family: Arial"> </span></font></p> <p class="MsoNormal"><font face="Arial" style="font-size: 11pt"> <span style="font-family: Arial">Sincerely,</span></font></p> <p class="MsoNormal"><font face="Arial" style="font-size: 11pt"> <span style="font-family: Arial"> </span></font></p> <p class="MsoNormal"><font face="Arial" style="font-size: 11pt"> <span style="font-family: Arial"> The Boot Barn Team</span></font></div> <a href="http://www.bootbarn.com/multiview/apparel/clothing"> <img src="http://bootbarn.ws/newsletter/Blue%20Hornet/Welcome%20Letter/images/welcome_11.jpg" width="106" height="41" alt="" border="0"></a></td> </tr> </table> </div> <!-- End ImageReady Slices --> </body> </html> I have a newsletter sent out via email to subscribers. IT has a table of contents with all the headings at beginning of the page. Here is my problem. I wanted the subscriber who receives the email to be able to click the heading and it takes them directly to the paragraph without all the scrolling. I did try this ( the original word doc you could do it and then i transfered it to html,but it opened the heading in the browser as a separate link. Its quite a long newsletter and as it is they scroll and scroll. Any advice? thanks. For some reason one part of my table isn't formatting correctly. I believe I've set it up correctly but one slice is not in the correct place. Any suggestions as to why? http://www.essencia-spa.com/december...l%20blast.html my code is easily viewable by View -> View Source EDIT: SOLVED. Just solved the issue with a colspan issue. Thanks to anyone who took a look at this. I've been working on an email blast in slices for the first time without the use of tables, yet I haven't been able to align the left bar with the other components on the right. How can I align these components so that they are all together? <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Untitled Document</title> </head> <body> <div style="width:550px;"> <div><img src="http://img263.imageshack.us/img263/9634/bottombox119.gif" width="1" height="31" /><img src="http://img98.imageshack.us/img98/7985/bottombox120.gif" width="549" height="31" /></div> <div style="float:right; clear:left; margin-right:0px; "><img src="http://img98.imageshack.us/img98/7985/bottombox120.gif" width="20" height="1218" /></div> <div style="float:right; clear:left; margin-right:0px; "> <img src="http://img179.imageshack.us/img179/2510/bottombox105.gif" width="311" height="158" /></div> <div style="float:right; margin-right:0px; "> <img src="http://img69.imageshack.us/img69/5752/bottombox104.gif" width="197" height="118" /></div> <div style="float:right; clear:left; margin-right:0px; "><img src="http://img692.imageshack.us/img692/3859/bottombox108.gif" width="311" height="165" /></div> <div style="float:right; clear:left; margin-right:0px; position:relative;"> <img src="http://img62.imageshack.us/img62/7371/bottombox107.gif" width="197" height="205" /></div> <div style="float:right; clear:left; margin-right:0px; "><img src="http://img87.imageshack.us/img87/2279/bottombox109.gif" width="243" height="220" /></div> <div ><img src="http://img98.imageshack.us/img98/7985/bottombox120.gif" width="22" height="1218" /></div> </div> </body> </html> Hello All, I am implementing an email newsletter. The problem I have is that when I open the newsletter in Outlook it does not look like the original web page newsletter. Does anyone have advice as to how to implement this functionality to have the email newsletter look like the web page news letter. Any suggestions recommendations or advice will be greatly appreciated. Thanks In Advance. Hi everyone, I've been searching around the web trying to find out how I can send using Outlook a html and text email newsletter automatically. I am quite happy creating html only newsletters, and text ones for that matter, but I have been digging and believe that by using multi-part code I can send to both and the recipients email client "allows" whichever version to be displayed - does this sound right? I'm hoping to simply create the html with the relevent mime references and boundaries (dont know what they are but have seen them on enough Google'd pages to know that they mean something!) and then copy and paste into Outlook - the newsletter is only going out to a few people at a time. Any suggestions or advice would be very greatly appreciated. Regards Allan I have created an html newsletter which is just about ready. I am trying to add a header image to top cell of table however when I preview the table expands and I get a bunch of whitespace. Image is set width and in edit mode appears fine. I am using Sharepoint Designer and Web Expression 2 but not luck removing all the whitespace. Any suggestions? thx hi! we are sending newsletter to clients. we are doing like: 1)creating newsletter in dreamweaver 2)running on brower 3)copy the entire layout using ctrl+a and 4) pasting it on new message window in outlook 5)its displaying as i copied everything is fine. its reaching to clients as we sent. the problem is the newsleter take more than 100 kb while its going. but actual size is just 50 only. so pls suggest what is the problem exactly. how to recude the file size or is there anyother way to send newsletter via outlook. pls suggest me Hi there, I have the almost impossible task to create a newsletter (text + pics) that contains a background image and needs to be distributed using Microsoft Business Contact Manager (Microsoft Outlook add-on). So, can you tell me if background images are 100% good html or not? If yes what could I be doing wrong (CSS, links to images...) Please help Marco Hi, I'm trying to insert HTML in Lotus Notes and I'm having problems figuring out how to do this... Currently it gives me the option to send a message in either rich text or plain text, but I see no option for HTML. The HTML newsletter has already been developed, I'm just trying to get it inserted in Lotus Notes- Can anyone help?? Hi, I am currently creating a HTML e-newsletter, and need the frame/template to essentially remain static. In other words, when the recepient alters the size of their preview/display panel in their email program (eg Outlook), the column widths/spacing and text size remains the same. Could anyone please advise as to how this is done? Thanks! Hello, I am only new to html and as practice i was told to create the table as shown using the code and have failed on multible occasions. I feel now the best help I can receive is to see where I am going wrong through comparison. Please have a look at the attached image and help if you can, thanks. (It is fairly simple). Hi guys. I'm hoping someone can help me edit the following code to include TWO required checkboxes (ex. I agree to terms of service, I agree to terms of use) and ONE submit button. So really not changing anything from how the code acts now, just adding an additional required checkbox. Thanks in advance! <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title></title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <style type="text/css"> .highlight{ outline: #f00 dotted 2px; } </style> <!--[if IE]> <style type="text/css"> .highlight{ border:2px dotted #f00; } </style> <![endif]--> <script type="text/javascript"> window.onload=function(){ document.forms[0].onsubmit=function(){ return checkIt(); } } function checkIt() { if(document.getElementById('tos').checked==false) { alert('you need to check the "I accept terms of service" box'); document.getElementById('tos').className='highlight' return false; } else { document.getElementById('tos').className=''; return true; } } </script> </head> <body> <form action="#"> <div> <input id="tos" type="checkbox"><label for="tos"> I accept terms of service</label> <input type="submit"> </div> </form> </body> </html> Hello Everyone Thank god for this website! I have a couple of problems I will start with my ebay storefront page I want to put in a Scolling Text Button in between to words and it's not working. I know it is probley some thing simple but for some reason I cant catch on to this HTML Code: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><HTML><HEAD><TITLE></TITLE> <META content="Evrsoft First Page" name=GENERATOR> <STYLE type=text/css>.shtc_niceTopHeader { FONT-WEIGHT: bold; FONT-SIZE: 12px; COLOR: #000000; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; BACKGROUND-COLOR: #990066 } .shtc_niceDesc { FONT-SIZE: 10px; COLOR: #000000; FONT-FAMILY: Arial, Helvetica, sans-serif; BACKGROUND-COLOR: #990066 } .shtc_featured_text { FONT-SIZE: 10px; COLOR: #000033; FONT-FAMILY: Arial, Helvetica, sans-serif; BACKGROUND-COLOR: #990033 } .shtc_featured_head { FONT-WEIGHT: bold; FONT-SIZE: 12px; COLOR: #000000; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; BACKGROUND-COLOR: #990033 } .shtc_niceBorder { BACKGROUND-COLOR: #cccccc } .shtc_nicePromo { FONT-WEIGHT: bold; FONT-SIZE: 18px; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; LETTER-SPACING: -0.05em } </STYLE> </HEAD> <BODY onload=Change();Place();Time()> <TABLE class=shtc_niceBorder cellSpacing=0 cellPadding=2 width="100%" border=0><TBODY> <TR> <TD class=shtc_niceBorder> <TABLE cellSpacing=0 cellPadding=2 width="100%" bgColor=#ffffff border=0><TBODY> <TR> <TD class=shtc_featured_head vAlign=top width=310> <TABLE class=shtc_niceBorder cellSpacing=0 cellPadding=3 width=310 border=0> <TBODY> <TR> <TD class=shtc_featured_text vAlign=top rowSpan=2><A href="http://cgi.ebay.com/ws/eBayISAPI.dll?ViewItem&item=260041564092"><IMG height=72 src="http://thumbs.ebaystatic.com/pict/260041564092.jpg" width=96 border=0></A></TD> <TD class=shtc_featured_head vAlign=top height=10>Thimbleberries 10 Yards</TD></TR> <TR> <TD class=shtc_featured_text vAlign=top width="100%" height=80>Up For Bid This Week 10 yards Of Thimbleberrie Fabic (RJR) Dont Miss out on this Bunddle!!<BR><A href="http://cgi.ebay.com/ws/eBayISAPI.dll?ViewItem&item=260048164832">Click Here</A></TD></TR></TBODY></TABLE></TD> <TD class=shtc_niceTopHeader vAlign=top width="33%"> <TABLE cellSpacing=0 cellPadding=3 width="100%" border=0> <TBODY> <TR> <TD class=shtc_niceTopHeader align=left colSpan=2>Fleece Blanket SALE!</TD></TR> <TR> <TD class=shtc_niceDesc vAlign=top> <TABLE class=shtc_niceBorder cellSpacing=0 cellPadding=1 border=0> <TBODY> <TR> <TD vAlign=top><HTTP: border="0" width="60" src="http://thumbs.ebaystatic.com/pict/260043272222.jpg" height="45" Rags-to-Stitches_Fleece-Blankets-Sale-19-99_W0QQcolZ4QQdirZ1QQfsubZ6878021QQftidZ2QQtZkm<img stores.ebay.com></A></TD></TR></TBODY></TABLE></TD> <TD class=shtc_niceDesc vAlign=top width="100%"> <P align=center><FONT size=4><FONT face="Curlz MT"><STRONG>You Choose any Fleece Blanket For 19.95 </STRONG></FONT><BR></FONT></A> <FORM><INPUT onclick="window.location.href='http://stores.ebay.com/Rags-to-Stitches_Fleece-Blankets-Sale-19-99_W0QQcolZ4QQdirZ1QQfsubZ6878021QQftidZ2QQtZkm'" type=button value="Click Here"><A href="Click Here"></A></A></FORM></P></TD></TR></TBODY></TABLE></TD> <TD class=shtc_niceTopHeader vAlign=top width="33%"> <TABLE cellSpacing=0 cellPadding=3 width="100%" border=0> <TBODY> <TR> <TD class=shtc_niceTopHeader align=left colSpan=2>Fat Quarter Book With Bonus Fat Quarters</TD></TR> <TR> <TD class=shtc_niceDesc vAlign=top> <TABLE class=shtc_niceBorder cellSpacing=0 cellPadding=1 border=0> <TBODY> <TR> <TD vAlign=top><A href="http://cgi.ebay.com/ws/eBayISAPI.dll?ViewItem&item=260043276477"><IMG height=45 src="http://thumbs.ebaystatic.com/pict/260043276477.jpg" This is just a draft see I have Evrsoft 2006 and when I get the scripts some work and some dont my next problem is I would like to make a fabric calcuator and I dont know where to start because it will need to be in inches and % I would like to know how or were to start to make this calculator http://batstoquilters.netfirms.com/fabriccalc.html In Advace I would like to Thank any one who is will to help me Jodie hello everyone, can u possibly help me with the following? I have a very basic knowledge of how html works. I have basically used officelive.com to build a website via point and click. It allows you to add certain bits via html, but that is it. Now here what i am trying to do... I am trying to build a tool (?) that aids in diagnosis of medical problems. And I want it to look a little like this: Page 1 Does the patient have a fever? Yes No ( yes and no appear as buttons) Page 2 (if u click on yes) Does the patient have associated syptoms? Yes No Page 3 (if you click on Yes) Which of the following symptoms does the patient have? a. rigors b. chills c. neck rigidity d. other (text box to enter your free text) Now what I need help with is, that if the user chooses D and enters their free text, I want it to show up on the next page as part of the next question.... 1. So e.g Used enters "hypotension" in the free text box, I want the next question on the next page to be able to say "What is the duration of the hypotension?" I would also like it so that at the end of the process the user can end up with a list of all the symptoms, both picked and free text as a summary. I dont even know that this function is called, as if I know what its called I can always find html codes on the internet. Please help. This must be so simple for you IT lot! I, as u can tell trained in a completely unrelated field and am struggling. |