{"id":8212,"date":"2016-10-27T00:13:27","date_gmt":"2016-10-27T07:13:27","guid":{"rendered":"http:\/\/wpbeaveraddons.com\/?p=8212"},"modified":"2016-12-25T21:11:51","modified_gmt":"2016-12-26T05:11:51","slug":"beaver-builder-subscribe-form-module-presets","status":"publish","type":"post","link":"https:\/\/wpbeaveraddons.com\/beaver-builder-subscribe-form-module-presets\/","title":{"rendered":"5 Free Beaver Builder Optin \/ Subscribe Form Module Presets"},"content":{"rendered":"<p>Beaver Builder offers an easy to use <a href=\"https:\/\/wpbeaveraddons.com\/demo\/subscribe-form\/\">Subscribe Form module<\/a>\u00a0that can be\u00a0used to build optin forms and connect with popular mailing services. The subscribe form has all the basic features but lacks some styling options. So, we built a few designs and are sharing the custom CSS code which you can re-use or modify as per your requirements.<\/p>\n<p>If you are not comfortable with CSS or do not want to spend time\u00a0on this then you can try <a href=\"https:\/\/wpbeaveraddons.com\/\">PowerPack Beaver Builder Addon<\/a>. We have\u00a0extended Beaver Builder&#8217;s <a href=\"https:\/\/wpbeaveraddons.com\/demo\/subscribe-form\/\">Subscribe form module<\/a> with custom design options which will give you a lot of flexibility for design and styling.<\/p>\n<h3>Style 1<\/h3>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-8213\" src=\"https:\/\/wpbeaveraddons.com\/wp-content\/uploads\/2016\/10\/subscribe-form-1.png\" alt=\"subscribe-form-1\" width=\"606\" height=\"256\" srcset=\"https:\/\/wpbeaveraddons.com\/wp-content\/uploads\/2016\/10\/subscribe-form-1.png 606w, https:\/\/wpbeaveraddons.com\/wp-content\/uploads\/2016\/10\/subscribe-form-1-300x127.png 300w\" sizes=\"(max-width: 606px) 100vw, 606px\" \/><\/p>\n<div class=\"oembed-gist\"><script src=\"https:\/\/gist.github.com\/jainnidhi\/f34154216b1af74aab7d4f8b5bea7849.js\"><\/script><noscript>View the code on <a href=\"https:\/\/gist.github.com\/jainnidhi\/f34154216b1af74aab7d4f8b5bea7849\" target=\"_blank\" rel=\"noopener\">Gist<\/a>.<\/noscript><\/div>\n<h3>Style 2<\/h3>\n<p><img decoding=\"async\" class=\"aligncenter size-large wp-image-8214\" src=\"https:\/\/wpbeaveraddons.com\/wp-content\/uploads\/2016\/10\/subscribe-form-2-1024x148.png\" alt=\"subscribe-form-2\" width=\"1024\" height=\"148\" srcset=\"https:\/\/wpbeaveraddons.com\/wp-content\/uploads\/2016\/10\/subscribe-form-2-1024x148.png 1024w, https:\/\/wpbeaveraddons.com\/wp-content\/uploads\/2016\/10\/subscribe-form-2-300x43.png 300w, https:\/\/wpbeaveraddons.com\/wp-content\/uploads\/2016\/10\/subscribe-form-2-768x111.png 768w, https:\/\/wpbeaveraddons.com\/wp-content\/uploads\/2016\/10\/subscribe-form-2.png 1183w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/p>\n<div class=\"oembed-gist\"><script src=\"https:\/\/gist.github.com\/jainnidhi\/8377413b7f0bc7b940a01f50f5101dae.js\"><\/script><noscript>View the code on <a href=\"https:\/\/gist.github.com\/jainnidhi\/8377413b7f0bc7b940a01f50f5101dae\" target=\"_blank\" rel=\"noopener\">Gist<\/a>.<\/noscript><\/div>\n<h3>Style 3<\/h3>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-8215\" src=\"https:\/\/wpbeaveraddons.com\/wp-content\/uploads\/2016\/10\/subscribe-form-3.png\" alt=\"subscribe-form-3\" width=\"608\" height=\"139\" srcset=\"https:\/\/wpbeaveraddons.com\/wp-content\/uploads\/2016\/10\/subscribe-form-3.png 608w, https:\/\/wpbeaveraddons.com\/wp-content\/uploads\/2016\/10\/subscribe-form-3-300x69.png 300w\" sizes=\"(max-width: 608px) 100vw, 608px\" \/><\/p>\n<div class=\"oembed-gist\"><script src=\"https:\/\/gist.github.com\/jainnidhi\/54ca0c2935600d3caeaf91d5db5e67e0.js\"><\/script><noscript>View the code on <a href=\"https:\/\/gist.github.com\/jainnidhi\/54ca0c2935600d3caeaf91d5db5e67e0\" target=\"_blank\" rel=\"noopener\">Gist<\/a>.<\/noscript><\/div>\n<h3>Style 4<\/h3>\n<p><img decoding=\"async\" class=\"aligncenter wp-image-8216\" src=\"https:\/\/wpbeaveraddons.com\/wp-content\/uploads\/2016\/10\/subscribe-form-4-1024x278.png\" alt=\"subscribe-form-4\" width=\"740\" height=\"201\" srcset=\"https:\/\/wpbeaveraddons.com\/wp-content\/uploads\/2016\/10\/subscribe-form-4-1024x278.png 1024w, https:\/\/wpbeaveraddons.com\/wp-content\/uploads\/2016\/10\/subscribe-form-4-300x82.png 300w, https:\/\/wpbeaveraddons.com\/wp-content\/uploads\/2016\/10\/subscribe-form-4-768x209.png 768w, https:\/\/wpbeaveraddons.com\/wp-content\/uploads\/2016\/10\/subscribe-form-4.png 1192w\" sizes=\"(max-width: 740px) 100vw, 740px\" \/><\/p>\n<div class=\"oembed-gist\"><script src=\"https:\/\/gist.github.com\/jainnidhi\/bec60a899576438acf30a20b37d7e5e2.js\"><\/script><noscript>View the code on <a href=\"https:\/\/gist.github.com\/jainnidhi\/bec60a899576438acf30a20b37d7e5e2\" target=\"_blank\" rel=\"noopener\">Gist<\/a>.<\/noscript><\/div>\n<h3>Style 5<\/h3>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-8217\" src=\"https:\/\/wpbeaveraddons.com\/wp-content\/uploads\/2016\/10\/subscribe-form-5.png\" alt=\"subscribe-form-5\" width=\"606\" height=\"196\" srcset=\"https:\/\/wpbeaveraddons.com\/wp-content\/uploads\/2016\/10\/subscribe-form-5.png 606w, https:\/\/wpbeaveraddons.com\/wp-content\/uploads\/2016\/10\/subscribe-form-5-300x97.png 300w\" sizes=\"(max-width: 606px) 100vw, 606px\" \/><\/p>\n<div class=\"oembed-gist\"><script src=\"https:\/\/gist.github.com\/jainnidhi\/902596c55ed960ed4e645bcbd34dde66.js\"><\/script><noscript>View the code on <a href=\"https:\/\/gist.github.com\/jainnidhi\/902596c55ed960ed4e645bcbd34dde66\" target=\"_blank\" rel=\"noopener\">Gist<\/a>.<\/noscript><\/div>\n<p>&nbsp;<\/p>\n<h3>How to use Subscribe form module styles<\/h3>\n<p>Using these styles is very easy. All you need to do is check the CSS class for the style that you want to use. Let&#8217;s say if you want to use\u00a0<strong>Style 3\u00a0<\/strong>then the CSS class for that style is\u00a0<strong>.subscribe-form-3\u00a0<\/strong><\/p>\n<p>You\u00a0will need to add this CSS class to the subscribe form module as shown below.<\/p>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-8218\" src=\"https:\/\/wpbeaveraddons.com\/wp-content\/uploads\/2016\/10\/subscribe-form-module.png\" alt=\"subscribe-form-module\" width=\"695\" height=\"565\" srcset=\"https:\/\/wpbeaveraddons.com\/wp-content\/uploads\/2016\/10\/subscribe-form-module.png 695w, https:\/\/wpbeaveraddons.com\/wp-content\/uploads\/2016\/10\/subscribe-form-module-300x244.png 300w\" sizes=\"(max-width: 695px) 100vw, 695px\" \/><\/p>\n<p>&nbsp;<\/p>\n<p>That&#8217;s pretty easy, right? If you need help with anything or have any questions, then please feel free to drop a comment.<\/p>\n<p>You can explore all\u00a0the\u00a0<a href=\"https:\/\/wpbeaveraddons.com\/demo\/\">custom Beaver Builder modules<\/a> from PowerPack addon\u00a0and see how it can simplify your design and development process.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Beaver Builder offers an easy to use Subscribe Form module\u00a0that can be\u00a0used to build optin forms and connect with popular mailing services. The subscribe form has all the basic features but lacks some styling options. So, we built a few designs and are sharing the custom CSS code which you can re-use or modify as&hellip;<\/p>\n","protected":false},"author":1,"featured_media":8219,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"inline_featured_image":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"categories":[27,29],"tags":[],"class_list":["post-8212","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-beaver-builder","category-friday-freebies"],"acf":[],"_links":{"self":[{"href":"https:\/\/wpbeaveraddons.com\/wp-json\/wp\/v2\/posts\/8212"}],"collection":[{"href":"https:\/\/wpbeaveraddons.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wpbeaveraddons.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wpbeaveraddons.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wpbeaveraddons.com\/wp-json\/wp\/v2\/comments?post=8212"}],"version-history":[{"count":0,"href":"https:\/\/wpbeaveraddons.com\/wp-json\/wp\/v2\/posts\/8212\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wpbeaveraddons.com\/wp-json\/wp\/v2\/media\/8219"}],"wp:attachment":[{"href":"https:\/\/wpbeaveraddons.com\/wp-json\/wp\/v2\/media?parent=8212"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wpbeaveraddons.com\/wp-json\/wp\/v2\/categories?post=8212"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wpbeaveraddons.com\/wp-json\/wp\/v2\/tags?post=8212"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}