diff --git a/lib/Newsletter/Renderer/Blocks/Button.php b/lib/Newsletter/Renderer/Blocks/Button.php new file mode 100644 index 0000000000..b34223cd58 --- /dev/null +++ b/lib/Newsletter/Renderer/Blocks/Button.php @@ -0,0 +1,47 @@ + + +
+ + + + +
+ + ' . $element['text'] . ' + +
+
+ + '; + + return $template; + } +} \ No newline at end of file diff --git a/lib/Newsletter/Renderer/Blocks/Divider.php b/lib/Newsletter/Renderer/Blocks/Divider.php new file mode 100644 index 0000000000..ccab9ce7a4 --- /dev/null +++ b/lib/Newsletter/Renderer/Blocks/Divider.php @@ -0,0 +1,23 @@ + + + + + + +
+
+ + '; + + return $template; + } +} \ No newline at end of file diff --git a/lib/Newsletter/Renderer/Blocks/Footer.php b/lib/Newsletter/Renderer/Blocks/Footer.php new file mode 100644 index 0000000000..005c75f62c --- /dev/null +++ b/lib/Newsletter/Renderer/Blocks/Footer.php @@ -0,0 +1,30 @@ +getStyles($element['styles'], 'link') . '"', $element['text']); + } + + // apply text styles + if(isset($element['styles']['link'])) { + $element['text'] = str_replace('getStyles($element['styles'], 'block') . '" + valign="top"> +
' . $element['text'] . '
+ + '; + + return $template; + } +} \ No newline at end of file diff --git a/lib/Newsletter/Renderer/Blocks/Header.php b/lib/Newsletter/Renderer/Blocks/Header.php new file mode 100644 index 0000000000..3be509324c --- /dev/null +++ b/lib/Newsletter/Renderer/Blocks/Header.php @@ -0,0 +1,30 @@ +getStyles($element['styles'], 'link') . '"', $element['text']); + } + + // apply text styles + if(isset($element['styles']['link'])) { + $element['text'] = str_replace('getBlockStyles($element) . '" + valign="top"> +
' . $element['text'] . '
+ + '; + + return $template; + } +} \ No newline at end of file diff --git a/lib/Newsletter/Renderer/Blocks/Image.php b/lib/Newsletter/Renderer/Blocks/Image.php new file mode 100644 index 0000000000..92cc0b0327 --- /dev/null +++ b/lib/Newsletter/Renderer/Blocks/Image.php @@ -0,0 +1,24 @@ + + + + + '; + + return $template; + } +} \ No newline at end of file diff --git a/lib/Newsletter/Renderer/Blocks/Renderer.php b/lib/Newsletter/Renderer/Blocks/Renderer.php new file mode 100644 index 0000000000..3db1285863 --- /dev/null +++ b/lib/Newsletter/Renderer/Blocks/Renderer.php @@ -0,0 +1,24 @@ +createElementFromBlockType($block); + if(isset($block['blocks'])) { + $blockContent = $this->render($block); + } + // vertical orientation denotes column container + if($block['type'] === 'container' && $block['orientation'] === 'vertical') { + $columns[] = $blockContent; + } + }, $data['blocks']); + + return (isset($columns)) ? $columns : $blockContent; + } + + function createElementFromBlockType($block) { + $blockClass = __NAMESPACE__ . '\\' . ucfirst($block['type']); + return (class_exists($blockClass)) ? $blockClass::render($block) : ''; + } + +} diff --git a/lib/Newsletter/Renderer/Blocks/Social.php b/lib/Newsletter/Renderer/Blocks/Social.php new file mode 100644 index 0000000000..241e4cca84 --- /dev/null +++ b/lib/Newsletter/Renderer/Blocks/Social.php @@ -0,0 +1,26 @@ + + ' . $icon['iconType'] . ' + + '; + } + } + + $template = ' + + +
' . $iconsBlock . '
+ + '; + + return $template; + } +} \ No newline at end of file diff --git a/lib/Newsletter/Renderer/Blocks/Spacer.php b/lib/Newsletter/Renderer/Blocks/Spacer.php new file mode 100644 index 0000000000..f950264970 --- /dev/null +++ b/lib/Newsletter/Renderer/Blocks/Spacer.php @@ -0,0 +1,23 @@ + + + '; + + return $template; + } +} \ No newline at end of file diff --git a/lib/Newsletter/Renderer/Blocks/Text.php b/lib/Newsletter/Renderer/Blocks/Text.php new file mode 100644 index 0000000000..7aa62475f2 --- /dev/null +++ b/lib/Newsletter/Renderer/Blocks/Text.php @@ -0,0 +1,114 @@ + "Arial, 'Helvetica Neue', Helvetica, sans-serif", + 'Comic Sans MS' => "'Comic Sans MS', 'Marker Felt-Thin', Arial, sans-serif", + 'Courier New' => "'Courier New', Courier, 'Lucida Sans Typewriter', 'Lucida Typewriter', monospace", + 'Georgia' => "Georgia, Times, 'Times New Roman', serif", + 'Lucida' => "'Lucida Sans Unicode', 'Lucida Grande', sans-serif", + 'Tahoma' => "Tahoma, Verdana, Segoe, sans-serif", + 'Times New Roman' => "'Times New Roman', Times, Baskerville, Georgia, serif", + 'Trebuchet MS' => "'Trebuchet MS', 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', Tahoma, sans-serif", + 'Verdana' => "Verdana, Geneva, sans-serif" + ); + + static function render($element) { + $html = $element['text']; + + $html = self::convertBlockquotesToTables($html); + $html = self::addLineBreakAfterTags($html); + $html = self::removeEmptyTags($html); + $html = self::convertEmptyParagraphsToLineBreaks($html); + $html = self::convertParagraphsToTables($html); + $html = self::removeLastBreakLine($html); + + $template = ' + + ' . $html . ' + '; + + return $template; + } + + static function removeLastBreakLine($html) { + return preg_replace('/
([^
]*)$/s', '', $html); + } + + static function convertParagraphsToTables($html) { + $html = preg_replace('/

(.*?)<\/p>/', ' + + + + +
+ + $1 + +
', $html); + + return preg_replace('/(.*?)<\/p>/', ' + + + + +
+ + $2 + +
', $html); + } + + static function convertEmptyParagraphsToLineBreaks($html) { + return preg_replace('/<\/p>/', '
', $html); + } + + static function addLineBreakAfterTags($html) { + return preg_replace('/(<\/(ul|ol|h\d)>)/', '$1
', $html); + } + + static function convertBlockquotesToTables($html) { + $template = ' + + + + + + +
$1
+
'; + + return preg_replace('/

(.*?)<\/blockquote>/s', $template, $html); + } + + static function removeEmptyTags($html) { + $pattern = <<<'EOD' + ~ + < + (?: + !--[^-]*(?:-(?!->)[^-]*)*-->[^<]*(*SKIP)(*F) # skip comments + | + ( # group 1 + (span|em|strong) # tag name in group 2 + [^"'>]* #'"# all that is not a quote or a closing angle bracket + (?: # quoted attributes + "[^\\"]*(?:\\.[^\\"]*)*+" [^"'>]* #'"# double quote + | + '[^\\']*(?:\\.[^\\']*)*+' [^"'>]* #'"# single quote + )*+ + > + \s* + (?: + \s* # html comments + | + <(?1) \s* # recursion with the group 1 + )*+ + # closing tag + ) # end of the group 1 + ) + ~sxi +EOD; + + return preg_replace($pattern, '', $html); + } +} \ No newline at end of file diff --git a/lib/Newsletter/Renderer/Columns/Renderer.php b/lib/Newsletter/Renderer/Columns/Renderer.php new file mode 100644 index 0000000000..975d9bba02 --- /dev/null +++ b/lib/Newsletter/Renderer/Columns/Renderer.php @@ -0,0 +1,76 @@ + 600, + 2 => 300, + 3 => 200 + ); + + public $columnClasses = array( + 1 => 'mailpoet_col-one', + 2 => 'mailpoet_col-two', + 3 => 'mailpoet_col-three' + ); + + function render($columnsCount, $columnsData) { + $columnWidth = $this->columnWidths[$columnsCount]; + $columnClass = $this->columnClasses[$columnsCount]; + + // open column container + $columnContainerTemplate = ' + + + + + + +
+ '; + + $columnOpenTemplate = ' + + '; + + $columnCloseTemplate = ' + +
+ '; + + foreach ($columnsData as $index => $columnData) { + $index++; + $columnContainerTemplate .= $columnOpenTemplate . $columnData; + if($columnsCount > 1 && $index != $columnsCount) { + $columnContainerTemplate .= $columnCloseTemplate; + } + } + + // close column container + $columnContainerTemplate .= ' +
+ + + + + + '; + + return $columnContainerTemplate; + } +} diff --git a/lib/Newsletter/Renderer/Renderer.php b/lib/Newsletter/Renderer/Renderer.php new file mode 100644 index 0000000000..c7cb08f0dd --- /dev/null +++ b/lib/Newsletter/Renderer/Renderer.php @@ -0,0 +1,87 @@ +blocksRenderer = new Blocks\Renderer(); + $this->columnsRenderer = new Columns\Renderer(); + $this->stylesHelper = new StylesHelper(); + $this->DOMQuery = new \pQuery(); + $this->CSSInliner = new \MailPoet\Util\CSS(); + $this->data = $newsletterData; + $this->template = file_get_contents(dirname(__FILE__) . '/' . $this->template); + } + + function renderAll() { + $newsletterContent = $this->renderContent($this->data['content']); + $newsletterStyles = $this->renderStyles($this->data['globalStyles']); + + $renderedTemplate = $this->renderTemplate($this->template, array( + $newsletterStyles, + $newsletterContent + )); + $renderedTemplateWithInlinedStyles = $this->inlineCSSStyles($renderedTemplate); + + return $this->postProcessRenderedTemplate($renderedTemplateWithInlinedStyles); + } + + function renderContent($content) { + $newsletterContent = array_map(function ($contentBlock) { + $columnCount = count($contentBlock['blocks']); + $columnData = $this->blocksRenderer->render($contentBlock); + return $this->columnsRenderer->render($columnCount, $columnData); + }, $content['blocks']); + return implode('', $newsletterContent); + } + + function renderStyles($styles) { + $newsletterStyles = ''; + foreach ($styles as $selector => $style) { + switch ($selector) { + case 'text': + $selector = 'span.paragraph, ul, ol'; + break; + case 'body': + $selector = '.mailpoet_content-wrapper'; + break; + case 'link': + $selector = '.mailpoet_content-wrapper a'; + break; + case 'wrapper': + $selector = '.mailpoet_container, .mailpoet_col-one, .mailpoet_col-two, .mailpoet_col-three'; + break; + } + $newsletterStyles .= $selector . '{' . PHP_EOL; + foreach ($style as $attribute => $individualStyle) { + $newsletterStyles .= $this->stylesHelper->translateCSSAttribute($attribute) . ':' . $individualStyle . ';' . PHP_EOL; + } + $newsletterStyles .= '}' . PHP_EOL; + } + + return $newsletterStyles; + } + + function renderTemplate($template, $data) { + return preg_replace_callback('/{{\w+}}/', function ($matches) use (&$data) { + return array_shift($data); + }, $template); + } + + function inlineCSSStyles($template) { + return $this->CSSInliner->inlineCSS(null, $template); + } + + function postProcessRenderedTemplate($template) { + // remove padding from last element inside each column + $DOM = $this->DOMQuery->parseStr($template); + $lastColumnElement = $DOM->query('.mailpoet_col > tbody > tr:last-child > td'); + foreach ($lastColumnElement as $element) { + $element->setAttribute('style', str_replace('padding-bottom:20px;', '', $element->attributes['style'])); + } + + return $DOM->__toString(); + } +} \ No newline at end of file diff --git a/lib/Newsletter/Renderer/StylesHelper.php b/lib/Newsletter/Renderer/StylesHelper.php new file mode 100644 index 0000000000..5ebc31febc --- /dev/null +++ b/lib/Newsletter/Renderer/StylesHelper.php @@ -0,0 +1,39 @@ + 'background-color', + 'fontColor' => 'color', + 'fontFamily' => 'font-family', + 'textDecoration' => 'text-decoration', + 'textAlign' => 'text-align', + 'fontSize' => 'font-size', + 'borderWidth' => 'border-width', + 'borderStyle' => 'border-style', + 'borderColor' => 'border-color', + 'borderRadius' => 'border-radius', + 'lineHeight' => 'line-height' + ); + + function getBlockStyles($element, $ignoreSpecificStyles = false) { + if(!isset($element['styles']['block'])) { + return; + } + + return $this->getStyles($element['styles'], 'block', $ignoreSpecificStyles); + } + + function getStyles($data, $type, $ignoreSpecificStyles = false) { + $styles = array_map(function ($attribute, $style) use($ignoreSpecificStyles) { + if(!$ignoreSpecificStyles || !in_array($attribute, $ignoreSpecificStyles)) { + return $this->translateCSSAttribute($attribute) . ': ' . $style . ' !important;'; + } + }, array_keys($data[$type]), $data[$type]); + + return implode('', $styles); + } + + function translateCSSAttribute($attribute) { + return (array_key_exists($attribute, $this->cssAtributesTable)) ? $this->cssAtributesTable[$attribute] : $attribute; + } +} diff --git a/lib/Newsletter/Renderer/Template.html b/lib/Newsletter/Renderer/Template.html new file mode 100644 index 0000000000..283b37326d --- /dev/null +++ b/lib/Newsletter/Renderer/Template.html @@ -0,0 +1,266 @@ + + + + + + + + MailPoet Newsletter Template + + + + + + + + +
+ + + + {{newsletter_editor_content}} + +
+ +
+ + diff --git a/tests/unit/Newsletter/RendererCest.php b/tests/unit/Newsletter/RendererCest.php new file mode 100644 index 0000000000..16930b5fac --- /dev/null +++ b/tests/unit/Newsletter/RendererCest.php @@ -0,0 +1,130 @@ +newsletterData = json_decode(file_get_contents(dirname(__FILE__) . '/RendererTestData.json'), true); + $this->renderer = new Renderer($this->newsletterData); + $this->columnRenderer = new ColumnRenderer(); + $this->queryDOM = new \pQuery(); + } + + function itRendersCompleteNewsletter() { + $template = $this->renderer->renderAll(); + $DOM = $this->queryDOM->parseStr($template); + + // we expect to have 4 column containers and 7 columns (1x1, 1x2, 1x3, 1x1) + expect(count($DOM('.mailpoet_cols-wrapper')))->equals(4); + expect(count($DOM('.mailpoet_force-row')))->equals(7); + } + + function itRendersColumns() { + $columnContent = array( + 'one', + 'two', + 'three' + ); + $DOM = $this->queryDOM->parseStr($this->columnRenderer->render(count($columnContent), $columnContent)); + + // rendered object should cocntain three columns + foreach ($DOM('.mailpoet_force-row > tbody') as $column) { + $renderedColumnContent[] = trim($column->text()); + }; + expect(count(array_diff($renderedColumnContent, $columnContent)))->equals(0); + } + + function itRendersHeader() { + $template = $this->newsletterData['content']['blocks'][0]['blocks'][0]['blocks'][0]; + $DOM = $this->queryDOM->parseStr(Header::render($template)); + + // element should be proplerly nested, and styles should be applied to , and

elements + expect(is_object($DOM('tr > td > p', 0)))->true(); + expect(is_object($DOM('tr > td > p > a', 0)))->true(); + expect($DOM('a', 0)->attr('style'))->notEmpty(); + expect($DOM('p', 0)->attr('style'))->notEmpty(); + } + + function itRendersImage() { + $template = $this->newsletterData['content']['blocks'][0]['blocks'][0]['blocks'][1]; + $DOM = $this->queryDOM->parseStr(Image::render($template)); + + // element should be properly nested, it's width set and style applied to + expect(is_object($DOM('tr > td > img', 0)))->true(); + expect($DOM('tr > td > img', 0)->attr('width'))->equals(560); + expect($DOM('tr > td', 0)->attr('style'))->notEmpty(); + } + + function itRendersText() { + $template = $this->newsletterData['content']['blocks'][0]['blocks'][0]['blocks'][2]; + $DOM = $this->queryDOM->parseStr(Text::render($template)); + + // blockquotes and paragraphs should be converted to spans and placed inside a table + expect(is_object($DOM('tr > td.mailpoet_text > table > tr > td > span.paragraph', 0)))->true(); + expect(is_object($DOM('tr > td.mailpoet_text > table.mailpoet_blockquote > tbody > tr > td > table > tr > td > span.paragraph', 0)))->true(); + } + + function itRendersDivider() { + $template = $this->newsletterData['content']['blocks'][0]['blocks'][0]['blocks'][3]; + $DOM = $this->queryDOM->parseStr(Divider::render($template)); + + // element should be properly nested and its border-top-width set + expect(is_object($DOM('tr > td.mailpoet_divider > table > tr > td', 0)))->true(); + expect(preg_match('/border-top-width: 3px/', $DOM('tr > td.mailpoet_divider > table > tr > td', 0)->attr('style')))->equals(1); + } + + function itRendersSpacer() { + $template = $this->newsletterData['content']['blocks'][0]['blocks'][0]['blocks'][4]; + $DOM = $this->queryDOM->parseStr(Spacer::render($template)); + + // element should be properly nested and its height set + expect(is_object($DOM('tr > td.mailpoet_spacer', 0)))->true(); + expect(preg_match('/height: 50px/', $DOM('tr > td.mailpoet_spacer', 0)->attr('style')))->equals(1); + } + + function itRendersButton() { + $template = $this->newsletterData['content']['blocks'][0]['blocks'][0]['blocks'][5]; + $DOM = $this->queryDOM->parseStr(Button::render($template)); + + // element should be properly nested with arcsize/styles/fillcolor set + expect(is_object($DOM('tr > td.mailpoet_button > div > table > tr > td > a.mailpoet_button', 0)))->true(); + expect(preg_match('/line-height: 30px/', $DOM('a.mailpoet_button', 0)->attr('style')))->equals(1); + expect(preg_match('/arcsize="' . round(20 / 30 * 100) . '%"/', $DOM('tr > td.mailpoet_button > div > table > tr > td', 0)->text()))->equals(1); + expect(preg_match('/style="height:30px.*?width:100px/', $DOM('tr > td.mailpoet_button > div > table > tr > td', 0)->text()))->equals(1); + expect(preg_match('/style="color:#ffffff.*?font-family:Arial.*?font-size:13px/', $DOM('tr > td.mailpoet_button > div > table > tr > td', 0)->text()))->equals(1); + expect(preg_match('/fillcolor="#666666/', $DOM('tr > td.mailpoet_button > div > table > tr > td', 0)->text()))->equals(1); + } + + function itRendersSocialIcons() { + $template = $this->newsletterData['content']['blocks'][0]['blocks'][0]['blocks'][6]; + $DOM = $this->queryDOM->parseStr(Social::render($template)); + + // element should be properly nested, contain social icons and image source/link href/alt should be properly set + expect(is_object($DOM('tr > td.mailpoet_social > div', 0)))->true(); + expect(count($DOM('a > img')))->equals(10); + expect($DOM('a', 0)->attr('href'))->equals('http://example.org'); + expect($DOM('a > img', 0)->attr('src'))->equals('http://mp3.mailpoet.net/various/social-icons/custom.png'); + expect($DOM('a > img', 0)->attr('alt'))->equals('custom'); + } + + function itRendersFooter() { + $template = $this->newsletterData['content']['blocks'][3]['blocks'][0]['blocks'][0]; + $DOM = $this->queryDOM->parseStr(Footer::render($template)); + + // element should be proplerly nested, and styles should be applied to , and

elements + expect(is_object($DOM('tr > td.mailpoet_footer > div', 0)))->true(); + expect(is_object($DOM('tr > td.mailpoet_footer > div > a > p', 0)))->true(); + expect($DOM('tr > td.mailpoet_footer', 0)->attr('style'))->notEmpty(); + expect($DOM('a', 0)->attr('style'))->notEmpty(); + expect($DOM('p', 0)->attr('style'))->notEmpty(); + } +} diff --git a/tests/unit/Newsletter/RendererTestData.json b/tests/unit/Newsletter/RendererTestData.json new file mode 100644 index 0000000000..f075bd6ae0 --- /dev/null +++ b/tests/unit/Newsletter/RendererTestData.json @@ -0,0 +1,1088 @@ +{ + "content": { + "type": "container", + "orientation": "vertical", + "styles": { + "block": { + "backgroundColor": "transparent" + } + }, + "blocks": [{ + "type": "container", + "orientation": "horizontal", + "styles": { + "block": { + "backgroundColor": "transparent" + } + }, + "blocks": [{ + "type": "container", + "orientation": "vertical", + "styles": { + "block": { + "backgroundColor": "transparent" + } + }, + "blocks": [{ + "type": "header", + "text": "

Display problems? View it in your browser. If I add a lot of text to test what happens... Well, nothing really (exciting) happens. Things don't break.

", + "styles": { + "block": { + "backgroundColor": "#333333" + }, + "text": { + "fontColor": "#aaaaaa", + "fontFamily": "Arial", + "fontSize": "12px", + "textAlign": "center" + }, + "link": { + "fontColor": "#a86b6b", + "textDecoration": "underline" + } + } + }, { + "type": "image", + "link": "http://example.org", + "src": "http://mp3.mailpoet.net/various/600x250.jpg", + "alt": "600x250", + "padded": true, + "width": "600px", + "height": "250px", + "styles": { + "block": { + "textAlign": "center" + } + } + }, { + "type": "text", + "text": "

1/1 Column

\n

1/1 Column

\n

1/1 Column

\n

1/1 Column

\n

Heading (size 2)

\n

Paragraph under heading to test line-height.

\n

Heading (size 3)

\n

Heading (size 3) with link

\n

Heading (size 3)

\n

Paragraph under heading to test line-height.

\n

Bacon ipsum dolor amet short ribs shank cow, ribeye corned beef short loin t-bone kielbasa meatloaf ball tip rump venison boudin brisket beef ribs. Fatback landjaeger frankfurter, meatloaf picanha andouille leberkas. Tail beef ribs boudin salami, kevin cupim landjaeger pork loin tenderloin ham filet mignon drumstick short loin. Biltong frankfurter shank pork belly picanha prosciutto meatloaf tail hamburger landjaeger pancetta shankle pig. Pig tri-tip tenderloin ground round ribeye alcatra turkey salami turducken sausage pork loin kielbasa hamburger meatloaf strip steak. Ribeye boudin cow, beef ribs t-bone pig short ribs tri-tip pork loin rump shank hamburger short loin. Salami pastrami meatball shoulder cupim.

\n

Bacon kevin shank ball tip shoulder. Jowl leberkas fatback, short loin chuck beef beef ribs short ribs ribeye turducken pork chop brisket filet mignon cow. Turkey ball tip rump bacon filet mignon sausage jowl shoulder chicken ground round kielbasa shankle. Drumstick pancetta corned beef kielbasa porchetta jerky swine leberkas kevin boudin chicken shoulder bacon tri-tip venison. Ham hock ball tip beef ribs spare ribs tail pork ground round, biltong doner t-bone pork chop rump hamburger pancetta brisket.

\n

Brisket beef kielbasa jowl hamburger, doner flank. Shoulder ham hock sausage t-bone pork belly chicken picanha pork loin ham bresaola tri-tip ground round kevin. Chicken sirloin shankle fatback boudin t-bone pig tri-tip bresaola doner cow short loin pancetta short ribs andouille. Cupim doner short ribs, andouille cow t-bone ground round pork porchetta beef capicola. Rump drumstick biltong shank kielbasa bacon ball tip pancetta meatloaf shankle fatback.

\n

Kielbasa jowl flank biltong. Pork loin fatback chicken ham prosciutto sausage cow short loin porchetta kielbasa. Bresaola ham hock pancetta, cow ham tenderloin flank turducken fatback beef jowl short loin pig. Picanha turkey spare ribs capicola andouille, tongue short loin sausage corned beef kevin meatball venison kielbasa pastrami. Beef ribs ground round tenderloin flank.

\n

Alcatra flank ground round corned beef tenderloin prosciutto chicken sirloin, venison leberkas turducken shoulder pastrami bresaola. Chicken leberkas t-bone pork loin drumstick flank. T-bone flank venison alcatra andouille brisket short ribs shankle biltong pancetta pork belly bacon. Tri-tip biltong ham hock jowl chicken. Spare ribs beef ribs shankle corned beef short loin picanha prosciutto bacon ham rump tri-tip doner ground round cupim. Meatloaf andouille bresaola strip steak kevin, pork turducken.

\n

Jowl strip steak pork belly jerky short ribs filet mignon. Kielbasa ham shoulder turducken sausage jerky beef ham

\n

Alcatra hamburger jowl shank jerky. 

\n
    \n
  • One
    • \n
  • Two
    • \n
  • Three
    • \n
\n
    \n
  1. One
    2. \n
  2. Two
    3. \n
  3. Three
    4. \n
\n

Bacon ipsum dolor amet shoulder turkey meatball pork chop porchetta, filet mignon shankle. Sausage meatloaf flank picanha jowl chuck capicola tri-tip. Meatloaf andouille kielbasa beef ribs. 

\n

— Mr. Bacon

" + }, { + "type": "divider", + "styles": { + "block": { + "backgroundColor": "transparent", + "padding": "13px", + "borderStyle": "solid", + "borderWidth": "3px", + "borderColor": "#000000" + } + } + }, { + "type": "spacer", + "styles": { + "block": { + "backgroundColor": "transparent", + "height": "50px" + } + } + }, { + "type": "button", + "text": "Button", + "url": "http://example.org", + "styles": { + "block": { + "backgroundColor": "#666666", + "borderColor": "#1e3650", + "borderWidth": "1px", + "borderRadius": "20px", + "borderStyle": "solid", + "width": "100px", + "lineHeight": "30px", + "fontColor": "#ffffff", + "fontFamily": "Arial", + "fontSize": "13px", + "textAlign": "center" + } + } + }, { + "type": "social", + "icons": [{ + "type": "socialIcon", + "iconType": "custom", + "link": "http://example.org", + "image": "http://mp3.mailpoet.net/various/social-icons/custom.png", + "height": "32px", + "width": "32px", + "text": "Custom" + }, { + "type": "socialIcon", + "iconType": "facebook", + "link": "http://www.facebook.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Facebook.png", + "height": "32px", + "width": "32px", + "text": "Facebook" + }, { + "type": "socialIcon", + "iconType": "twitter", + "link": "http://www.twitter.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Twitter.png", + "height": "32px", + "width": "32px", + "text": "Twitter" + }, { + "type": "socialIcon", + "iconType": "google-plus", + "link": "http://plus.google.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Google-Plus.png", + "height": "32px", + "width": "32px", + "text": "Google Plus" + }, { + "type": "socialIcon", + "iconType": "youtube", + "link": "http://www.youtube.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Youtube.png", + "height": "32px", + "width": "32px", + "text": "Youtube" + }, { + "type": "socialIcon", + "iconType": "website", + "link": "http://example.org", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Website.png", + "height": "32px", + "width": "32px", + "text": "Website" + }, { + "type": "socialIcon", + "iconType": "email", + "link": "mailto:mail@example.org", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Email.png", + "height": "32px", + "width": "32px", + "text": "Email" + }, { + "type": "socialIcon", + "iconType": "instagram", + "link": "http://instagram.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Instagram.png", + "height": "32px", + "width": "32px", + "text": "Instagram" + }, { + "type": "socialIcon", + "iconType": "pinterest", + "link": "http://www.pinterest.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Pinterest.png", + "height": "32px", + "width": "32px", + "text": "Pinterest" + }, { + "type": "socialIcon", + "iconType": "linkedin", + "link": "http://www.linkedin.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/LinkedIn.png", + "height": "32px", + "width": "32px", + "text": "LinkedIn" + }], + "iconSet": "default" + }, { + "type": "image", + "link": "http://example.org", + "src": "http://mp3.mailpoet.net/various/600x250.jpg", + "alt": "600x250", + "padded": false, + "width": "600px", + "height": "250px", + "styles": { + "block": { + "textAlign": "center" + } + } + }] + }] + }, { + "orientation": "horizontal", + "type": "container", + "styles": { + "block": { + "backgroundColor": "transparent" + } + }, + "blocks": [{ + "orientation": "vertical", + "type": "container", + "styles": { + "block": { + "backgroundColor": "transparent" + } + }, + "blocks": [{ + "type": "image", + "link": "http://example.org", + "src": "http://mp3.mailpoet.net/various/300x125.jpg", + "alt": "300x125", + "padded": true, + "width": "300px", + "height": "125px", + "styles": { + "block": { + "textAlign": "center" + } + } + }, { + "type": "text", + "text": "

1/2 Column

\n

1/2 Column

\n

1/2 Column

\n

1/2 Column

\n

Heading (size 2)

\n

Paragraph under heading to test line-height.

\n

Heading (size 3)

\n

Heading (size 3) with link

\n

Heading (size 3)

\n

Paragraph under heading to test line-height.

\n

Bacon ipsum dolor amet short ribs shank cow, ribeye corned beef short loin t-bone kielbasa meatloaf ball tip rump venison boudin brisket beef ribs. Fatback landjaeger frankfurter, meatloaf picanha andouille leberkas. Tail beef ribs boudin salami, kevin cupim landjaeger pork loin tenderloin ham filet mignon drumstick short loin. Biltong frankfurter shank pork belly picanha prosciutto meatloaf tail hamburger landjaeger pancetta shankle pig. Pig tri-tip tenderloin ground round ribeye alcatra turkey salami turducken sausage pork loin kielbasa hamburger meatloaf strip steak. Ribeye boudin cow, beef ribs t-bone pig short ribs tri-tip pork loin rump shank hamburger short loin. Salami pastrami meatball shoulder cupim.

\n

Bacon kevin shank ball tip shoulder. Jowl leberkas fatback, short loin chuck beef beef ribs short ribs ribeye turducken pork chop brisket filet mignon cow. Turkey ball tip rump bacon filet mignon sausage jowl shoulder chicken ground round kielbasa shankle. Drumstick pancetta corned beef kielbasa porchetta jerky swine leberkas kevin boudin chicken shoulder bacon tri-tip venison. Ham hock ball tip beef ribs spare ribs tail pork ground round, biltong doner t-bone pork chop rump hamburger pancetta brisket.

\n

Brisket beef kielbasa jowl hamburger, doner flank. Shoulder ham hock sausage t-bone pork belly chicken picanha pork loin ham bresaola tri-tip ground round kevin. Chicken sirloin shankle fatback boudin t-bone pig tri-tip bresaola doner cow short loin pancetta short ribs andouille. Cupim doner short ribs, andouille cow t-bone ground round pork porchetta beef capicola. Rump drumstick biltong shank kielbasa bacon ball tip pancetta meatloaf shankle fatback.

\n

Kielbasa jowl flank biltong. Pork loin fatback chicken ham prosciutto sausage cow short loin porchetta kielbasa. Bresaola ham hock pancetta, cow ham tenderloin flank turducken fatback beef jowl short loin pig. Picanha turkey spare ribs capicola andouille, tongue short loin sausage corned beef kevin meatball venison kielbasa pastrami. Beef ribs ground round tenderloin flank.

\n

Alcatra flank ground round corned beef tenderloin prosciutto chicken sirloin, venison leberkas turducken shoulder pastrami bresaola. Chicken leberkas t-bone pork loin drumstick flank. T-bone flank venison alcatra andouille brisket short ribs shankle biltong pancetta pork belly bacon. Tri-tip biltong ham hock jowl chicken. Spare ribs beef ribs shankle corned beef short loin picanha prosciutto bacon ham rump tri-tip doner ground round cupim. Meatloaf andouille bresaola strip steak kevin, pork turducken.

\n

Jowl strip steak pork belly jerky short ribs filet mignon. Kielbasa ham shoulder turducken sausage jerky beef ham

\n

Alcatra hamburger jowl shank jerky. 

\n
    \n
  • One
    • \n
  • Two
    • \n
  • Three
    • \n
\n
    \n
  1. One
    2. \n
  2. Two
    3. \n
  3. Three
    4. \n
\n

Bacon ipsum dolor amet shoulder turkey meatball pork chop porchetta, filet mignon shankle. Sausage meatloaf flank picanha jowl chuck capicola tri-tip. Meatloaf andouille kielbasa beef ribs. 

\n

— Mr. Bacon

" + }, { + "type": "divider", + "styles": { + "block": { + "backgroundColor": "transparent", + "padding": "13px", + "borderStyle": "solid", + "borderWidth": "3px", + "borderColor": "#000000" + } + } + }, { + "type": "spacer", + "styles": { + "block": { + "backgroundColor": "transparent", + "height": "50px" + } + } + }, { + "type": "button", + "text": "Button", + "url": "http://example.org", + "styles": { + "block": { + "backgroundColor": "#666666", + "borderColor": "#1e3650", + "borderWidth": "1px", + "borderRadius": "20px", + "borderStyle": "solid", + "width": "100px", + "lineHeight": "30px", + "fontColor": "#ffffff", + "fontFamily": "Arial", + "fontSize": "13px", + "textAlign": "center" + } + } + }, { + "type": "social", + "icons": [{ + "type": "socialIcon", + "iconType": "custom", + "link": "http://example.org", + "image": "http://mp3.mailpoet.net/various/social-icons/custom.png", + "height": "32px", + "width": "32px", + "text": "Custom" + }, { + "type": "socialIcon", + "iconType": "facebook", + "link": "http://www.facebook.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Facebook.png", + "height": "32px", + "width": "32px", + "text": "Facebook" + }, { + "type": "socialIcon", + "iconType": "twitter", + "link": "http://www.twitter.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Twitter.png", + "height": "32px", + "width": "32px", + "text": "Twitter" + }, { + "type": "socialIcon", + "iconType": "google-plus", + "link": "http://plus.google.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Google-Plus.png", + "height": "32px", + "width": "32px", + "text": "Google Plus" + }, { + "type": "socialIcon", + "iconType": "youtube", + "link": "http://www.youtube.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Youtube.png", + "height": "32px", + "width": "32px", + "text": "Youtube" + }, { + "type": "socialIcon", + "iconType": "website", + "link": "http://example.org", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Website.png", + "height": "32px", + "width": "32px", + "text": "Website" + }, { + "type": "socialIcon", + "iconType": "email", + "link": "mailto:mail@example.org", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Email.png", + "height": "32px", + "width": "32px", + "text": "Email" + }, { + "type": "socialIcon", + "iconType": "instagram", + "link": "http://instagram.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Instagram.png", + "height": "32px", + "width": "32px", + "text": "Instagram" + }, { + "type": "socialIcon", + "iconType": "pinterest", + "link": "http://www.pinterest.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Pinterest.png", + "height": "32px", + "width": "32px", + "text": "Pinterest" + }, { + "type": "socialIcon", + "iconType": "linkedin", + "link": "http://www.linkedin.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/LinkedIn.png", + "height": "32px", + "width": "32px", + "text": "LinkedIn" + }], + "iconSet": "default" + }, { + "type": "image", + "link": "http://example.org", + "src": "http://mp3.mailpoet.net/various/300x125.jpg", + "alt": "300x125", + "padded": false, + "width": "300px", + "height": "125px", + "styles": { + "block": { + "textAlign": "center" + } + } + }] + }, { + "orientation": "vertical", + "type": "container", + "styles": { + "block": { + "backgroundColor": "transparent" + } + }, + "blocks": [{ + "type": "image", + "link": "http://example.org", + "src": "http://mp3.mailpoet.net/various/300x125.jpg", + "alt": "300x125", + "padded": true, + "width": "300px", + "height": "125px", + "styles": { + "block": { + "textAlign": "center" + } + } + }, { + "type": "text", + "text": "

1/2 Column

\n

1/2 Column

\n

1/2 Column

\n

1/2 Column

\n

Heading (size 2)

\n

Paragraph under heading to test line-height.

\n

Heading (size 3)

\n

Heading (size 3) with link

\n

Heading (size 3)

\n

Paragraph under heading to test line-height.

\n

Bacon ipsum dolor amet short ribs shank cow, ribeye corned beef short loin t-bone kielbasa meatloaf ball tip rump venison boudin brisket beef ribs. Fatback landjaeger frankfurter, meatloaf picanha andouille leberkas. Tail beef ribs boudin salami, kevin cupim landjaeger pork loin tenderloin ham filet mignon drumstick short loin. Biltong frankfurter shank pork belly picanha prosciutto meatloaf tail hamburger landjaeger pancetta shankle pig. Pig tri-tip tenderloin ground round ribeye alcatra turkey salami turducken sausage pork loin kielbasa hamburger meatloaf strip steak. Ribeye boudin cow, beef ribs t-bone pig short ribs tri-tip pork loin rump shank hamburger short loin. Salami pastrami meatball shoulder cupim.

\n

Bacon kevin shank ball tip shoulder. Jowl leberkas fatback, short loin chuck beef beef ribs short ribs ribeye turducken pork chop brisket filet mignon cow. Turkey ball tip rump bacon filet mignon sausage jowl shoulder chicken ground round kielbasa shankle. Drumstick pancetta corned beef kielbasa porchetta jerky swine leberkas kevin boudin chicken shoulder bacon tri-tip venison. Ham hock ball tip beef ribs spare ribs tail pork ground round, biltong doner t-bone pork chop rump hamburger pancetta brisket.

\n

Brisket beef kielbasa jowl hamburger, doner flank. Shoulder ham hock sausage t-bone pork belly chicken picanha pork loin ham bresaola tri-tip ground round kevin. Chicken sirloin shankle fatback boudin t-bone pig tri-tip bresaola doner cow short loin pancetta short ribs andouille. Cupim doner short ribs, andouille cow t-bone ground round pork porchetta beef capicola. Rump drumstick biltong shank kielbasa bacon ball tip pancetta meatloaf shankle fatback.

\n

Kielbasa jowl flank biltong. Pork loin fatback chicken ham prosciutto sausage cow short loin porchetta kielbasa. Bresaola ham hock pancetta, cow ham tenderloin flank turducken fatback beef jowl short loin pig. Picanha turkey spare ribs capicola andouille, tongue short loin sausage corned beef kevin meatball venison kielbasa pastrami. Beef ribs ground round tenderloin flank.

\n

Alcatra flank ground round corned beef tenderloin prosciutto chicken sirloin, venison leberkas turducken shoulder pastrami bresaola. Chicken leberkas t-bone pork loin drumstick flank. T-bone flank venison alcatra andouille brisket short ribs shankle biltong pancetta pork belly bacon. Tri-tip biltong ham hock jowl chicken. Spare ribs beef ribs shankle corned beef short loin picanha prosciutto bacon ham rump tri-tip doner ground round cupim. Meatloaf andouille bresaola strip steak kevin, pork turducken.

\n

Jowl strip steak pork belly jerky short ribs filet mignon. Kielbasa ham shoulder turducken sausage jerky beef ham

\n

Alcatra hamburger jowl shank jerky. 

\n
    \n
  • One
    • \n
  • Two
    • \n
  • Three
    • \n
\n
    \n
  1. One
    2. \n
  2. Two
    3. \n
  3. Three
    4. \n
\n

Bacon ipsum dolor amet shoulder turkey meatball pork chop porchetta, filet mignon shankle. Sausage meatloaf flank picanha jowl chuck capicola tri-tip. Meatloaf andouille kielbasa beef ribs. 

\n

— Mr. Bacon

" + }, { + "type": "divider", + "styles": { + "block": { + "backgroundColor": "transparent", + "padding": "13px", + "borderStyle": "solid", + "borderWidth": "3px", + "borderColor": "#000000" + } + } + }, { + "type": "spacer", + "styles": { + "block": { + "backgroundColor": "transparent", + "height": "50px" + } + } + }, { + "type": "button", + "text": "Button", + "url": "http://example.org", + "styles": { + "block": { + "backgroundColor": "#666666", + "borderColor": "#1e3650", + "borderWidth": "1px", + "borderRadius": "20px", + "borderStyle": "solid", + "width": "100px", + "lineHeight": "30px", + "fontColor": "#ffffff", + "fontFamily": "Arial", + "fontSize": "13px", + "textAlign": "center" + } + } + }, { + "type": "social", + "icons": [{ + "type": "socialIcon", + "iconType": "custom", + "link": "http://example.org", + "image": "http://mp3.mailpoet.net/various/social-icons/custom.png", + "height": "32px", + "width": "32px", + "text": "Custom" + }, { + "type": "socialIcon", + "iconType": "facebook", + "link": "http://www.facebook.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Facebook.png", + "height": "32px", + "width": "32px", + "text": "Facebook" + }, { + "type": "socialIcon", + "iconType": "twitter", + "link": "http://www.twitter.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Twitter.png", + "height": "32px", + "width": "32px", + "text": "Twitter" + }, { + "type": "socialIcon", + "iconType": "google-plus", + "link": "http://plus.google.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Google-Plus.png", + "height": "32px", + "width": "32px", + "text": "Google Plus" + }, { + "type": "socialIcon", + "iconType": "youtube", + "link": "http://www.youtube.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Youtube.png", + "height": "32px", + "width": "32px", + "text": "Youtube" + }, { + "type": "socialIcon", + "iconType": "website", + "link": "http://example.org", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Website.png", + "height": "32px", + "width": "32px", + "text": "Website" + }, { + "type": "socialIcon", + "iconType": "email", + "link": "mailto:mail@example.org", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Email.png", + "height": "32px", + "width": "32px", + "text": "Email" + }, { + "type": "socialIcon", + "iconType": "instagram", + "link": "http://instagram.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Instagram.png", + "height": "32px", + "width": "32px", + "text": "Instagram" + }, { + "type": "socialIcon", + "iconType": "pinterest", + "link": "http://www.pinterest.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Pinterest.png", + "height": "32px", + "width": "32px", + "text": "Pinterest" + }, { + "type": "socialIcon", + "iconType": "linkedin", + "link": "http://www.linkedin.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/LinkedIn.png", + "height": "32px", + "width": "32px", + "text": "LinkedIn" + }], + "iconSet": "default" + }, { + "type": "image", + "link": "http://example.org", + "src": "http://mp3.mailpoet.net/various/300x125.jpg", + "alt": "300x125", + "padded": false, + "width": "300px", + "height": "125px", + "styles": { + "block": { + "textAlign": "center" + } + } + }] + }] + }, { + "orientation": "horizontal", + "type": "container", + "styles": { + "block": { + "backgroundColor": "transparent" + } + }, + "blocks": [{ + "orientation": "vertical", + "type": "container", + "styles": { + "block": { + "backgroundColor": "transparent" + } + }, + "blocks": [{ + "type": "image", + "link": "http://example.org", + "src": "http://mp3.mailpoet.net/various/200x83.jpg", + "alt": "200x83", + "padded": true, + "width": "200px", + "height": "83px", + "styles": { + "block": { + "textAlign": "center" + } + } + }, { + "type": "text", + "text": "

1/3 Column

\n

1/3 Column

\n

1/3 Column

\n

1/3 Column

\n

Heading (size 2)

\n

Paragraph under heading to test line-height.

\n

Heading (size 3)

\n

Heading (size 3) with link

\n

Heading (size 3)

\n

Paragraph under heading to test line-height.

\n

Bacon ipsum dolor amet short ribs shank cow, ribeye corned beef short loin t-bone kielbasa meatloaf ball tip rump venison boudin brisket beef ribs. Fatback landjaeger frankfurter, meatloaf picanha andouille leberkas. Tail beef ribs boudin salami, kevin cupim landjaeger pork loin tenderloin ham filet mignon drumstick short loin. Biltong frankfurter shank pork belly picanha prosciutto meatloaf tail hamburger landjaeger pancetta shankle pig. Pig tri-tip tenderloin ground round ribeye alcatra turkey salami turducken sausage pork loin kielbasa hamburger meatloaf strip steak. Ribeye boudin cow, beef ribs t-bone pig short ribs tri-tip pork loin rump shank hamburger short loin. Salami pastrami meatball shoulder cupim.

\n

Bacon kevin shank ball tip shoulder. Jowl leberkas fatback, short loin chuck beef beef ribs short ribs ribeye turducken pork chop brisket filet mignon cow. Turkey ball tip rump bacon filet mignon sausage jowl shoulder chicken ground round kielbasa shankle. Drumstick pancetta corned beef kielbasa porchetta jerky swine leberkas kevin boudin chicken shoulder bacon tri-tip venison. Ham hock ball tip beef ribs spare ribs tail pork ground round, biltong doner t-bone pork chop rump hamburger pancetta brisket.

\n

Brisket beef kielbasa jowl hamburger, doner flank. Shoulder ham hock sausage t-bone pork belly chicken picanha pork loin ham bresaola tri-tip ground round kevin. Chicken sirloin shankle fatback boudin t-bone pig tri-tip bresaola doner cow short loin pancetta short ribs andouille. Cupim doner short ribs, andouille cow t-bone ground round pork porchetta beef capicola. Rump drumstick biltong shank kielbasa bacon ball tip pancetta meatloaf shankle fatback.

\n

Kielbasa jowl flank biltong. Pork loin fatback chicken ham prosciutto sausage cow short loin porchetta kielbasa. Bresaola ham hock pancetta, cow ham tenderloin flank turducken fatback beef jowl short loin pig. Picanha turkey spare ribs capicola andouille, tongue short loin sausage corned beef kevin meatball venison kielbasa pastrami. Beef ribs ground round tenderloin flank.

\n

Alcatra flank ground round corned beef tenderloin prosciutto chicken sirloin, venison leberkas turducken shoulder pastrami bresaola. Chicken leberkas t-bone pork loin drumstick flank. T-bone flank venison alcatra andouille brisket short ribs shankle biltong pancetta pork belly bacon. Tri-tip biltong ham hock jowl chicken. Spare ribs beef ribs shankle corned beef short loin picanha prosciutto bacon ham rump tri-tip doner ground round cupim. Meatloaf andouille bresaola strip steak kevin, pork turducken.

\n

Jowl strip steak pork belly jerky short ribs filet mignon. Kielbasa ham shoulder turducken sausage jerky beef ham

\n

Alcatra hamburger jowl shank jerky. 

\n
    \n
  • One
    • \n
  • Two
    • \n
  • Three
    • \n
\n
    \n
  1. One
    2. \n
  2. Two
    3. \n
  3. Three
    4. \n
\n

Bacon ipsum dolor amet shoulder turkey meatball pork chop porchetta, filet mignon shankle. Sausage meatloaf flank picanha jowl chuck capicola tri-tip. Meatloaf andouille kielbasa beef ribs. 

\n

— Mr. Bacon

" + }, { + "type": "divider", + "styles": { + "block": { + "backgroundColor": "transparent", + "padding": "13px", + "borderStyle": "solid", + "borderWidth": "3px", + "borderColor": "#000000" + } + } + }, { + "type": "spacer", + "styles": { + "block": { + "backgroundColor": "transparent", + "height": "50px" + } + } + }, { + "type": "button", + "text": "Button", + "url": "http://example.org", + "styles": { + "block": { + "backgroundColor": "#666666", + "borderColor": "#1e3650", + "borderWidth": "1px", + "borderRadius": "20px", + "borderStyle": "solid", + "width": "100px", + "lineHeight": "30px", + "fontColor": "#ffffff", + "fontFamily": "Arial", + "fontSize": "13px", + "textAlign": "center" + } + } + }, { + "type": "social", + "icons": [{ + "type": "socialIcon", + "iconType": "custom", + "link": "http://example.org", + "image": "http://mp3.mailpoet.net/various/social-icons/custom.png", + "height": "32px", + "width": "32px", + "text": "Custom" + }, { + "type": "socialIcon", + "iconType": "facebook", + "link": "http://www.facebook.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Facebook.png", + "height": "32px", + "width": "32px", + "text": "Facebook" + }, { + "type": "socialIcon", + "iconType": "twitter", + "link": "http://www.twitter.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Twitter.png", + "height": "32px", + "width": "32px", + "text": "Twitter" + }, { + "type": "socialIcon", + "iconType": "google-plus", + "link": "http://plus.google.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Google-Plus.png", + "height": "32px", + "width": "32px", + "text": "Google Plus" + }, { + "type": "socialIcon", + "iconType": "youtube", + "link": "http://www.youtube.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Youtube.png", + "height": "32px", + "width": "32px", + "text": "Youtube" + }, { + "type": "socialIcon", + "iconType": "website", + "link": "http://example.org", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Website.png", + "height": "32px", + "width": "32px", + "text": "Website" + }, { + "type": "socialIcon", + "iconType": "email", + "link": "mailto:mail@example.org", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Email.png", + "height": "32px", + "width": "32px", + "text": "Email" + }, { + "type": "socialIcon", + "iconType": "instagram", + "link": "http://instagram.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Instagram.png", + "height": "32px", + "width": "32px", + "text": "Instagram" + }, { + "type": "socialIcon", + "iconType": "pinterest", + "link": "http://www.pinterest.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Pinterest.png", + "height": "32px", + "width": "32px", + "text": "Pinterest" + }, { + "type": "socialIcon", + "iconType": "linkedin", + "link": "http://www.linkedin.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/LinkedIn.png", + "height": "32px", + "width": "32px", + "text": "LinkedIn" + }], + "iconSet": "default" + }, { + "type": "image", + "link": "http://example.org", + "src": "http://mp3.mailpoet.net/various/200x83.jpg", + "alt": "200x83", + "padded": false, + "width": "200px", + "height": "83px", + "styles": { + "block": { + "textAlign": "center" + } + } + }] + }, { + "orientation": "vertical", + "type": "container", + "styles": { + "block": { + "backgroundColor": "transparent" + } + }, + "blocks": [{ + "type": "image", + "link": "http://example.org", + "src": "http://mp3.mailpoet.net/various/200x83.jpg", + "alt": "200x83", + "padded": true, + "width": "200px", + "height": "83px", + "styles": { + "block": { + "textAlign": "center" + } + } + }, { + "type": "text", + "text": "

1/3 Column

\n

1/3 Column

\n

1/3 Column

\n

1/3 Column

\n

Heading (size 2)

\n

Paragraph under heading to test line-height.

\n

Heading (size 3)

\n

Heading (size 3) with link

\n

Heading (size 3)

\n

Paragraph under heading to test line-height.

\n

Bacon ipsum dolor amet short ribs shank cow, ribeye corned beef short loin t-bone kielbasa meatloaf ball tip rump venison boudin brisket beef ribs. Fatback landjaeger frankfurter, meatloaf picanha andouille leberkas. Tail beef ribs boudin salami, kevin cupim landjaeger pork loin tenderloin ham filet mignon drumstick short loin. Biltong frankfurter shank pork belly picanha prosciutto meatloaf tail hamburger landjaeger pancetta shankle pig. Pig tri-tip tenderloin ground round ribeye alcatra turkey salami turducken sausage pork loin kielbasa hamburger meatloaf strip steak. Ribeye boudin cow, beef ribs t-bone pig short ribs tri-tip pork loin rump shank hamburger short loin. Salami pastrami meatball shoulder cupim.

\n

Bacon kevin shank ball tip shoulder. Jowl leberkas fatback, short loin chuck beef beef ribs short ribs ribeye turducken pork chop brisket filet mignon cow. Turkey ball tip rump bacon filet mignon sausage jowl shoulder chicken ground round kielbasa shankle. Drumstick pancetta corned beef kielbasa porchetta jerky swine leberkas kevin boudin chicken shoulder bacon tri-tip venison. Ham hock ball tip beef ribs spare ribs tail pork ground round, biltong doner t-bone pork chop rump hamburger pancetta brisket.

\n

Brisket beef kielbasa jowl hamburger, doner flank. Shoulder ham hock sausage t-bone pork belly chicken picanha pork loin ham bresaola tri-tip ground round kevin. Chicken sirloin shankle fatback boudin t-bone pig tri-tip bresaola doner cow short loin pancetta short ribs andouille. Cupim doner short ribs, andouille cow t-bone ground round pork porchetta beef capicola. Rump drumstick biltong shank kielbasa bacon ball tip pancetta meatloaf shankle fatback.

\n

Kielbasa jowl flank biltong. Pork loin fatback chicken ham prosciutto sausage cow short loin porchetta kielbasa. Bresaola ham hock pancetta, cow ham tenderloin flank turducken fatback beef jowl short loin pig. Picanha turkey spare ribs capicola andouille, tongue short loin sausage corned beef kevin meatball venison kielbasa pastrami. Beef ribs ground round tenderloin flank.

\n

Alcatra flank ground round corned beef tenderloin prosciutto chicken sirloin, venison leberkas turducken shoulder pastrami bresaola. Chicken leberkas t-bone pork loin drumstick flank. T-bone flank venison alcatra andouille brisket short ribs shankle biltong pancetta pork belly bacon. Tri-tip biltong ham hock jowl chicken. Spare ribs beef ribs shankle corned beef short loin picanha prosciutto bacon ham rump tri-tip doner ground round cupim. Meatloaf andouille bresaola strip steak kevin, pork turducken.

\n

Jowl strip steak pork belly jerky short ribs filet mignon. Kielbasa ham shoulder turducken sausage jerky beef ham

\n

Alcatra hamburger jowl shank jerky. 

\n
    \n
  • One
    • \n
  • Two
    • \n
  • Three
    • \n
\n
    \n
  1. One
    2. \n
  2. Two
    3. \n
  3. Three
    4. \n
\n

Bacon ipsum dolor amet shoulder turkey meatball pork chop porchetta, filet mignon shankle. Sausage meatloaf flank picanha jowl chuck capicola tri-tip. Meatloaf andouille kielbasa beef ribs. 

\n

— Mr. Bacon

" + }, { + "type": "divider", + "styles": { + "block": { + "backgroundColor": "transparent", + "padding": "13px", + "borderStyle": "solid", + "borderWidth": "3px", + "borderColor": "#000000" + } + } + }, { + "type": "spacer", + "styles": { + "block": { + "backgroundColor": "transparent", + "height": "50px" + } + } + }, { + "type": "button", + "text": "Button", + "url": "http://example.org", + "styles": { + "block": { + "backgroundColor": "#666666", + "borderColor": "#1e3650", + "borderWidth": "1px", + "borderRadius": "20px", + "borderStyle": "solid", + "width": "100px", + "lineHeight": "30px", + "fontColor": "#ffffff", + "fontFamily": "Arial", + "fontSize": "13px", + "textAlign": "center" + } + } + }, { + "type": "social", + "icons": [{ + "type": "socialIcon", + "iconType": "custom", + "link": "http://example.org", + "image": "http://mp3.mailpoet.net/various/social-icons/custom.png", + "height": "32px", + "width": "32px", + "text": "Custom" + }, { + "type": "socialIcon", + "iconType": "facebook", + "link": "http://www.facebook.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Facebook.png", + "height": "32px", + "width": "32px", + "text": "Facebook" + }, { + "type": "socialIcon", + "iconType": "twitter", + "link": "http://www.twitter.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Twitter.png", + "height": "32px", + "width": "32px", + "text": "Twitter" + }, { + "type": "socialIcon", + "iconType": "google-plus", + "link": "http://plus.google.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Google-Plus.png", + "height": "32px", + "width": "32px", + "text": "Google Plus" + }, { + "type": "socialIcon", + "iconType": "youtube", + "link": "http://www.youtube.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Youtube.png", + "height": "32px", + "width": "32px", + "text": "Youtube" + }, { + "type": "socialIcon", + "iconType": "website", + "link": "http://example.org", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Website.png", + "height": "32px", + "width": "32px", + "text": "Website" + }, { + "type": "socialIcon", + "iconType": "email", + "link": "mailto:mail@example.org", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Email.png", + "height": "32px", + "width": "32px", + "text": "Email" + }, { + "type": "socialIcon", + "iconType": "instagram", + "link": "http://instagram.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Instagram.png", + "height": "32px", + "width": "32px", + "text": "Instagram" + }, { + "type": "socialIcon", + "iconType": "pinterest", + "link": "http://www.pinterest.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Pinterest.png", + "height": "32px", + "width": "32px", + "text": "Pinterest" + }, { + "type": "socialIcon", + "iconType": "linkedin", + "link": "http://www.linkedin.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/LinkedIn.png", + "height": "32px", + "width": "32px", + "text": "LinkedIn" + }], + "iconSet": "default" + }, { + "type": "image", + "link": "http://example.org", + "src": "http://mp3.mailpoet.net/various/200x83.jpg", + "alt": "200x83", + "padded": false, + "width": "200px", + "height": "83px", + "styles": { + "block": { + "textAlign": "center" + } + } + }] + }, { + "orientation": "vertical", + "type": "container", + "styles": { + "block": { + "backgroundColor": "transparent" + } + }, + "blocks": [{ + "type": "image", + "link": "http://example.org", + "src": "http://mp3.mailpoet.net/various/200x83.jpg", + "alt": "200x83", + "padded": true, + "width": "200px", + "height": "83px", + "styles": { + "block": { + "textAlign": "center" + } + } + }, { + "type": "text", + "text": "

1/3 Column

\n

1/3 Column

\n

1/3 Column

\n

1/3 Column

\n

Heading (size 2)

\n

Paragraph under heading to test line-height.

\n

Heading (size 3)

\n

Heading (size 3) with link

\n

Heading (size 3)

\n

Paragraph under heading to test line-height.

\n

Bacon ipsum dolor amet short ribs shank cow, ribeye corned beef short loin t-bone kielbasa meatloaf ball tip rump venison boudin brisket beef ribs. Fatback landjaeger frankfurter, meatloaf picanha andouille leberkas. Tail beef ribs boudin salami, kevin cupim landjaeger pork loin tenderloin ham filet mignon drumstick short loin. Biltong frankfurter shank pork belly picanha prosciutto meatloaf tail hamburger landjaeger pancetta shankle pig. Pig tri-tip tenderloin ground round ribeye alcatra turkey salami turducken sausage pork loin kielbasa hamburger meatloaf strip steak. Ribeye boudin cow, beef ribs t-bone pig short ribs tri-tip pork loin rump shank hamburger short loin. Salami pastrami meatball shoulder cupim.

\n

Bacon kevin shank ball tip shoulder. Jowl leberkas fatback, short loin chuck beef beef ribs short ribs ribeye turducken pork chop brisket filet mignon cow. Turkey ball tip rump bacon filet mignon sausage jowl shoulder chicken ground round kielbasa shankle. Drumstick pancetta corned beef kielbasa porchetta jerky swine leberkas kevin boudin chicken shoulder bacon tri-tip venison. Ham hock ball tip beef ribs spare ribs tail pork ground round, biltong doner t-bone pork chop rump hamburger pancetta brisket.

\n

Brisket beef kielbasa jowl hamburger, doner flank. Shoulder ham hock sausage t-bone pork belly chicken picanha pork loin ham bresaola tri-tip ground round kevin. Chicken sirloin shankle fatback boudin t-bone pig tri-tip bresaola doner cow short loin pancetta short ribs andouille. Cupim doner short ribs, andouille cow t-bone ground round pork porchetta beef capicola. Rump drumstick biltong shank kielbasa bacon ball tip pancetta meatloaf shankle fatback.

\n

Kielbasa jowl flank biltong. Pork loin fatback chicken ham prosciutto sausage cow short loin porchetta kielbasa. Bresaola ham hock pancetta, cow ham tenderloin flank turducken fatback beef jowl short loin pig. Picanha turkey spare ribs capicola andouille, tongue short loin sausage corned beef kevin meatball venison kielbasa pastrami. Beef ribs ground round tenderloin flank.

\n

Alcatra flank ground round corned beef tenderloin prosciutto chicken sirloin, venison leberkas turducken shoulder pastrami bresaola. Chicken leberkas t-bone pork loin drumstick flank. T-bone flank venison alcatra andouille brisket short ribs shankle biltong pancetta pork belly bacon. Tri-tip biltong ham hock jowl chicken. Spare ribs beef ribs shankle corned beef short loin picanha prosciutto bacon ham rump tri-tip doner ground round cupim. Meatloaf andouille bresaola strip steak kevin, pork turducken.

\n

Jowl strip steak pork belly jerky short ribs filet mignon. Kielbasa ham shoulder turducken sausage jerky beef ham

\n

Alcatra hamburger jowl shank jerky. 

\n
    \n
  • One
    • \n
  • Two
    • \n
  • Three
    • \n
\n
    \n
  1. One
    2. \n
  2. Two
    3. \n
  3. Three
    4. \n
\n

Bacon ipsum dolor amet shoulder turkey meatball pork chop porchetta, filet mignon shankle. Sausage meatloaf flank picanha jowl chuck capicola tri-tip. Meatloaf andouille kielbasa beef ribs. 

\n

— Mr. Bacon

" + }, { + "type": "divider", + "styles": { + "block": { + "backgroundColor": "transparent", + "padding": "13px", + "borderStyle": "solid", + "borderWidth": "3px", + "borderColor": "#000000" + } + } + }, { + "type": "spacer", + "styles": { + "block": { + "backgroundColor": "transparent", + "height": "50px" + } + } + }, { + "type": "button", + "text": "Button", + "url": "http://example.org", + "styles": { + "block": { + "backgroundColor": "#666666", + "borderColor": "#1e3650", + "borderWidth": "1px", + "borderRadius": "20px", + "borderStyle": "solid", + "width": "100px", + "lineHeight": "30px", + "fontColor": "#ffffff", + "fontFamily": "Arial", + "fontSize": "13px", + "textAlign": "center" + } + } + }, { + "type": "social", + "icons": [{ + "type": "socialIcon", + "iconType": "custom", + "link": "http://example.org", + "image": "http://mp3.mailpoet.net/various/social-icons/custom.png", + "height": "32px", + "width": "32px", + "text": "Custom" + }, { + "type": "socialIcon", + "iconType": "facebook", + "link": "http://www.facebook.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Facebook.png", + "height": "32px", + "width": "32px", + "text": "Facebook" + }, { + "type": "socialIcon", + "iconType": "twitter", + "link": "http://www.twitter.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Twitter.png", + "height": "32px", + "width": "32px", + "text": "Twitter" + }, { + "type": "socialIcon", + "iconType": "google-plus", + "link": "http://plus.google.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Google-Plus.png", + "height": "32px", + "width": "32px", + "text": "Google Plus" + }, { + "type": "socialIcon", + "iconType": "youtube", + "link": "http://www.youtube.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Youtube.png", + "height": "32px", + "width": "32px", + "text": "Youtube" + }, { + "type": "socialIcon", + "iconType": "website", + "link": "http://example.org", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Website.png", + "height": "32px", + "width": "32px", + "text": "Website" + }, { + "type": "socialIcon", + "iconType": "email", + "link": "mailto:mail@example.org", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Email.png", + "height": "32px", + "width": "32px", + "text": "Email" + }, { + "type": "socialIcon", + "iconType": "instagram", + "link": "http://instagram.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Instagram.png", + "height": "32px", + "width": "32px", + "text": "Instagram" + }, { + "type": "socialIcon", + "iconType": "pinterest", + "link": "http://www.pinterest.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/Pinterest.png", + "height": "32px", + "width": "32px", + "text": "Pinterest" + }, { + "type": "socialIcon", + "iconType": "linkedin", + "link": "http://www.linkedin.com", + "image": "http://mp3.mailpoet.net/various/social-icons/01-social/LinkedIn.png", + "height": "32px", + "width": "32px", + "text": "LinkedIn" + }], + "iconSet": "default" + }, { + "type": "image", + "link": "http://example.org", + "src": "http://mp3.mailpoet.net/various/200x83.jpg", + "alt": "200x83", + "padded": false, + "width": "200px", + "height": "83px", + "styles": { + "block": { + "textAlign": "center" + } + } + }] + }] + }, { + "orientation": "horizontal", + "type": "container", + "styles": { + "block": { + "backgroundColor": "transparent" + } + }, + "blocks": [{ + "orientation": "vertical", + "type": "container", + "styles": { + "block": { + "backgroundColor": "transparent" + } + }, + "blocks": [{ + "type": "footer", + "text": "

You are receiving this email because you opted in on our website. Update your email preferences or unsubscribe. 

\n

123 Maple Avenue
93102
Oakland, California

", + "styles": { + "block": { + "backgroundColor": "#333333" + }, + "text": { + "fontColor": "#aaaaaa", + "fontFamily": "Arial", + "fontSize": "12px", + "textAlign": "center" + }, + "link": { + "fontColor": "#a86b6b", + "textDecoration": "underline" + } + } + }] + }] + }] + }, + "globalStyles": { + "text": { + "fontColor": "#565656", + "fontFamily": "Arial", + "fontSize": "16px" + }, + "h1": { + "fontColor": "#565656", + "fontFamily": "Arial", + "fontSize": "36px" + }, + "h2": { + "fontColor": "#565656", + "fontFamily": "Arial", + "fontSize": "26px" + }, + "h3": { + "fontColor": "#565656", + "fontFamily": "Arial", + "fontSize": "18px" + }, + "link": { + "fontColor": "#a86b6b", + "textDecoration": "underline" + }, + "wrapper": { + "backgroundColor": "#999999" + }, + "body": { + "backgroundColor": "#333333" + } + }, + "subject": "Click to change the subject!", + "preheader": "", + "id": 3 +} \ No newline at end of file