Thomas Barregren

This WordPress plugin extends the functionality of both the <a href="https://wordpress.org/plugins/beaver-builder-lite-version/" rel="ugc">free</a> and the <a href="https://www.wpbeaverbuilder.com/" rel="nofollow ugc">paid</a> versions of the Beaver Builder Page Builder.
<h4>How to use the plugin</h4>
To illustrate how the plugin works, let’s suppose that you shall create a row with a message and a button. The row should be visible to each new visitor until she presses the button. When the visitor presses the button, the row will be closed smoothly. The row shall then remain hidden for that particular visitor for a period of time. When the time period is over, the message will be displayed again to the visitor.
Start by creating the row with as you usually do in Beaver Builder’s Page Builder. Add two columns. Put a Text module with the message in the column to the left. Put a Button module in the column to the right. Enter <code>javascript:void(0)</code> as link in the settings of the button; this prevents the button from doing anything at all.
Next, open the settings page of the row, click on the Advanced tab and scroll down to the Visibility section. Click on the drop-down menu Display. Provided you have installed this plugin, you should now see an option named <code>Row has not been closed</code>. It means te row will be visible if it has not been closed. Choose that option.
Below the Display drop-down should more settings appear now appear. Fill them out as follows:
<ul>
<li>Closing trigger selector: Enter a <a href="https://www.w3schools.com/jquery/jquery_ref_selectors.asp" rel="nofollow ugc">JQuery selector</a> (or a <a href="https://www.w3schools.com/cssref/css_selectors.asp" rel="nofollow ugc">CSS selector</a>) that targets the button. To assist you, this plugin adds the class <code>.closing-row</code> the row, so it is easier to target elements in the row. For this example, <code>.closing-row .fl_button</code> will do.</li>
<li>Close time: Enter the number of milliseconds the closing animation should take. For a short row, you should probably choose a relative small number, e.g. <code>500</code>. For a tall row, you should consider to increase the number to get a smooth transition.</li>
<li>Cookie expiration: Enter the number of days you want the message to be hidden. Enter <code>0</code> to just hide it during the current session. to hide it “for ever”, enter a big number, e.g. <code>36525</code> that corresponds to 100 years.</li>
<li>Cookie domain: Enter the domain of your site. If the home page of your site has the address <code>https://www.example.com/</code>, then enter <code>www.example.com</code>. If you enter <code>.example.com</code> (with a dot at the beginning), you allow all subdomains (e.g. <code>dev.example.com</code>). You can also leave the field completely blank, which all common browsers interpret as the same domain as the visitor are visiting.</li>
</ul>
Finally, save the row and publish the layout.
<h4>Technical description</h4>
This plugin prevents Beaver Builder’s page builder to render a row that has the visibility set to <code>Row has not been closed</code> if the visitors browser are returning a previous set cookie named <code>row_5967cca712431_closed</code> with <code>5967cca712431</code> replaced with the node id of the row.
If rendered, the row is initially hidden by the CSS property <code>display</code> set to <code>none</code>. This property will be changed to display the row if the cookie is not set. This last check is carried out by JavaScript.
The reason for this two-step check is caching.
<h3>Credits</h3>
The plugin uses Scott Hamper’s JavaScript library <a href="https://github.com/ScottHamper/Cookies" rel="nofollow ugc">Cookies</a>.

Kntnt's Row Closer for Beaver Builder Page Builder

WordPress plugin that allows a row in a layout created with Beaver Builder's Page Builder to be visible for a visitor until she clicks on a confi …

WebMan Design | Oliver Juhas

<blockquote>
Before you rate/review the plugin:
Please note that the plugin was created for WordPress theme developers. If you are a normal, non-tech-savvy WordPress user, this plugin will be disappointing for you and you don’t need to install it as it was created for different purpose.
If you are a theme developer and experience any issue with the plugin, please submit a support ticket.
</blockquote>
WebMan Amplifier is WordPress plugin that provides pack of features for theme developers. The plugin was build to help with, and simplify the WordPress theme development process.
This plugin was created primarily for <a href="https://www.webmandesign.eu/" rel="nofollow ugc">WebMan Design themes</a>, but it works with any other theme as well if you declare a support for it in the theme’s code.
<h4>Features</h4>
<ul>
<li>Well thought shortcodes with simple and fast Shortcode Generator and integration with <a href="https://wordpress.org/plugins/beaver-builder-lite-version/" rel="ugc">Beaver Builder</a> page builder (with support for <a href="https://wpml.org" rel="nofollow ugc">WPML</a> multilingual plugin)</li>
<li>Custom post types: 
• Projects – to create your own portfolios 
• Testimonials – to manage your customers or partners testimonies 
• Staff – to manage your team members 
• Content Modules – to create an icon boxes, services boxes or a content injection anywhere on your website 
• Logos – to manage your clients and/or partners logos list</li>
<li>Custom widgets 
• Contact – to display your contact information 
• Submenu – to display a subpages of the current page 
• Tabbed Widgets – to display any widgets in tabbed interface 
• Posts – to list posts or portfolio projects 
• Content Module – to display any Content Module post</li>
<li>Metabox generator</li>
<li>Fontello.com icon font uploader and simple integration</li>
</ul>
<h4>Additional Resources</h4>
<ul>
<li><a href="https://wordpress.org/support/plugin/webman-amplifier/" rel="ugc">Have a question?</a></li>
<li><a href="https://profiles.wordpress.org/webmandesign/#content-themes" rel="nofollow ugc">Grab a free theme</a></li>
<li><a href="https://www.webmandesign.eu" rel="nofollow ugc">Visit WebMan Design</a></li>
</ul>
<h4>Isotope Licensing</h4>
Please note that the plugin integrates an Isotope JavaScript filter. This script is released under GPL v3 license for non-commercial use. If you intend to use the plugin for commercial purpose, please purchase the <a href="http://isotope.metafizzy.co/license.html" rel="nofollow ugc">Isotope license</a>.

WebMan Amplifier

Amplifies functionality of WP themes. Provides custom post types, shortcodes, metaboxes, icons. Theme developer's best friend!

Kntnt's Row Closer for Beaver Builder Page Builder vs WebMan Amplifier