{"id":74529,"date":"2016-08-08T10:00:44","date_gmt":"2016-08-08T14:00:44","guid":{"rendered":"http:\/\/www.templatemonster.com\/help\/?p=74529"},"modified":"2017-04-10T11:27:26","modified_gmt":"2017-04-10T15:27:26","slug":"newsletter-template-how-to-manage-template-design-in-the-mailchimp-editor","status":"publish","type":"post","link":"https:\/\/www.templatemonster.com\/help\/newsletter-template-how-to-manage-template-design-in-the-mailchimp-editor.html","title":{"rendered":"Newsletter Template. How to manage template design in the MailChimp editor"},"content":{"rendered":"<p>Hello, this tutorial is going to show you <strong>how to use the MailChimp templates editor<\/strong>. <\/p>\r\n\r\n <div class=\"video-container\">\r\n\t<iframe src=\"https:\/\/www.youtube.com\/embed\/RQL4v6MkxKk\"><\/iframe>\r\n<\/div>\r\n<p>In order to start using a newsletter you need to create a campaign at your MailChimp account and upload a template there using the File Manager. \r\n\r\nThen you&#8217;ll see your template available for editing at the Templates section. Press <strong>Edit<\/strong> button to start modifying it.<\/p>\r\n\r\n<a class=\"darkbox\" href=\"\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_1.png\"><img loading=\"lazy\" src=\"\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_1-300x118.png\" alt=\"Newsletter_templates.How_to_use_mailchimp_editor_1\" width=\"300\" height=\"118\" class=\"alignnone size-medium wp-image-74530\" srcset=\"https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_1-300x118.png 300w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_1-150x59.png 150w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_1-768x301.png 768w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_1-1024x401.png 1024w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_1.png 1296w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a>\r\n\r\n<p>It will load a preview of the Design editing mode. There are 2 modes available: <strong>Design and Code<\/strong>.\r\n\r\nLet&#8217;s learn how to use the Design mode.<\/p>\r\n\r\n<p>Hover your newsletter content to see the editing tools.\r\nPress the <strong>Edit<\/strong> button to see the item&#8217;s details at the right side:<\/p>\r\n\r\n\r\n<a class=\"darkbox\" href=\"\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_2.png\"><img loading=\"lazy\" src=\"\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_2-300x158.png\" alt=\"Newsletter_templates.How_to_use_mailchimp_editor_2\" width=\"300\" height=\"158\" class=\"alignnone size-medium wp-image-74531\" srcset=\"https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_2-300x158.png 300w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_2-150x79.png 150w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_2-768x404.png 768w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_2-1024x538.png 1024w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_2.png 1294w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a>\r\n\r\n<p>As you can see, it&#8217;s an image with a white text on a transparent background. Let&#8217;s edit it. \r\nThere are available tools listed at top, use them to change an image up to your needs and press <strong>Apply and Save<\/strong><\/p>\r\n\r\n<a class=\"darkbox\" href=\"\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_3.png\"><img loading=\"lazy\" src=\"\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_3-300x133.png\" alt=\"Newsletter_templates.How_to_use_mailchimp_editor_3\" width=\"300\" height=\"133\" class=\"alignnone size-medium wp-image-74532\" srcset=\"https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_3-300x133.png 300w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_3-150x67.png 150w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_3-768x342.png 768w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_3-1024x456.png 1024w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_3.png 1299w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a>\r\n\r\n<p>The edits will be displayed on the preview right away.<\/p>\r\n\r\n<a class=\"darkbox\" href=\"\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_4.png\"><img loading=\"lazy\" src=\"\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_4-300x139.png\" alt=\"Newsletter_templates.How_to_use_mailchimp_editor_4\" width=\"300\" height=\"139\" class=\"alignnone size-medium wp-image-74533\" srcset=\"https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_4-300x139.png 300w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_4-150x69.png 150w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_4-768x355.png 768w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_4-1024x474.png 1024w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_4.png 1291w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a>\r\n\r\n<p>You can also <strong>replace<\/strong> the image (it&#8217;s better to keep the same dimensions as the original one has). Just choose a one in a File Manager or upload a new one.\r\n\r\nNext, you can edit the text content similarly. Hover the text and press the <strong>Edit<\/strong> button.\r\nYou can modify the text at the right side using the editor options. \r\nAll the changes will be displayed immediately, save them using the <strong>Save &amp; Close<\/strong> button when you&#8217;re done.<\/p>\r\n\r\n<a class=\"darkbox\" href=\"\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_5.png\"><img loading=\"lazy\" src=\"\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_5-300x156.png\" alt=\"Newsletter_templates.How_to_use_mailchimp_editor_5\" width=\"300\" height=\"156\" class=\"alignnone size-medium wp-image-74534\" srcset=\"https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_5-300x156.png 300w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_5-150x78.png 150w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_5-768x401.png 768w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_5-1024x534.png 1024w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_5.png 1296w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a>\r\n\r\n<p>Same is applicable for any other content below. You can remove some sections if you don&#8217;t need them, but you can&#8217;t drop files here. As to images, there are also the editing <strong>Settings<\/strong> available, such as <em>width, height, image alignment<\/em>, etc.<\/p>\r\n\r\n<a class=\"darkbox\" href=\"\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_6.png\"><img loading=\"lazy\" src=\"\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_6-196x300.png\" alt=\"Newsletter_templates.How_to_use_mailchimp_editor_6\" width=\"196\" height=\"300\" class=\"alignnone size-medium wp-image-74535\" srcset=\"https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_6-196x300.png 196w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_6-98x150.png 98w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_6.png 410w\" sizes=\"(max-width: 196px) 100vw, 196px\" \/><\/a>\r\n\r\n<p>If the <strong>Design mode<\/strong> options are not enough, you can switch to <strong>Code mode<\/strong> anytime and edit the page&#8217;s source code.\r\nYou can also expand it to the entire screen using a button at the bottom right corner and change code window size back or Save and exit. <\/p>\r\n\r\n<a class=\"darkbox\" href=\"\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_7.png\"><img loading=\"lazy\" src=\"\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_7-300x172.png\" alt=\"Newsletter_templates.How_to_use_mailchimp_editor_7\" width=\"300\" height=\"172\" class=\"alignnone size-medium wp-image-74536\" srcset=\"https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_7-300x172.png 300w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_7-150x86.png 150w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_7-768x441.png 768w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_7-1024x588.png 1024w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_7.png 1293w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a>\r\n\r\n<p>You can <strong>preview<\/strong> and test your <a href=\"https:\/\/www.templatemonster.com\/newsletter-email-templates.php\" title=\"newsletter\">newsletter<\/a> directly from the editor using the respective button<\/p>\r\n\r\n<a class=\"darkbox\" href=\"\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_8.png\"><img loading=\"lazy\" src=\"\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_8-300x197.png\" alt=\"Newsletter_templates.How_to_use_mailchimp_editor_8\" width=\"300\" height=\"197\" class=\"alignnone size-medium wp-image-74537\" srcset=\"https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_8-300x197.png 300w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_8-150x99.png 150w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_8.png 648w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a>\r\n<p>There are different layouts available for preview: Desktop, Mobile, Inbox.\r\nYou can also close that window and send a test email instead, just enter your address and check the inbox.<\/p>\r\n\r\n<a class=\"darkbox\" href=\"\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_9.png\"><img loading=\"lazy\" src=\"\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_9-300x154.png\" alt=\"Newsletter_templates.How_to_use_mailchimp_editor_9\" width=\"300\" height=\"154\" class=\"alignnone size-medium wp-image-74538\" srcset=\"https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_9-300x154.png 300w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_9-150x77.png 150w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_9-768x393.png 768w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_9-1024x524.png 1024w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/Newsletter_templates.How_to_use_mailchimp_editor_9.png 1279w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a>\r\n<p>As you can see, our edits were applied successfully. That&#8217;s the end of this tutorial, now you know how to use the MailChimp templates editor.<\/p>\r\n<p>Feel free to check the detailed video tutorial below:<\/p>\r\n<a href=\"http:\/\/www.youtube.com\/watch?v=RQL4v6MkxKk?width=1280&amp;height=720\" rel=\"prettyPhoto\">Newsletter Template. How to manage template design in the MailChimp editor<\/a>","protected":false},"excerpt":{"rendered":"<p>Hello, this tutorial is going to show you <strong>how to use the MailChimp templates editor<\/strong>. <\/p>\n","protected":false},"author":59,"featured_media":74539,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[1016],"tags":[664,2420,1100,767],"_links":{"self":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts\/74529"}],"collection":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/users\/59"}],"replies":[{"embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/comments?post=74529"}],"version-history":[{"count":0,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts\/74529\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/media\/74539"}],"wp:attachment":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/media?parent=74529"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/categories?post=74529"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/tags?post=74529"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}