Gibt es eine Möglichkeit richtige HTML Mails zu versenden, wie die folgende? [code]
/* Mobile-specific Styles */ @media only screen and (max-device-width: 480px) { table[class=w0], td[class=w0] { width: 0 !important; } table[class=w10], td[class=w10], img[class=w10] { width:10px !important; } table[class=w15], td[class=w15], img[class=w15] { width:5px !important; } table[class=w30], td[class=w30], img[class=w30] { width:10px !important; } table[class=w60], td[class=w60], img[class=w60] { width:10px !important; } table[class=w125], td[class=w125], img[class=w125] { width:80px !important; } table[class=w130], td[class=w130], img[class=w130] { width:55px !important; } table[class=w140], td[class=w140], img[class=w140] { width:90px !important; } table[class=w160], td[class=w160], img[class=w160] { width:180px !important; } table[class=w170], td[class=w170], img[class=w170] { width:100px !important; } table[class=w180], td[class=w180], img[class=w180] { width:80px !important; } table[class=w195], td[class=w195], img[class=w195] { width:80px !important; } table[class=w220], td[class=w220], img[class=w220] { width:80px !important; } table[class=w240], td[class=w240], img[class=w240] { width:180px !important; } table[class=w255], td[class=w255], img[class=w255] { width:185px !important; } table[class=w275], td[class=w275], img[class=w275] { width:135px !important; } table[class=w280], td[class=w280], img[class=w280] { width:135px !important; } table[class=w300], td[class=w300], img[class=w300] { width:140px !important; } table[class=w325], td[class=w325], img[class=w325] { width:95px !important; } table[class=w360], td[class=w360], img[class=w360] { width:140px !important; } table[class=w410], td[class=w410], img[class=w410] { width:180px !important; } table[class=w470], td[class=w470], img[class=w470] { width:200px !important; } table[class=w580], td[class=w580], img[class=w580] { width:280px !important; } table[class=w640], td[class=w640], img[class=w640] { width:300px !important; } table[class*=hide], td[class*=hide], img[class*=hide], p[class*=hide], span[class*=hide] { display:none !important; } table[class=h0], td[class=h0] { height: 0 !important; } p[class=footer-content-left] { text-align: center !important; } #headline p { font-size: 30px !important; } .article-content, #left-sidebar{ -webkit-text-size-adjust: 90% !important; -ms-text-size-adjust: 90% !important; } .header-content, .footer-content-left {-webkit-text-size-adjust: 80% !important; -ms-text-size-adjust: 80% !important;} img { height: auto; line-height: 100%;} } /* Client-specific Styles */ #outlook a { padding: 0; } /* Force Outlook to provide a "view in browser" button. */ body { width: 100% !important; } .ReadMsgBody { width: 100%; } .ExternalClass { width: 100%; display:block !important; } /* Force Hotmail to display emails at full width */ /* Reset Styles */ /* Add 100px so mobile switch bar doesn't cover street address. */ body { background-color: #262626; margin: 0; padding: 0; } img { outline: none; text-decoration: none; display: block;} br, strong br, b br, em br, i br { line-height:100%; } h1, h2, h3, h4, h5, h6 { line-height: 100% !important; -webkit-font-smoothing: antialiased; } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: blue !important; } h1 a:active, h2 a:active, h3 a:active, h4 a:active, h5 a:active, h6 a:active { color: red !important; } /* Preferably not the same color as the normal header link color. There is limited support for psuedo classes in email clients, this was added just for good measure. */ h1 a:visited, h2 a:visited, h3 a:visited, h4 a:visited, h5 a:visited, h6 a:visited { color: purple !important; } /* Preferably not the same color as the normal header link color. There is limited support for psuedo classes in email clients, this was added just for good measure. */ table td, table tr { border-collapse: collapse; } .yshortcuts, .yshortcuts a, .yshortcuts a:link,.yshortcuts a:visited, .yshortcuts a:hover, .yshortcuts a span { color: black; text-decoration: none !important; border-bottom: none !important; background: none !important; } /* Body text color for the New Yahoo. This example sets the font of Yahoo's Shortcuts to black. */ /* This most probably won't work in all email clients. Don't include blocks in email. */
code {
white-space: normal;
word-break: break-all;
}
#background-table { background-color: #262626; }
/* Webkit Elements */
#top-bar { border-radius:6px 6px 0px 0px; -moz-border-radius: 6px 6px 0px 0px; -webkit-border-radius:6px 6px 0px 0px; -webkit-font-smoothing: antialiased; background-color: #009EE0; color: #BBBBBB; }
#top-bar a { font-weight: bold; color: #FFFFFF; text-decoration: none;}
#footer { border-radius:0px 0px 6px 6px; -moz-border-radius: 0px 0px 6px 6px; -webkit-border-radius:0px 0px 6px 6px; -webkit-font-smoothing: antialiased; }
/* Fonts and Content */
body, td { font-family: 'Helvetica Neue', Arial, Helvetica, Geneva, sans-serif; }
.header-content, .footer-content-left, .footer-content-right { -webkit-text-size-adjust: none; -ms-text-size-adjust: none; }
/* Prevent Webkit and Windows Mobile platforms from changing default font sizes on header and footer. */
.header-content { font-size: 12px; color: #BBBBBB; }
.header-content a { font-weight: bold; color: #FFFFFF; text-decoration: none; }
#headline p { color: #444444; font-family: 'Helvetica Neue', Arial, Helvetica, Geneva, sans-serif; font-size: 48px; text-align: left; margin-top:0px; margin-bottom:30px; }
#headline p a { color: #444444; text-decoration: none; }
.article-title { font-size: 18px; line-height:24px; color: #262626; font-weight:bold; margin-top:0px; margin-bottom:18px; font-family: 'Helvetica Neue', Arial, Helvetica, Geneva, sans-serif; }
.article-title a { color: #262626; text-decoration: none; }
.article-title.with-meta {margin-bottom: 0;}
.article-meta { font-size: 13px; line-height: 20px; color: #ccc; font-weight: bold; margin-top: 0;}
.article-content { font-size: 13px; line-height: 18px; color: #777777; margin-top: 0px; margin-bottom: 18px; font-family: 'Helvetica Neue', Arial, Helvetica, Geneva, sans-serif; }
.article-content a { color: #009EE0; font-weight:bold; text-decoration:none; }
.article-content img { max-width: 100% }
.article-content ol, .article-content ul { margin-top:0px; margin-bottom:18px; margin-left:19px; padding:0; }
.article-content li { font-size: 13px; line-height: 18px; color: #777777; }
.article-content li a { color: #009EE0; text-decoration:underline; }
.article-content p {margin-bottom: 15px;}
.footer-content-left { font-size: 12px; line-height: 15px; color: #BBBBBB; margin-top: 0px; margin-bottom: 15px; }
.footer-content-left a { color: #FFFFFF; font-weight: bold; text-decoration: none; }
.footer-content-right { font-size: 11px; line-height: 16px; color: #BBBBBB; margin-top: 0px; margin-bottom: 15px; }
.footer-content-right a { color: #FFFFFF; font-weight: bold; text-decoration: none; }
#footer { background-color: #009EE0; color: #BBBBBB; }
#footer a { color: #FFFFFF; text-decoration: none; font-weight: bold; }
#permission-reminder { white-space: normal; }
#street-address { color: #FFFFFF; white-space: normal; }
|
| |
|
| |
| |
Webversion | Einstellungen bearbeiten | Abmelden
| |
| |
| |
| 
| |
Gefällt mir
| | 
| |
Tweet
| | 
| |
Weiterleiten
|
| |
| |
|
|
| | | |
| |
Titel der Mail
| |
|
| |
|
| |
<layout label="Text only">
<table class="w580" width="580" cellpadding="0" cellspacing="0" border="0">
<tbody>
Add a title
Enter your description
<layout label="Text with full-width image">
<table class="w580" width="580" cellpadding="0" cellspacing="0" border="0">
<tbody>
Add a title
![]()
Enter your description
<layout label="Text with right-aligned image">
<table class="w580" width="580" cellpadding="0" cellspacing="0" border="0">
<tbody>
Add a title
![]()
Enter your description
<layout label="Text with left-aligned image">
<table class="w580" width="580" cellpadding="0" cellspacing="0" border="0">
<tbody>
Add a title
![]()
Enter your description
<layout label="Two columns">
<table class="w580" width="580" cellpadding="0" cellspacing="0" border="0">
<tbody>
Add a title
Enter your description
Add a title
Enter your description
<layout label="Image gallery">
<table class="w580" width="580" cellpadding="0" cellspacing="0" border="0">
<tbody>
![]()
Enter your description
![]()
Enter your description
![]()
Enter your description
| |
|
| |
|
| | | | | |
| |
Abonnement bearbeiten | Abmelden
| |
Muster
Muster
Muster
Muster
Muster
| |
| | | | | |
|
| |
|
[/code] Egal ob als Plaintext oder als HTML Mail, es kommen stets Fehler wegen den “webkit” Attributen. Das Template ist für alle gängigen Mail Clients gedacht und funktioniert via MailChimp super. LG