{"id":49926,"date":"2015-06-30T06:02:03","date_gmt":"2015-06-30T10:02:03","guid":{"rendered":"http:\/\/www.templatemonster.com\/help\/?p=49926"},"modified":"2016-02-16T09:59:29","modified_gmt":"2016-02-16T14:59:29","slug":"landing-page-how-to-integrate-mailchimp-to-newsletter-form","status":"publish","type":"post","link":"https:\/\/www.templatemonster.com\/help\/landing-page-how-to-integrate-mailchimp-to-newsletter-form.html","title":{"rendered":"Landing Page. How to integrate MailChimp to newsletter form"},"content":{"rendered":"<p><br \/>\r\n<a href=\"http:\/\/www.youtube.com\/watch?v=F-4jU2ZDnF0?width=1280&amp;height=720\" rel=\"prettyPhoto\">Landing Page. How to integrate MailChimp to newsletter form<\/a><\/p>\r\n<p>This tutorial shows how to integrate MailChimp to Newsletter form in Landing Page templates.<\/p>\r\n<p><a href=\"\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-1.jpg\"><img loading=\"lazy\" src=\"\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-1-300x162.jpg\" alt=\"Landing Page. How to integrate MailChimp to newsletter form-1\" width=\"300\" height=\"162\" class=\"aligncenter size-medium wp-image-49927\" srcset=\"https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-1-300x162.jpg 300w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-1-150x81.jpg 150w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-1-1024x551.jpg 1024w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-1.jpg 1226w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a><\/p>\r\n<ol>\r\n<li>\r\n<p>Basically, we are going to replace template subscription form with MailChimp subscription form. Log into MailChimp and go to Lists section. Make sure that you have list. Create it in case you do not have it. Click on <strong>Signup forms<\/strong>:<\/p>\r\n<p><a href=\"\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-2.jpg\"><img loading=\"lazy\" src=\"\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-2-300x167.jpg\" alt=\"Landing Page. How to integrate MailChimp to newsletter form-2\" width=\"300\" height=\"167\" class=\"aligncenter size-medium wp-image-49928\" srcset=\"https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-2-300x167.jpg 300w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-2-150x84.jpg 150w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-2-1024x571.jpg 1024w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-2.jpg 1238w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a>\r\n<\/li>\r\n<li>\r\n<p>Select<strong> Embedded forms<\/strong>:<\/p>\r\n<p><a href=\"\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-3.jpg\"><img loading=\"lazy\" src=\"\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-3-300x166.jpg\" alt=\"Landing Page. How to integrate MailChimp to newsletter form-3\" width=\"300\" height=\"166\" class=\"aligncenter size-medium wp-image-49929\" srcset=\"https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-3-300x166.jpg 300w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-3-150x83.jpg 150w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-3-1024x566.jpg 1024w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-3.jpg 1210w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a>\r\n  <\/li>\r\n<li>\r\n<p>Specify<strong> form title<\/strong>. Select <strong>Show Only required fields<\/strong>, uncheck<strong> Show required field indicators<\/strong> and copy the code for embedding:<\/p>\r\n<p><a href=\"\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-4.jpg\"><img loading=\"lazy\" src=\"\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-4-300x170.jpg\" alt=\"Landing Page. How to integrate MailChimp to newsletter form-4\" width=\"300\" height=\"170\" class=\"aligncenter size-medium wp-image-49930\" srcset=\"https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-4-300x170.jpg 300w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-4-150x85.jpg 150w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-4-1024x579.jpg 1024w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-4.jpg 1224w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a>\r\n<\/li>\r\n<li>\r\n<p>Open .html file with subscription form. Locate the code with subscription form:<\/p>\r\n<p><a href=\"\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-5.jpg\"><img loading=\"lazy\" src=\"\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-5-300x157.jpg\" alt=\"Landing Page. How to integrate MailChimp to newsletter form-5\" width=\"300\" height=\"157\" class=\"aligncenter size-medium wp-image-49931\" srcset=\"https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-5-300x157.jpg 300w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-5-150x78.jpg 150w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-5-1024x534.jpg 1024w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-5.jpg 1234w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a> <\/p>\r\n<\/li>\r\n<li>\r\n<p>Replace the original code with the one provided by MailChimp. <strong>Be sure to keep structure of code (grids\/spans)<\/strong>:\r\n<\/p>\r\n<p><a href=\"\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-6.jpg\"><img loading=\"lazy\" src=\"\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-6-300x164.jpg\" alt=\"Landing Page. How to integrate MailChimp to newsletter form-6\" width=\"300\" height=\"164\" class=\"aligncenter size-medium wp-image-49932\" srcset=\"https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-6-300x164.jpg 300w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-6-150x82.jpg 150w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-6-1024x558.jpg 1024w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-6.jpg 1249w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a>\r\n<\/li>\r\n<li>\r\n<p>Now we should modify MailChimp code. You may use default styles for MailChimp form or change them. We are going to remove them and use template styles (code is highlighted on the screenshot):<\/p>\r\n<p><a href=\"\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-7.jpg\"><img loading=\"lazy\" src=\"\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-7-300x163.jpg\" alt=\"Landing Page. How to integrate MailChimp to newsletter form-7\" width=\"300\" height=\"163\" class=\"aligncenter size-medium wp-image-49933\" srcset=\"https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-7-300x163.jpg 300w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-7-150x82.jpg 150w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-7-1024x557.jpg 1024w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-7.jpg 1206w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a>\r\n<\/li>\r\n<li>\r\n<p>We should also move scripts to head section of .html file as well as link to css file: <\/p>\r\n<p><a href=\"\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-8.jpg\"><img loading=\"lazy\" src=\"\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-8-300x164.jpg\" alt=\"Landing Page. How to integrate MailChimp to newsletter form-8\" width=\"300\" height=\"164\" class=\"aligncenter size-medium wp-image-49934\" srcset=\"https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-8-300x164.jpg 300w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-8-150x82.jpg 150w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-8-1024x560.jpg 1024w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-8.jpg 1215w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a>\r\n<\/li>\r\n<li>\r\n<p>Save changes you have performed. Upload the modified file and replace the original one. Refresh page.<\/p>\r\n<\/li>\r\n<li>\r\n<p>We have integrated MailChimp newsletter form. Note: you may need to add custom styles in order to change appearance of this form:<\/p>\r\n<p><a href=\"\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-9.jpg\"><img loading=\"lazy\" src=\"\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-9-300x161.jpg\" alt=\"Landing Page. How to integrate MailChimp to newsletter form-9\" width=\"300\" height=\"161\" class=\"aligncenter size-medium wp-image-49935\" srcset=\"https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-9-300x161.jpg 300w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-9-150x81.jpg 150w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-9-1024x551.jpg 1024w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/Landing-Page.-How-to-integrate-MailChimp-to-newsletter-form-9.jpg 1231w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a>\r\n<\/li>\r\n<\/ol>\r\n<p>Feel free to check the detailed video tutorial below:<\/p>\r\n<p><a href=\"http:\/\/www.youtube.com\/watch?v=F-4jU2ZDnF0?width=1280&amp;height=720\" rel=\"prettyPhoto\">Landing Page. How to integrate MailChimp to newsletter form<\/a><br \/>\r\n<\/p>","protected":false},"excerpt":{"rendered":"<p>This tutorial shows how to integrate MailChimp to Newsletter form.<\/p>\n","protected":false},"author":39,"featured_media":49938,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[2039],"tags":[640,1117,1707,1100],"_links":{"self":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts\/49926"}],"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\/39"}],"replies":[{"embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/comments?post=49926"}],"version-history":[{"count":0,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts\/49926\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/media\/49938"}],"wp:attachment":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/media?parent=49926"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/categories?post=49926"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/tags?post=49926"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}