{"id":330,"date":"2016-07-24T16:24:40","date_gmt":"2016-07-24T14:24:40","guid":{"rendered":"https:\/\/www.nieuwsmarkt.nl\/?p=330"},"modified":"2017-10-01T09:09:58","modified_gmt":"2017-10-01T07:09:58","slug":"your-first-steps-in-beaver-builder-and-how-to-stay-tuned","status":"publish","type":"post","link":"https:\/\/www.nieuwsmarkt.nl\/nl\/blog\/2016\/07\/24\/your-first-steps-in-beaver-builder-and-how-to-stay-tuned\/","title":{"rendered":"Your first steps in Beaver Builder and how to stay tuned"},"content":{"rendered":"<p><strong>In the past few months the Beaver Builder community experienced an overwhelming amount of tools, tutorials and developments. Even trying to streamline it a bit is nearly impossible, because of the increasing amount of developers each wit their own ideas and roadmaps.<\/strong><!--more--><\/p>\n<p><em>\u2022\u00a0please use a laptop to have maximum comfort around demo examples<\/em><\/p>\n<p>In this article we would like to try to bring some structure in what is on the market right now. We won&#8217;t discuss the &#8216;free versus paid&#8217; debate. If you are in any commercial environment, all paid &#8216;stuff&#8217; will pay your expenses, since you can speed up your development time enormously.<\/p>\n<h3>Beaver Builder<\/h3>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-319 alignright\" src=\"https:\/\/www.nieuwsmarkt.nl\/wp-content\/uploads\/2016\/07\/beaver-builder-logo-150x150.jpg\" alt=\"beaver-builder-logo-150x150\" width=\"150\" height=\"150\" \/>Of course everything starts with Beaver Builder. Although a little hard to understand their <a href=\"https:\/\/www.wpbeaverbuilder.com\/pricing\/\" target=\"_blank\">productline<\/a> when you arrive in this &#8216;arena&#8217; for the first time.<\/p>\n<ul>\n<li>Standard (basicly &#8216;just&#8217; the plugin) $99<\/li>\n<li>Pro (the plugin and the theme and multisite enabled) $199<\/li>\n<li>Agency (al of the above and white label) $399<\/li>\n<\/ul>\n<p>If you want to try the free version of the plugin (with limited modules), you can <a href=\"https:\/\/wordpress.org\/plugins\/beaver-builder-lite-version\/\" target=\"_blank\">download<\/a> it from the WordPress\u00a0repository.<\/p>\n<p><iframe loading=\"lazy\" src=\"https:\/\/player.vimeo.com\/video\/122546221?title=0&amp;byline=0&amp;portrait=0\" width=\"800\" height=\"450\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe><\/p>\n<p><a href=\"https:\/\/vimeo.com\/122546221\">Beaver Builder Designers Video<\/a> from <a href=\"https:\/\/vimeo.com\/beaverbuilder\">Beaver Builder<\/a> on <a href=\"https:\/\/vimeo.com\">Vimeo<\/a>.<\/p>\n<h3>How to start<\/h3>\n<p>Just try thinking of a page\u00a0as a blank piece of paper, don&#8217;t think in sidebars anymore. Think in rows and columns. Every row can contain one or more columns blocks, in which one can place any kind of content by choosing modules. First build up your experience with the base of Beaver Builder plugin (free or paid) and after that start exploring modules from third party developers.<\/p>\n<h3>Moving object syndrome<\/h3>\n<p>Although many modules could move and jump around in any way you would like, please keep in mind that communicating with your target audience does not automatically improve by &#8216;moving objects&#8217;. Use it where it adds value to the way you need to communicate.<\/p>\n<p><iframe loading=\"lazy\" src=\"http:\/\/demo.wpbeaverbuilder.com\/?new\" width=\"1200\" height=\"1200\"><\/iframe><\/p>\n<h3>Addons<\/h3>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-312 alignleft\" src=\"https:\/\/www.nieuwsmarkt.nl\/wp-content\/uploads\/2016\/07\/beaver-builder-ultimate-add-ons-150x150.jpg\" alt=\"beaver-builder-ultimate-add-ons-150x150\" width=\"150\" height=\"150\" \/>Plugins and addons\u00a0have\u00a0(in many cases) the same technical structure. In other words addons install like plugins and need to be activated. Beaver Builder plugin (all versions) contain so called modules. They are all &#8216;wrapped&#8217; in the plugin and can be accessed through the user-interface of the Beaver Builder plugin, by clicking &#8216;Page Builder&#8217; from the top admin bar.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-320 alignright\" src=\"https:\/\/www.nieuwsmarkt.nl\/wp-content\/uploads\/2016\/07\/beaverlodge-logo-150x150.jpg\" alt=\"beaverlodge-logo-150x150\" width=\"150\" height=\"150\" \/>At the moment of writing there are three major\u00a0developers who developed various modules\u00a0which can be added (addons) within the Beaver Builder structure. Although we tried to convince these developers to make modules available as seperate plugins (keep it small, fast and you upload just what you need extra above Beaver Builder itself), only <a href=\"https:\/\/beaverlodgehq.com\/#pricing\" target=\"_blank\">BeaverLodgeHQ<\/a> seemed to listen to that need of the market, although that product (called &#8216;Basic&#8217;) is not available yet. The other productnames are &#8216;Ultimate&#8217; and &#8216;Premium&#8217;. Ultimate might be a bit confusing, because there is also a developer calling their addon plugin <a href=\"http:\/\/www.ultimatebeaver.com\/?bsf=63&amp;campaign=nieuwsmarkt\" target=\"_blank\">Ultimate Addons for Beaver Builder<\/a>.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignleft size-full wp-image-344\" src=\"https:\/\/www.nieuwsmarkt.nl\/wp-content\/uploads\/2016\/07\/beaveraddons-logo-150x150.jpg\" alt=\"beaveraddons-logo-150x150\" width=\"150\" height=\"150\" \/>So to summarize the three most &#8216;visible&#8217; addon &#8216;families&#8217;:<\/p>\n<ul>\n<li><a href=\"https:\/\/beaverlodgehq.com\/#pricing\" target=\"_blank\">BeaverLodgeHQ<\/a><\/li>\n<li><a href=\"http:\/\/www.ultimatebeaver.com\/?bsf=63&amp;campaign=nieuwsmarkt\" target=\"_blank\">Ultimate Addons for Beaver Builder<\/a><\/li>\n<li><a href=\"https:\/\/wpbeaveraddons.com\/\" target=\"_blank\">PowerPack form beaver Addons<\/a><\/li>\n<\/ul>\n<p>&nbsp;<\/p>\n<h3>Demos<\/h3>\n<p><em>BeaverLodgeHQ is a small start-up company. Very innovative solution(s) and willing to play a role in making a stable BB eco-system with seperate plugins compared to the bundled versions of the others. As a start-up\u00a0BeaverLodgeHQ had some capacity challenges.<\/em><\/p>\n<p><iframe loading=\"lazy\" src=\"http:\/\/demo.beaverlodgehq.com\/\" width=\"1200\" height=\"1200\"><\/iframe><\/p>\n<p><em>The PowerPack team\u00a0is a growing company with about 4-5 employees and stepping into the BB market with ambitions. Great contributors to the community. Their focus is (also) to please individual requests, which makes the development roadmap a little less strategic.<\/em><\/p>\n<p><iframe loading=\"lazy\" src=\"https:\/\/wpbeaveraddons.com\/demo\/\" width=\"1200\" height=\"1200\"><\/iframe><\/p>\n<p><em>UABB comes from the developers of the add-ons for Visual Composer. That experience\u00a0had brought them to a stable development cycle for Beaver Builder as well. Company size is about 40 employees and also serves a great community base.<\/em><\/p>\n<p><iframe loading=\"lazy\" src=\"http:\/\/next.brainstormforce.com\/modules\/\" width=\"1200\" height=\"1200\"><\/iframe><\/p>\n<p>Maybe less well known but potentionally interesting developments from:<\/p>\n<ul>\n<ul>\n<li><a href=\"https:\/\/j7digital.com\/plugins-downloads\/\" target=\"_blank\">J7 Digital<\/a>\u00a0(seperate plugins)<\/li>\n<li><a href=\"http:\/\/briancoords.com\/free-beaver-builder-custom-modules\/\" target=\"_blank\">CB Custom Modules<\/a> from Brian Coords<\/li>\n<\/ul>\n<\/ul>\n<p>Choosing one of those is kind of &#8216;learning by doing&#8217;. Most of the offer a good demo-environment, so that you can decide what you need.<\/p>\n<h3>Do you need all of them at once?<\/h3>\n<p>No, there are different roadmaps possible, which will fill all possible needs within the Beaver Builder structure. It is even possible to add addons to the free version of the Beaver Builder Plugin. If you are not yet very experienced in using the Beaver Builder plugin, wait a while and start building your first couple of websites first. Once you learn the modules you might discover what you would like to add in either creativ modules or specific application modules. Look carefully at the various pricing packages before buying one. If you are sure about using some modules from one of the above developers for various commercial projects, you might consider buying one of the &#8216;lifetime&#8217; packages.<\/p>\n<h3>Structure<\/h3>\n<p>As we alreay mentioned, at this moment it is not easy to define one structure in using modules. With 3 developers at this moment of writing it is &#8216;kind of OK&#8217;. However choosing modules is still kind of unstructured and basically just one column of all modules under each other, &#8216;overlapping&#8217;\u00a0a part of the righ-hand side\u00a0of the page you are working in. We would prefer using the standard WordPress admin bar for selecting modules in a more hierarchical way.<\/p>\n<p>You can switch on\/of modules in the main Beaver Builder settings which could eliminate the &#8216;kind of unstructured&#8217; way of displaying modules.<\/p>\n<h3>Templates, rows, modules<\/h3>\n<p>Besides addons there are a growing number of plugins which also add functionallity to Beaver Builder, but not as integrated modules. Some are to be used with the plugin, other are to be used with the Beaver Builder theme (Pro package from Beaver Builder).<\/p>\n<p>Another important component of the Beaver Builder structure are so called &#8216;templates&#8217;. Beaver Builder comes with a set of wide range creative templates, which can used directly in your webdesign. But added to that feature is the possibility to save your own created design (either a complete page design or any combination of row(s)\/module(s) into a template). The templates can be exported to any other Beaver Build based websites for further use. To use this feature switch on &#8216;templates&#8217; in &#8216;Settings&#8217; &gt; &#8216;Page Builder&#8217; &gt; &#8216;Templates&#8217;.<\/p>\n<p>You can save complete templates, seperate rows or sperate modules. But in the Beaver Builder system they are all stored in the dashboard under the &#8216;button&#8217; &#8216;Templates&#8217;.<\/p>\n<h3>Conditionals<\/h3>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignleft size-full wp-image-347\" src=\"https:\/\/www.nieuwsmarkt.nl\/wp-content\/uploads\/2016\/07\/beaver-tunnels-logo-150x150.jpg\" alt=\"beaver-tunnels-logo-150x150\" width=\"150\" height=\"150\" \/>One special feature has been devloped by <a href=\"https:\/\/beavertunnels.com\/\" target=\"_blank\">Beaver Tunnels<\/a>. Webdevelopers who know about hooks (actions, filters) know the importance of being able to conditionally &#8216;do something&#8217; in this case placing content on any location\u00a0on the page.<\/p>\n<p>With Beaver Tunnels you can determine the placement of any template\/row\/module by selecting the page(s), post(s), template(s), taxonomies or user status.<\/p>\n<p>This is a very powerful feature, especially for those used to Genesis and possibly the Genesis\/Dynamik combination.<\/p>\n<p><iframe loading=\"lazy\" src=\"https:\/\/www.youtube.com\/embed\/loHulIlorsk?rel=0&amp;showinfo=0\" width=\"800\" height=\"450\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe><\/p>\n<h3>Kind of &#8216;in between&#8217;<\/h3>\n<p>There are still many things on various wishlists. It is impossible to describe them all, but some of them are worth mentioning, since specific wishes have (until now) been developed via some plugins. It is however possible that these requests will be build in next version of the BEaver Builder core.<\/p>\n<p>The first plugin we like to mention is\u00a0<a href=\"https:\/\/j7digital.com\/downloads\/bbplugin-header-footer-templates\/\" target=\"_blank\">BBPlugin &#8211; Header Footer Templates<\/a> from J7 Digital. That plugin extends the Customizer of the Beaver Builder theme. The Beaver Builder plugin normally is &#8216;just&#8217; a pagebuilder, so basically it does not do anything with the header and the footer.<\/p>\n<p>This plugin gives the possibility to use templates &#8216;around&#8217; the header and the footer through the use of hooks. Another tab &#8216;Header Footer Templates&#8217; will be added to the customizer. For the\u00a0header any template can be placed at the following hooks:<\/p>\n<ul>\n<ul>\n<ul>\n<li>Before Top Bar<\/li>\n<li>Before Header<\/li>\n<li>Before Content<\/li>\n<\/ul>\n<\/ul>\n<\/ul>\n<p>For the footer the following hookable locations:<\/p>\n<ul>\n<ul>\n<li>New Footer Above the Default<\/li>\n<li>New Footer Below\u00a0the Default<\/li>\n<li>Nested just Above Default Footer<\/li>\n<li>Nested just Below\u00a0Default Footer<\/li>\n<\/ul>\n<\/ul>\n<p><iframe loading=\"lazy\" src=\"https:\/\/www.youtube.com\/embed\/smbrePxuh0c?rel=0&amp;showinfo=0\" width=\"800\" height=\"450\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe><\/p>\n<h3>The rest<\/h3>\n<p>Well, there is so much more and even so much more to come. We conclude this first overview wit a couple of possible interesting developments:<\/p>\n<ul>\n<li><a href=\"http:\/\/beaverbrewer.com\/\" target=\"_blank\">Beaver Brewer<\/a><\/li>\n<li>Beaver Builder Skin (possibly discontinued, was developed by <a href=\"http:\/\/www.mapsteps.com\/\" target=\"_blank\">Mapsteps<\/a>)<\/li>\n<li><a href=\"http:\/\/www.mapsteps.com\/downloads\/beaver-builder-peek-a-boo\/\" target=\"_blank\">Beaver Builder Peek-a-Boo!<\/a><\/li>\n<li><a href=\"https:\/\/github.com\/thierrypigot\/beaver-builder-toolbox\" target=\"_blank\">Beaver Builder Toolbox<\/a> from\u00a0Thierry Pigot<\/li>\n<li><a href=\"https:\/\/www.beaverplugins.com\/plugins\/rowstyles\/\" target=\"_blank\">Row Styles plugin<\/a> from Beaverplugins<\/li>\n<\/ul>\n<h3>Resources<\/h3>\n<p>In the mean time a lot of wonderful resources, tutorials and video have been made by:<\/p>\n<ul>\n<li><a href=\"https:\/\/davidwaumsley.com\/blog\/\" target=\"_blank\">David Waumsley<\/a><\/li>\n<li><a href=\"http:\/\/dynamikbeaver.com\/\" target=\"_blank\"><span class=\"highlightNode\">Colin<\/span> Cartwright<\/a><\/li>\n<li>Adam Preiser (mostly found in facebook groups)<\/li>\n<li><a href=\"https:\/\/www.youtube.com\/channel\/UCnWMxlk4L9JNsq2xl7-zdwQ\" target=\"_blank\">Robert Turner<\/a><\/li>\n<\/ul>\n<p>Check out the following facebook groups:<\/p>\n<ul>\n<li><a href=\"https:\/\/www.facebook.com\/groups\/beaverbuilders\/\" target=\"_blank\">BeaverBuilder<\/a><\/li>\n<li><a href=\"https:\/\/www.facebook.com\/groups\/beaveraddons\/\" target=\"_blank\">PowerPack BeaverAddons<\/a><\/li>\n<li><a href=\"https:\/\/www.facebook.com\/groups\/beaverlodgehq\/\" target=\"_blank\">BeaverLodgeHQ<\/a><\/li>\n<li><a href=\"https:\/\/www.facebook.com\/groups\/1229431503736174\/\" target=\"_blank\">Ultimate Addons for BeaverBuilder<\/a><\/li>\n<\/ul>\n<p>In case you think we forgot something, please <a href=\"mailto:peter@luit.nl\">e-mail<\/a> us and we will add your resource to this blogpost.<\/p>","protected":false},"excerpt":{"rendered":"<p>In the past few months the Beaver Builder community experienced an overwhelming amount of tools, tutorials and developments. Even trying to streamline it a bit is nearly impossible, because of the increasing amount of developers each wit their own ideas and roadmaps.<\/p>","protected":false},"author":2,"featured_media":319,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[4],"tags":[18,11,20,15,19,14,13],"class_list":["post-330","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-review","tag-addon","tag-beaver-builder","tag-conditionals","tag-modules","tag-plugin","tag-rows","tag-templates"],"_links":{"self":[{"href":"https:\/\/www.nieuwsmarkt.nl\/nl\/wp-json\/wp\/v2\/posts\/330","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.nieuwsmarkt.nl\/nl\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.nieuwsmarkt.nl\/nl\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.nieuwsmarkt.nl\/nl\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.nieuwsmarkt.nl\/nl\/wp-json\/wp\/v2\/comments?post=330"}],"version-history":[{"count":3,"href":"https:\/\/www.nieuwsmarkt.nl\/nl\/wp-json\/wp\/v2\/posts\/330\/revisions"}],"predecessor-version":[{"id":379,"href":"https:\/\/www.nieuwsmarkt.nl\/nl\/wp-json\/wp\/v2\/posts\/330\/revisions\/379"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.nieuwsmarkt.nl\/nl\/wp-json\/wp\/v2\/media\/319"}],"wp:attachment":[{"href":"https:\/\/www.nieuwsmarkt.nl\/nl\/wp-json\/wp\/v2\/media?parent=330"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.nieuwsmarkt.nl\/nl\/wp-json\/wp\/v2\/categories?post=330"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.nieuwsmarkt.nl\/nl\/wp-json\/wp\/v2\/tags?post=330"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}