Add a WooCommerce missing action hook with shortcode in Beaver Builder

Add Shortcode Hook Woocommerce

Some themes or plugins remove native action hooks in WordPress / WooCommerce, however you can add them back in the layout with another action hook or shortcode insertion.Beaver Builder is missing some WooCommerce action hooks one such one is woocommerce_before_shop_loop_item_title…

Aligning the last element in a Beaver Builder Posts Module

Beaver Builder Align Buttons

Here is how to align the last element across multiple columns in Beaver Builder Posts Module with Flexbox – this would typically be a button or a read more link.In the Posts Module ensure Equal Heights is enabled as this…

Add full screen window canvas to back to icons when searching in Beaver Builder

Beaver Builder Full Icon Canvas

In a recent Beaver Builder update the canvas size for an icon search was humbly shrunk as some users didn’t like the vast open lands of icon city.With a bit of CSS code injected into the backend, the icon canvas…

Adding Bootstraps Collapse to a Beaver Builder button and module

Bootstrap Collapse Beaver Builder

If you have the Beaver Theme as your WordPress theme, here is how you can add Bootstraps Collapse effect to a Beaver Builder row or module can be achieved using the Bootstrap data-toggle and data-target attribute.You need to have the…

Adding jQuery Slide Toggle to a Beaver Builder button and module

Jquery Slide Toggle Beaver Builder

Adding a jQuery Slide Toggle effect to a Beaver Builder row or module can be achieved with some Javascript and CSS. Let’s say you have a button which when clicked reveals a module below it and another click hides the…

Equal Heights after Search & FIlter Pro Ajax Refresh

Equal Heights Ajax Refresh Search Filter Pro

Using Search & Filter Pro with a grid of items that have equal heights set may loose their equal heights after a S&F filter on the same page Ajax refresh. You can pass in some jQuey to Search & Filter…

How to Add Web Fonts to Beaver Builder Plugin and Theme

Add Web Fonts Beaver Builder

You can add other fonts to Beaver Builder Plugin modules such as the heading module etc by first enqueuing the fonts and then using a filter to add them for the font selection of the plugin modules. Before you do…

Add Search & Filter Pro with Ajax Reload to Beaver Builder Post Masonry Grid

Masonry Ajax Beaver Builder Reload

You can use Search and Filter Pro with Beaver Builders Themer Post Module grid masonry layout with Ajax reload. This guide goes through the tweaks needed and uses a custom post type archive page with a Post Grid module that…

Create a content flyout overlay in Beaver Themer Layout Header

Overlay Flyout Beaver Builder

This is a starter guide to get you up and running with an overlay flyout on click of hidden content in Beaver Builder – there is nothing indeed Beaver Builder specific about it other than it’s easy to build the…

Output Beaver Builder CPT Posts in a Module that belong to a Custom Taxonomy

Beaver Builder Custom Taxonomy

Using Beaver Builder loop modules to output posts can be limited when you want to output a CPT that belongs to multiple custom Taxonomies but you only want posts to display from one taxonomy – this can be achieved in…