Description
Newsletter Artisan allows you to create dynamic newsletters using your posts form WordPress CMS as content. One of the features is that you are able to create a showcase of themes for your newsletters. These can be used in everyday work by content editors to updated your subscribed website users about new posts on the page.
Newsletter developers can use Newsletter Artisan to create new themes inside of WordPress CMS. To get the data all you have to do is to use Mustache syntax and reference objects documented.
Arbitrary section
Below is an example theme. You can use it to get your project up and running. You may find the same code in ‘template_snippets’ folder of the plugin.
<html><head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
body {
margin: 0;
padding: 0;
min-width: 100%;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
td {
padding: 0;
vertical-align: top;
}
.spacer,
.border {
font-size: 1px;
line-height: 1px;
}
.spacer {
width: 100%;
}
img {
border: 0;
-ms-interpolation-mode: bicubic;
}
.image {
font-size: 0;
Margin-bottom: 25px;
}
.image img {
display: block;
}
.logo img {
display: block;
}
strong {
font-weight: bold;
}
h1,
h2,
h3,
p,
ol,
ul,
li {
Margin-top: 0;
}
ol,
ul,
li {
padding-left: 0;
}
.btn a {
mso-hide: all;
}
blockquote {
Margin-top: 0;
Margin-right: 0;
Margin-bottom: 0;
padding-right: 0;
}
.column-top {
font-size: 60px;
line-height: 60px;
}
.column-bottom {
font-size: 34px;
line-height: 34px;
}
.column {
text-align: left;
}
.contents {
width: 100%;
}
.padded {
padding-left: 60px;
padding-right: 60px;
}
.wrapper {
display: table;
table-layout: fixed;
width: 100%;
min-width: 620px;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
}
table.wrapper {
table-layout: fixed;
}
.one-col,
.two-col,
.three-col {
Margin-left: auto;
Margin-right: auto;
width: 600px;
}
.two-col .image {
Margin-bottom: 23px;
}
.two-col .column-bottom {
font-size: 37px;
line-height: 37px;
}
.two-col .column {
width: 300px;
}
.two-col .first .padded {
padding-left: 60px;
padding-right: 30px;
}
.two-col .second .padded {
padding-left: 30px;
padding-right: 60px;
}
.three-col .image {
Margin-bottom: 21px;
}
.three-col .column-bottom {
font-size: 39px;
line-height: 39px;
}
.three-col .column {
width: 200px;
}
.three-col .first .padded {
padding-left: 60px;
padding-right: 0;
}
.three-col .second .padded {
padding-left: 30px;
padding-right: 30px;
}
.three-col .third .padded {
padding-left: 0;
padding-right: 60px;
}
@media only screen {
.wrapper {
text-rendering: optimizeLegibility;
}
}
@media only screen and (max-width: 620px) {
[class*=wrapper] {
min-width: 320px !important;
width: 100% !important;
}
[class*=wrapper] .one-col,
[class*=wrapper] .two-col,
[class*=wrapper] .three-col {
width: 320px !important;
}
[class*=wrapper] .column,
[class*=wrapper] .gutter {
display: block;
float: left;
width: 320px !important;
}
[class*=wrapper] .padded {
padding-left: 30px !important;
padding-right: 30px !important;
}
[class*=wrapper] .block {
display: block !important;
}
[class*=wrapper] .hide {
display: none !important;
mso-hide: all; /* hide elements in Outlook 2007-2013 */
}
[class*=wrapper] .image {
margin-bottom: 25px !important;
}
[class*=wrapper] .image img {
height: auto !important;
width: 100% !important;
}
[class*=social_col_first] {
width: 0px !important;
}
[class*=social_col_second] {
width: 300px !important;
}
[class*=spacer_hide] {
height: 0px !important;
}
}
.wrapper h1 {
font-weight: 400;
}
.wrapper h2 {
font-weight: 400;
}
.wrapper h3 {
font-weight: bold;
}
.wrapper p,
.wrapper ol,
.wrapper ul {
font-weight: 400;
}
.wrapper blockquote p,
.wrapper blockquote ol,
.wrapper blockquote ul {
font-style: italic;
font-weight: 500;
}
.wrapper .column table:nth-last-child(2) td h1:last-child,
.wrapper .column table:nth-last-child(2) td h2:last-child,
.wrapper .column table:nth-last-child(2) td h3:last-child,
.wrapper .column table:nth-last-child(2) td p:last-child,
.wrapper .column table:nth-last-child(2) td ol:last-child,
.wrapper .column table:nth-last-child(2) td ul:last-child {
Margin-bottom: 25px;
}
.wrapper a {
transition: all .2s;
}
.wrapper .preheader,
.wrapper .header,
.wrapper .footer,
.wrapper .feature {
Margin-left: auto;
Margin-right: auto;
}
.wrapper .one-col,
.wrapper .two-col,
.wrapper .three-col {
background-color: #ffffff;
border-radius: 4px;
box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1);
}
.wrapper center.divider {
Margin-bottom: 25px;
}
.wrapper center.divider img {
display: block;
Margin-left: auto;
Margin-right: auto;
}
.wrapper .preheader {
width: 600px;
}
.wrapper .preheader table {
width: 540px;
}
.wrapper .preheader .inner {
padding-top: 11px;
padding-bottom: 12px;
}
.wrapper .preheader .title {
text-align: left;
}
.wrapper .preheader .webversion {
text-align: right;
width: 240px;
}
.wrapper .preheader .webversion a {
letter-spacing: 0.03em;
}
.wrapper .preheader .title a,
.wrapper .preheader .webversion a {
font-weight: bold;
text-decoration: none;
}
.wrapper h1 a,
.wrapper h2 a,
.wrapper h3 a {
text-decoration: none;
}
.wrapper h1 {
font-size: 36px;
Margin-bottom: 21px;
text-align: center;
}
.wrapper h2 {
font-size: 24px;
Margin-bottom: 20px;
}
.wrapper h3 {
font-size: 15px;
Margin-bottom: 16px;
}
.wrapper p,
.wrapper ol,
.wrapper ul {
font-size: 15px;
}
.wrapper p a,
.wrapper ol a,
.wrapper ul a {
text-decoration: none;
}
.wrapper p a:hover,
.wrapper ol a:hover,
.wrapper ul a:hover {
border-bottom: none !important;
}
.wrapper ol,
.wrapper ul {
Margin-left: 39px;
}
.wrapper blockquote {
Margin-left: 1em;
padding-left: 1em;
}
.wrapper .btn {
Margin-bottom: 25px;
}
.wrapper .btn a {
background-image: url(https://i1.createsend1.com/static/eb/customise/02-blush/images/btn-one-col.png);
background-position: center center;
background-size: cover;
display: inline-block;
font-size: 15px;
font-weight: 400;
line-height: 25px;
padding: 8px 24px 9px 24px;
text-align: center;
text-decoration: none;
text-shadow: 0 1px 0 rgba(0, 0, 0, 0.1);
transition: all .2s;
width: 432px;
}
.wrapper .btn a:hover {
opacity: .9;
}
.preheader .title,
.preheader .webversion,
.footer .padded {
font-size: 11px;
font-weight: normal;
letter-spacing: 0.01em;
line-height: 17px;
}
.two-col .column table:nth-last-child(2) td h1:last-child,
.two-col .column table:nth-last-child(2) td h2:last-child,
.two-col .column table:nth-last-child(2) td h3:last-child,
.two-col .column table:nth-last-child(2) td p:last-child,
.two-col .column table:nth-last-child(2) td ol:last-child,
.two-col .column table:nth-last-child(2) td ul:last-child {
Margin-bottom: 23px;
}
.two-col h1 {
font-size: 32px;
Margin-bottom: 18px;
}
.two-col h2 {
font-size: 20px;
Margin-bottom: 16px;
}
.two-col h3 {
font-size: 14px;
Margin-bottom: 14px;
}
.two-col p,
.two-col ol,
.two-col ul {
font-size: 14px;
}
.two-col ol,
.two-col ul {
Margin-left: 32px;
}
.two-col center.divider {
Margin-bottom: 23px;
}
.two-col .btn {
Margin-bottom: 23px;
}
.two-col .btn a {
background-image: url(https://i2.createsend1.com/static/eb/customise/02-blush/images/btn-two-col.png);
font-size: 14px;
line-height: 23px;
padding: 7px 24px 8px 24px;
width: 162px;
}
.three-col .column table:nth-last-child(2) td h1:last-child,
.three-col .column table:nth-last-child(2) td h2:last-child,
.three-col .column table:nth-last-child(2) td h3:last-child,
.three-col .column table:nth-last-child(2) td p:last-child,
.three-col .column table:nth-last-child(2) td ol:last-child,
.three-col .column table:nth-last-child(2) td ul:last-child {
Margin-bottom: 21px;
}
.three-col h1 {
background-image: none;
font-size: 26px;
Margin-bottom: 16px;
}
.three-col h2 {
font-size: 18px;
Margin-bottom: 12px;
}
.three-col h3 {
font-size: 13px;
Margin-bottom: 10px;
}
.three-col p,
.three-col ol,
.three-col ul {
font-size: 13px;
}
.three-col ol,
.three-col ul {
Margin-left: 24px;
}
.three-col center.divider {
Margin-bottom: 21px;
}
.three-col .btn {
Margin-bottom: 21px;
}
.three-col .btn a {
background-image: url(https://i4.createsend1.com/static/eb/customise/02-blush/images/btn-three-col.png);
font-size: 13px;
line-height: 21px;
padding: 5px 24px 6px 24px;
width: 92px;
}
.feature-top,
.feature-bottom {
background-color: #ffffff;
font-size: 0;
line-height: 0;
width: 600px;
}
.feature-top img,
.feature-bottom img {
display: inline-block;
}
.feature-top {
padding-bottom: 44px;
}
.feature-bottom {
padding-top: 31px;
}
.feature {
background-color: #ffffff;
width: 600px;
}
.feature .column-top {
font-size: 44px;
line-height: 44px;
}
.feature .column-bottom {
font-size: 10px;
line-height: 10px;
}
.feature .one-col {
text-align: center;
width: 510px;
}
.wrapper .feature .one-col {
box-shadow: none;
}
.feature .padded {
padding-left: 44px;
padding-right: 44px;
}
.feature h2 {
text-align: center;
}
.feature h3 {
text-align: center;
}
.feature p {
text-align: center;
}
.feature ol,
.feature ul {
text-align: left;
}
.feature blockquote {
border-left: 0;
Margin-left: 0;
padding-left: 0;
}
.wrapper .feature .btn a {
background-image: url(https://i3.createsend1.com/static/eb/customise/02-blush/images/btn-feature.png);
width: 372px;
}
.frame-bottom td {
line-height: 9px;
}
.frame-bottom .left,
.frame-bottom .right {
width: 245px;
}
.heart {
vertical-align: middle;
width: 18px;
}
.heart img {
display: block;
}
.header {
width: 600px;
}
.logo {
font-size: 42px;
line-height: 50px;
padding-top: 40px;
padding-bottom: 37px;
text-align: center;
}
.logo img {
Margin-left: auto;
Margin-right: auto;
}
.wrapper .logo a {
text-decoration: none;
}
.footer {
width: 600px;
}
.footer .divider {
line-height: 11px;
width: 100%;
}
.footer #address a,
.footer #permission a {
text-decoration: none;
font-weight: normal;
}
.social td {
padding: 0 13px 40px 13px;
vertical-align: middle;
}
.social img {
vertical-align: middle;
}
.social span {
mso-text-raise: 6px;
}
.forward,
.facebook,
.twitter {
display: inline-block;
font-size: 12px;
font-weight: 400;
line-height: 12px;
text-decoration: none;
text-transform: uppercase;
}
.footer .contents {
width: 600px;
}
.footer .contents a {
font-weight: 700;
text-decoration: none;
}
.address,
.campaign {
font-size: 11px;
font-weight: 400;
line-height: 19px;
padding-bottom: 40px;
-webkit-font-smoothing: antialiased;
}
.address {
text-align: left;
padding-left: 30px;
padding-right: 10px;
width: 45%;
}
.campaign {
text-align: right;
padding-right: 30px;
padding-left: 10px;
width: 55%;
}
.campaign .links a {
font-weight: bold;
}
.column .rounded-image-bleed:first-child .gnd-corner-image-top.gnd-corner-image-center {
border-top-left-radius: 4px;
-moz-border-top-left-radius: 4px;
border-top-right-radius: 4px;
-moz-border-top-right-radius: 4px;
}
.column .rounded-image-bleed:first-child .gnd-corner-image-top.gnd-corner-image-left {
border-top-left-radius: 4px;
-moz-border-top-left-radius: 4px;
border-top-right-radius: 0;
-moz-border-top-right-radius: 0;
}
.column .rounded-image-bleed:first-child .gnd-corner-image-top.gnd-corner-image-right {
border-top-left-radius: 0;
-moz-border-top-left-radius: 0;
border-top-right-radius: 4px;
-moz-border-top-right-radius: 4px;
}
.first.column .rounded-image-bleed:first-child .gnd-corner-image-top.gnd-corner-image-center,
.first.column .rounded-image-bleed:first-child .gnd-corner-image-top.gnd-corner-image-left {
border-top-left-radius: 4px;
-moz-border-top-left-radius: 4px;
border-top-right-radius: 0;
-moz-border-top-right-radius: 0;
}
.two-col .second.column .rounded-image-bleed:first-child .gnd-corner-image-top.gnd-corner-image-center,
.two-col .second.column .rounded-image-bleed:first-child .gnd-corner-image-top.gnd-corner-image-right {
border-top-left-radius: 0;
-moz-border-top-left-radius: 0;
border-top-right-radius: 4px;
-moz-border-top-right-radius: 4px;
}
.three-col .second.column .rounded-image-bleed:first-child .gnd-corner-image-top.gnd-corner-image-center,
.three-col .second.column .rounded-image-bleed:first-child .gnd-corner-image-top.gnd-corner-image-right,
.three-col .second.column .rounded-image-bleed:first-child .gnd-corner-image-top.gnd-corner-image-left {
border-top-left-radius: 0;
-moz-border-top-left-radius: 0;
border-top-right-radius: 0;
-moz-border-top-right-radius: 0;
}
.third.column .rounded-image-bleed:first-child .gnd-corner-image-top.gnd-corner-image-center,
.third.column .rounded-image-bleed:first-child .gnd-corner-image-top.gnd-corner-image-right {
border-top-left-radius: 0;
-moz-border-top-left-radius: 0;
border-top-right-radius: 4px;
-moz-border-top-right-radius: 4px;
}
[class*=imageMain] img {
width: 150px !important;
height: 100px !important;
}
@media only screen and (max-width: 620px) {
[class*=wrapper] .preheader,
[class*=wrapper] .preheader table,
[class*=wrapper] .header,
[class*=wrapper] .footer,
[class*=wrapper] .footer .contents,
[class*=wrapper] .feature {
width: 320px !important;
}
[class*=wrapper] .preheader .title {
display: none;
mso-hide: all; /* hide elements in Outlook 2007-2013 */
}
[class*=wrapper] .preheader .webversion {
text-align: center !important;
}
[class*=wrapper] .logo {
padding-left: 20px;
padding-right: 20px;
}
[class*=wrapper] .logo img {
max-width: 260px !important;
height: auto !important;
}
[class*=wrapper] .footer .address,
[class*=wrapper] .footer .campaign {
display: block;
padding-left: 30px !important;
padding-right: 30px !important;
text-align: center !important;
width: 260px !important;
}
[class*=wrapper] .footer .address {
padding-bottom: 20px !important;
}
[class*=wrapper] .footer .social td {
display: block !important;
text-align: center !important;
padding-left: 0 !important;
padding-right: 0 !important;
padding-bottom: 10px !important;
}
[class*=wrapper] .footer .social td:last-child {
padding-bottom: 40px !important;
}
[class*=wrapper] .first .column-bottom,
[class*=wrapper] .three-col .second .column-bottom {
display: none;
mso-hide: all; /* hide elements in Outlook 2007-2013 */
}
[class*=wrapper] .second .column-top,
[class*=wrapper] .third .column-top {
display: none;
mso-hide: all; /* hide elements in Outlook 2007-2013 */
}
[class*=wrapper] .one-col .column:last-child table:nth-last-child(2) td h1:last-child,
[class*=wrapper] .two-col .column:last-child table:nth-last-child(2) td h1:last-child,
[class*=wrapper] .three-col .column:last-child table:nth-last-child(2) td h1:last-child,
[class*=wrapper] .one-col .column:last-child table:nth-last-child(2) td h2:last-child,
[class*=wrapper] .two-col .column:last-child table:nth-last-child(2) td h2:last-child,
[class*=wrapper] .three-col .column:last-child table:nth-last-child(2) td h2:last-child,
[class*=wrapper] .one-col .column:last-child table:nth-last-child(2) td h3:last-child,
[class*=wrapper] .two-col .column:last-child table:nth-last-child(2) td h3:last-child,
[class*=wrapper] .three-col .column:last-child table:nth-last-child(2) td h3:last-child,
[class*=wrapper] .one-col .column:last-child table:nth-last-child(2) td p:last-child,
[class*=wrapper] .two-col .column:last-child table:nth-last-child(2) td p:last-child,
[class*=wrapper] .three-col .column:last-child table:nth-last-child(2) td p:last-child,
[class*=wrapper] .one-col .column:last-child table:nth-last-child(2) td ol:last-child,
[class*=wrapper] .two-col .column:last-child table:nth-last-child(2) td ol:last-child,
[class*=wrapper] .three-col .column:last-child table:nth-last-child(2) td ol:last-child,
[class*=wrapper] .one-col .column:last-child table:nth-last-child(2) td ul:last-child,
[class*=wrapper] .two-col .column:last-child table:nth-last-child(2) td ul:last-child,
[class*=wrapper] .three-col .column:last-child table:nth-last-child(2) td ul:last-child {
Margin-bottom: 25px !important;
}
[class*=wrapper] .column-top {
font-size: 25px !important;
line-height: 25px !important;
}
[class*=wrapper] .column-bottom {
font-size: 5px !important;
line-height: 5px !important;
}
[class*=wrapper] center.divider {
margin-bottom: 25px !important;
}
[class*=wrapper] .btn {
margin-bottom: 25px !important;
}
[class*=wrapper] .btn a {
background-image: url(https://i5.createsend1.com/static/eb/customise/02-blush/images/btn-mobile.png) !important;
display: block !important;
font-size: 15px !important;
line-height: 25px !important;
padding: 8px 24px 9px 24px !important;
width: auto !important;
}
[class*=wrapper] h1 {
font-size: 36px !important;
margin-bottom: 21px !important;
}
[class*=wrapper] h2 {
font-size: 20px !important;
margin-bottom: 20px !important;
}
[class*=wrapper] h3 {
font-size: 15px !important;
margin-bottom: 16px !important;
}
[class*=wrapper] .one-col p,
[class*=wrapper] .two-col p,
[class*=wrapper] .three-col p,
[class*=wrapper] .one-col ol,
[class*=wrapper] .two-col ol,
[class*=wrapper] .three-col ol,
[class*=wrapper] .one-col ul,
[class*=wrapper] .two-col ul,
[class*=wrapper] .three-col ul {
font-size: 15px !important;
line-height: 25px !important;
}
[class*=wrapper] ol,
[class*=wrapper] ul {
margin-left: 26px !important;
}
[class*=wrapper] .feature-top {
padding-bottom: 25px !important;
}
[class*=wrapper] .feature-bottom {
padding-top: 9px !important;
}
[class*=wrapper] .feature-top img,
[class*=wrapper] .feature-bottom img {
display: block !important;
}
[class*=wrapper] .feature-top .right,
[class*=wrapper] .feature-bottom .right {
display: none !important;
mso-hide: all; /* hide elements in Outlook 2007-2013 */
}
[class*=wrapper] .feature .one-col,
[class*=wrapper] .feature .column {
width: 280px !important;
}
[class*=wrapper] .feature .padded {
padding-left: 20px !important;
padding-right: 20px !important;
}
[class*=wrapper] .feature .column-top {
font-size: 20px !important;
line-height: 20px !important;
}
[class*=wrapper] .feature .column-bottom {
font-size: 2px !important;
line-height: 2px !important;
}
[class*=wrapper] .feature .frame-bottom .left,
[class*=wrapper] .feature .frame-bottom .right {
width: 131px !important;
}
[class*=wrapper] .feature .btn a {
background-image: url(https://i8.createsend1.com/static/eb/customise/02-blush/images/btn-feature-mobile.png) !important;
}
[class*=two-col] [class*=first] {
padding-top: 34px !important;
}
[class*=imageMain] {
padding-left: 24px !important;
}
#mobile_hide {
width: 0 !important;
}
#full_width {
width: 100% !important;
}
#mobile_hide {
max-height: none !important;
font-size: 12px !important;
display: block !important;
}
#mobile_hide {
max-height: 0px;
font-size: 0;
display: none !important;
}
#mobile_hide * {
width: 0 !important;
height: 0 !important;
display: none !important;
mso-hide: all; /* hide elements in Outlook 2007-2013 */
}
[class*=imageMain] {
padding-left: 0 !important;
}
[class*=imageMain] img {
width: 100% !important;
height: 170px !important;
}
#full_width {
padding-top: 0 !important;
}
#hide_formobile {
height: 0 !important;
display: none !important;
mso-hide: all; /* hide elements in Outlook 2007-2013 */
}
*[id=gmail] {
display:block!important;
width:auto!important;
overflow:visible!important;
float:none !important;
height:inherit!important;
max-height:inherit!important;
}
[class*=unhide_formobile] {
display : block !important;
width : auto !important;
overflow : visible !important;
float : none !important;
}
#hidden_title {
padding-top: 0 !important;
padding-bottom: 0 !important;
display: none !important;
height: 0 !important;
max-height: none !important;
width: auto !important;
mso-hide: all; /* hide elements in Outlook 2007-2013 */
}
#hidden_title a {
font-size: 20px !important;
margin-bottom: 16px !important;
line-height: 26px !important;
}
#hidden_title h2 {
margin-bottom: 16px !important;
line-height: 26px !important;
font-size: 20px !important;
}
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
[class*=wrapper] .one-col .btn a {
background-image: url(https://i7.createsend1.com/static/eb/customise/02-blush/images/btn-one-col-2x.png) !important;
}
[class*=wrapper] .two-col .btn a {
background-image: url(https://i6.createsend1.com/static/eb/customise/02-blush/images/btn-two-col-2x.png) !important;
}
[class*=wrapper] .three-col .btn a {
background-image: url(https://i9.createsend1.com/static/eb/customise/02-blush/images/btn-three-col-2x.png) !important;
}
[class*=wrapper] .feature .btn a {
background-image: url(https://i1.createsend1.com/static/eb/customise/02-blush/images/btn-feature-2x.png) !important;
}
}
@media only screen and (max-width: 620px) and (-webkit-min-device-pixel-ratio: 2), only screen and (max-width: 620px) and (min--moz-device-pixel-ratio: 2), only screen and (max-width: 620px) and (-o-min-device-pixel-ratio: 2/1), only screen and (max-width: 620px) and (min-device-pixel-ratio: 2), only screen and (max-width: 620px) and (min-resolution: 192dpi), only screen and (max-width: 620px) and (min-resolution: 2dppx) {
[class*=wrapper] .btn a {
background-image: url(https://i10.createsend1.com/static/eb/customise/02-blush/images/btn-mobile-2x.png) !important;
}
[class*=wrapper] .feature .btn a {
background-image: url(https://i2.createsend1.com/static/eb/customise/02-blush/images/btn-feature-mobile-2x.png) !important;
}
}
@media only screen and (-webkit-min-device-pixel-ratio: 1) {
.divider img,
.heart img {
outline: 1px solid #ffffff;
}
.feature-top img,
.feature-bottom img {
float: left;
}
}
#hidden_title {
max-height: none !important;
font-size: 12px !important;
display: block !important;
}
@media only screen and (min-width: 621px) {
#hidden_title {
max-height: 0px;
font-size: 0;
width: 0;
display: none !important;
}
#hidden_title {
padding-top: 0 !important;
padding-bottom: 0 !important;
display: none !important;
height: 0 !important;
max-height: none !important;
width: auto !important;
mso-hide: all; /* hide elements in Outlook 2007-2013 */
}
#hidden_title a {
font-size: 20px !important;
margin-bottom: 16px !important;
line-height: 26px !important;
}
#hidden_title h2 {
margin-bottom: 16px !important;
line-height: 26px !important;
font-size: 20px !important;
}
}
</style>
<!--[if mso]>
<style>
.spacer, .border, .column-top {
mso-line-height-rule: exactly !important;
}
.feature .frame-bottom .left, .feature .frame-bottom .right {
width: 246px !important;
}
</style>
<![endif]-->
<meta name="robots" content="noindex,nofollow">
<meta property="og:title" content="newssletter test">
</head>
<body style="margin-top: 0;margin-bottom: 0;margin-left: 0;margin-right: 0;padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;min-width: 100%;background-color: #f5f4f0" cz-shortcut-listen="true"><style type="text/css">
@import url(https://fonts.googleapis.com/css?family=Roboto:400,700,400italic,700italic);@import url(https://fonts.googleapis.com/css?family=Bitter:400,700,400italic);@import url(https://fonts.googleapis.com/css?family=Roboto:400,700,400italic,700italic);@import url(https://fonts.googleapis.com/css?family=Roboto:400,700,400italic,700italic);@import url(https://fonts.googleapis.com/css?family=Roboto:400,700,400italic,700italic);@import url(https://fonts.googleapis.com/css?family=Roboto:400,700,400italic,700italic);body.noop{border-width:0px}body,.wrapper,.emb-editor-canvas{background-color:#f5f4f0}h1{color:#f39bae}.wrapper h1{}.wrapper h1{font-family:Tahoma,sans-serif}@media only screen{.wrapper h1{font-family:Roboto,Tahoma,sans-serif !important}}h1{}.one-col h1{line-height:44px}.two-col h1{line-height:40px}.three-col h1{line-height:32px}@media only screen and (max-width:
620px){h1{line-height:44px !important}}h2{color:#555}.wrapper h2{}.wrapper h2{font-family:Georgia,serif}@media only screen{.wrapper h2{font-family:Arial, Helvetica, sans-serif !important}}h2{}.one-col h2{line-height:24px}.two-col h2{line-height:26px}.three-col h2{line-height:24px}@media only screen and (max-width: 620px){h2{line-height:24px !important}}h3{color:#555}.wrapper h3{}.wrapper h3{font-family:Tahoma,sans-serif}@media only screen{.wrapper h3{font-family:Roboto,Tahoma,sans-serif !important}}h3{}.one-col h3{line-height:21px}.two-col h3{line-height:22px}.three-col h3{line-height:19px}@media only screen and (max-width: 620px){h3{line-height:21px !important}}p,ol,ul{color:#61606c}.wrapper p,.wrapper ol,.wrapper ul{}.wrapper p,.wrapper ol,.wrapper ul{font-family:Tahoma,sans-serif}@media only screen{.wrapper p,.wrapper ol,.wrapper ul{font-family:Roboto,Tahoma,sans-serif
!important}}p,ol,ul{}.one-col p,.one-col ol,.one-col ul{line-height:24px;Margin-bottom:24px}.two-col p,.two-col ol,.two-col ul{line-height:22px;Margin-bottom:22px}.three-col p,.three-col ol,.three-col ul{line-height:20px;Margin-bottom:20px}@media only screen and (max-width: 620px){p,ol,ul{line-height:24px !important;Margin-bottom:24px !important}}.wrapper a{color:#41637e}.wrapper a:hover{color:#30495c !important}.wrapper p a,.wrapper ol a,.wrapper ul a{border-bottom:1px dotted #41637e}.wrapper p a:hover,.wrapper ol a:hover,.wrapper ul a:hover{border-bottom-color:#30495c !important}.wrapper .logo{color:#555}.wrapper .logo{font-family:Tahoma,sans-serif}@media only screen{.wrapper .logo{font-family:Roboto,Tahoma,sans-serif !important}}.wrapper .logo a{color:#555}.wrapper .logo a:hover{color:#555 !important}.btn a{}.wrapper .btn a{}.wrapper .btn a{font-family:Tahoma,sans-serif}@media only
screen{.wrapper .btn a{font-family:Roboto,Tahoma,sans-serif !important}}.wrapper .btn a{background-color:#9ec9df;border-top:1px solid #fefeff;border-bottom:1px solid #64a9cc;color:#fff !important}.wrapper .btn a:hover{background-color:#64a9cc !important;color:#fff !important}blockquote{border-left:4px solid #f5f4f0}center.divider span,center.divider img{background-color:#f5f4f0}.feature .one-col{border-top:1px dashed #9ec9df;border-left:1px dashed #9ec9df;border-right:1px dashed #9ec9df}.frame-bottom .left,.frame-bottom .right{border-bottom:1px dashed #9ec9df}.frame-bottom .left{border-left:1px dashed #9ec9df}.frame-bottom .right{border-right:1px dashed #9ec9df}.heart span,.heart img{background-color:#9ec9df}.feature-top span,.feature-bottom span,.feature-top img,.feature-bottom img{background-color:#f5f4f0}.header{border-top:1px dashed #b3b3b3}.footer .forward,.footer .facebook,.footer
.twitter{color:#b3b3b3}.wrapper .footer .forward,.wrapper .footer .facebook,.wrapper .footer .twitter{}.wrapper .footer .forward,.wrapper .footer .facebook,.wrapper .footer .twitter{font-family:Tahoma,sans-serif}@media only screen{.wrapper .footer .forward,.wrapper .footer .facebook,.wrapper .footer .twitter{font-family:Roboto,Tahoma,sans-serif !important}}.footer .forward,.footer .facebook,.footer .twitter{}.footer .forward:hover,.footer .facebook:hover,.footer .twitter:hover{color:#8d8d8d !important}.address,.campaign,.preheader .title,.preheader .webversion{color:#b3b3b3}.address,.campaign,.preheader .title,.preheader .webversion{font-family:Tahoma,sans-serif}@media only screen{.address,.campaign,.preheader .title,.preheader .webversion{font-family:Roboto,Tahoma,sans-serif !important}}.wrapper .address a,.wrapper .campaign a,.wrapper .preheader .title a,.wrapper .preheader
.webversion a{color:#b3b3b3}.wrapper .address a:hover,.wrapper .campaign a:hover,.wrapper .preheader .title a:hover,.wrapper .preheader .webversion a:hover{color:#8d8d8d !important}.footer .campaign a{}.wrapper .footer .campaign a{}.wrapper .footer .campaign a{font-family:Tahoma,sans-serif}@media only screen{.wrapper .footer .campaign a{font-family:Roboto,Tahoma,sans-serif !important}}.footer .campaign a{}.footer .campaign a{letter-spacing:0.03em}.footer .divider{border-top:1px dashed #b3b3b3}.forward,.facebook,.twitter{}.wrapper .forward,.wrapper .facebook,.wrapper .twitter{}.wrapper .forward,.wrapper .facebook,.wrapper .twitter{font-family:Tahoma,sans-serif}@media only screen{.wrapper .forward,.wrapper .facebook,.wrapper .twitter{font-family:Roboto,Tahoma,sans-serif !important}}.forward,.facebook,.twitter{}
</style>
<table class="wrapper" style="border-collapse: collapse;border-spacing: 0;display: table;table-layout: fixed;width: 100%;min-width: 620px;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;text-rendering: optimizeLegibility;background-color: #f5f4f0">
<tbody><tr>
<td style="padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;vertical-align: top">
<center>
<table class="one-col" style="border-collapse: collapse;border-spacing: 0;Margin-left: auto;Margin-right: auto;width: 100%; background-color: #002436;border-radius: 4px;box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1)">
<tbody>
<tr>
<td class="column" style="padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;vertical-align: top;text-align: center">
<!-- <div class="spacer_hide"><div class="column-top" style="font-size: 15px;line-height: 15px"> </div></div> -->
</td>
</tr>
<tr>
<td class="column" style="padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;vertical-align: top;text-align: left">
<table class="contents" style="border-collapse: collapse;border-spacing: 0;width: 100%">
<tbody><tr>
<td class="padded" style="padding-top: 0;padding-bottom: 0;padding-left: 60px;padding-right: 60px;vertical-align: top">
<div style="height:5px"> </div>
</td>
</tr>
</tbody></table>
<div class="rounded-image-bleed">
<div class="image" style="font-size: 0; margin-bottom: 0 !important;" align="center">
<p style="text-align: left;color: #d9e9eb;font-weight: 400;font-size: 16px;max-width: 600px; margin-bottom: 0 !important;"> {{date.mday}} {{date.month}} {{date.year}}</p>
</div>
</div>
<!-- <div class="spacer_hide"><div class="column-top" style="font-size: 15px;line-height: 15px"> </div></div> -->
</td>
</tr>
<tr>
<td class="column" style="padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;vertical-align: top;text-align: left">
<table class="contents" style="border-collapse: collapse;border-spacing: 0;width: 100%">
<tbody><tr>
<td class="padded" style="padding-top: 0;padding-bottom: 0;padding-left: 60px;padding-right: 60px;vertical-align: top">
<div style="height:5px"> </div>
</td>
</tr>
</tbody></table>
<div class="rounded-image-bleed">
<div class="image" style="font-size: 0;Margin-bottom: 25px" align="center">
<img style="border-left-width: 0;border-top-width: 0;border-bottom-width: 0;border-right-width: 0;-ms-interpolation-mode: bicubic;display: block;max-width: 600px" src="http://dstefaniak-staging.com/random_images/na/na.png" alt="" width="600" height="78">
</div>
</div>
<!-- <div class="column-bottom" style="font-size: 34px;line-height: 34px"> </div> -->
</td>
</tr>
</tbody></table>
</center>
</td>
</tr>
</tbody></table>
{{# marked_posts }}
{{# . }}
<div class="spacer" style="font-size: 1px;line-height: 40px;width: 100%; background-color: #f5f4f0;"> </div>
<table class="wrapper" style="border-collapse: collapse;border-spacing: 0;display: table;table-layout: fixed;width: 100%;min-width: 620px;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;text-rendering: optimizeLegibility;background-color: #f5f4f0">
<tbody><tr>
<td style="padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;vertical-align: top">
<center>
<table class="two-col" style="border-collapse: collapse;border-spacing: 0;Margin-left: auto;Margin-right: auto;width: 600px;background-color: #ffffff;border-radius: 4px;box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1)">
<tbody><tr>
<td class="column first" id="full_width" style="padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;vertical-align: top;text-align: left;width: 200px">
<div id="hide_formobile"><div class="column-top" style="font-size: 15px;line-height: 15px"> </div></div>
<!-- <table class="contents" style="border-collapse: collapse;border-spacing: 0;width: 100%">
<tbody><tr>
<td class="padded" style="padding-top: 0;padding-bottom: 0;padding-left: 60px;padding-right: 30px;vertical-align: top">
<div style="height:5px"> </div>
</td>
</tr>
</tbody></table> -->
<div class="rounded-image-bleed">
<div class="imageMain" style="font-size: 0;Margin-bottom: 23px" align="center">
<a href="{{link}}" style="text-decoration: none;color: #555;font-weight: 400;font-size: 20px;Margin-bottom: 16px;font-family: Arial, Helvetica, sans-serif !important;line-height: 26px">
<!-- {{{thumbnail}}} <img width="150" height="100" src="http://damianpolopoly.cloudapp.net/pressandjournal/wp-content/uploads/sites/2/2014/05/P-f61c395c-7b6c-4158-aa79-72ce8f170752-150x113.jpg" class="attachment-119x73 wp-post-image" alt="Maria Sharapova dropped just three games on her way into the second round (AP)"> -->
<img src="{{thumb_link}}" alt="{{post_title}}" width="150" height="100">
</a>
</div>
</div>
</td>
<td class="column second" id="mobile_hide" style="padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;vertical-align: top;text-align: left;width: 400px">
<table class="contents" style="border-collapse: collapse;border-spacing: 0;width: 100%">
<tbody><tr>
<td class="padded" style="padding-top: 0;padding-bottom: 0;padding-left: 30px;padding-right: 10px;vertical-align: top">
<div><div class="column-top" style="font-size: 20px;line-height: 20px"> </div></div>
<h2 style="Margin-top: 0;color: #555;font-weight: 400;font-size: 20px;Margin-bottom: 16px;font-family: Arial, Helvetica, sans-serif !important;line-height: 26px"><a href="{{link}}" style="text-decoration: none;color: #555;font-weight: 400;font-size: 20px;Margin-bottom: 16px;font-family: Arial, Helvetica, sans-serif !important;line-height: 26px">{{post_title}}</a></h2>
</td>
</tr>
</tbody></table>
<table class="contents" style="border-collapse: collapse;border-spacing: 0;width: 100%">
<tbody><tr>
<td class="padded" style="padding-top: 0;padding-bottom: 0;padding-left: 30px;padding-right: 10px;vertical-align: top"></td>
</tr>
</tbody></table>
<div class="column-bottom" style="font-size: 37px;line-height: 37px"> </div>
</td>
</tr>
<tr>
<td colspan="2" id="hidden_title" style="padding-top: 0;padding-bottom: 0;padding-left: 25px;padding-right: 25px;vertical-align: top;text-align: left;width: 100%;">
<!--[if !mso]><!-->
<h2 class="unhide_formobile" style="line-height: 0; margin-bottom: 0; width:0; overflow:hidden;float:left; display:none; Margin-top: 0; color: #555;font-weight: 400;font-family: Arial, Helvetica, sans-serif !important;">
<a href="{{link}}" style="font-size: 0px; Margin-bottom: 0px; line-height: 0px;text-decoration: none; color: #555;font-weight: 400;font-family: Arial, Helvetica, sans-serif !important;">{{post_title}}</a>
</h2>
<!--<![endif]-->
</td>
</tr>
<tr>
<td colspan="2" style="padding-top: 0;padding-bottom: 0;padding-left: 25px;padding-right: 25px;vertical-align: top;text-align: left;width: 100%;">
<p style="Margin-top: 0;color: #61606c;font-weight: 400;font-size: 14px;font-family: Roboto,Tahoma,sans-serif !important;line-height: 22px;Margin-bottom: 25px"><span style="color:rgb(97, 96, 108); font-size:14px; line-height:22px; text-align:left">{{post_excerpt}} </span><span> <br> <a href="{{link}}" target="_blank">Read full story</a></span></p>
<table style="width: 100%; height: 35px;">
<tbody class="column-top" style="display: table;font-size: 60px;line-height: 60px">
<tr>
<td class="social_col_second" style="font-size: 14px; line-height: 15px;">
<a href="http://twitter.com/share?text={{post_title}}&url={{link}}" target="_new"><img src="http://dstefaniak-staging.com/random_images/na/twitter.jpg" alt="Twitter" width="20" height="20"></a>
<a href="https://www.facebook.com/sharer/sharer.php?u={{link}}" target="righside"><img src="http://dstefaniak-staging.com/random_images/na/facebook.jpg" alt="Facebook" width="20" height="20"></a>
<a href="https://plus.google.com/share?url={{link}}" title="Google+" target="_new"><img src="http://dstefaniak-staging.com/random_images/na/gplus.jpg" alt="Google Plus" width="20" height="20"></a>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody></table>
</center>
</td>
</tr>
</tbody></table>
{{/ .}}
{{/ marked_posts }}
<div class="spacer" style="font-size: 1px;line-height: 40px;width: 100%"> </div>
<table class="wrapper" style="border-collapse: collapse;border-spacing: 0;display: table;table-layout: fixed;width: 100%;min-width: 620px;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;text-rendering: optimizeLegibility; background-color: #002436;">
<tbody><tr>
<td style="padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;vertical-align: top">
<center>
<table class="footer" style="border-collapse: collapse;border-spacing: 0;width: 600px;Margin-left: auto;Margin-right: auto">
<tbody><tr>
<td style="padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;vertical-align: top">
<table class="divider" style="border-collapse: collapse;border-spacing: 0;line-height: 11px;width: 100%;border-top-color: #b3b3b3;border-top-style: dashed;border-top-width: 1px"><tbody><tr><td style="padding-top: 0;padding-bottom: 0;padding-left: 0;padding-right: 0;vertical-align: top"> </td></tr></tbody></table>
<table class="contents" style="border-collapse: collapse;border-spacing: 0;width: 600px">
<tbody><tr>
<td class="address" style="padding-top: 0;padding-bottom: 40px;padding-left: 30px;padding-right: 10px;vertical-align: top;font-size: 11px;font-weight: 400;line-height: 19px;-webkit-font-smoothing: antialiased;text-align: left;width: 45%;color: #b3b3b3;font-family: Roboto,Tahoma,sans-serif !important">
<div>® Newsletter Artisan WordPress Plugin</div>
</td>
<td class="campaign" style="padding-top: 0;padding-bottom: 40px;padding-left: 10px;padding-right: 30px;vertical-align: top;font-size: 11px;font-weight: 400;line-height: 19px;-webkit-font-smoothing: antialiased;text-align: right;width: 55%;color: #b3b3b3;font-family: Roboto,Tahoma,sans-serif !important">
<div class="links">
<span class="block">
link to the text version
</span>
<br>
<span class="block">
link to unsubscribe
</span>
</div>
</td>
</tr>
</tbody></table>
</td>
</tr>
</tbody></table>
</center>
</td>
</tr>
</tbody></table>
<img style="border-left-width: 0 !important;border-top-width: 0 !important;border-bottom-width: 0 !important;border-right-width: 0 !important;-ms-interpolation-mode: bicubic;height: 1px !important;width: 1px !important;margin-top: 0 !important;margin-bottom: 0 !important;margin-left: 0 !important;margin-right: 0 !important;padding-top: 0 !important;padding-bottom: 0 !important;padding-left: 0 !important;padding-right: 0 !important" src="https://createsend1.com/t/t-o-jitdiyt-l/o.gif" width="1" height="1" border="0" alt="">
</body></html>