Aligning the last element in a Beaver Builder Posts Module
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…
Change WooCommerce Checkout Page To A 2-Column Layout
The default WooCommerce checkout page layout doesn’t make great use of a 2nd right hand column and looks a bit disjointed. Here is some CSS that can push the product order data to the 2nd column balancing the layout more…
Add full screen window canvas to back to icons when searching in Beaver Builder
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…
Make a whole container a clickable link in Bricks Builder
To add a link to a whole container element in a Bricks Builder layout you need to use some jQuery to add the link tag markup to make the whole container clickable. There needs to be 1 link already within…
A look at various types of CSS selectors and differences between them.
CSS styling can get very specific and you can target less classes and IDs in the HTML markup, and instead target cascading HTML elements – here we take a look at the various CSS Selectors, and give some simple examples…
Avoid Blank Square FontAwesome 5 Icons when used as CSS Pseudo Elements
Are your FontAwesome 5 icons appearing as blank squares “□ □ □ □” ? Are the icons displaying on Desktop ok but not displaying on iOS Mobile Safari iPhones or iPads? – you need to tighten up your CSS rules…
An Introductory Guide for starting out with SASS for CSS
SASS and LESS are two similar tools for writing out CSS code that is sort of pre-CSS code with variables – that is then converted to good ole regular CSS code.Why you would want to use them really depends on your workflow, for…
Up and running with installing Sass on macOS
Up and running with installing Sass on macOS Big Sur or earlier OSX Sass (Syntactically Awesome Stylesheets) is a CSS pre-processor tool in which you write your CSS code using variables, selector inheritance, mixins, and nestings and and then compile…
Add a CSS class on a current active menu item
With manual menus you may need to add a CSS class to the current menu item that is active, below is a jQuery solution, that utilizes the URL of the page to match the link and add the CSS. (function($){…
Show All Loaded Scripts and Styles on a Page in WordPress
To show all loaded scripts and styles on a page in WordPress you can use a foreach loop and show the name of the script as referred to as a $handle add_action( ‘wp_print_scripts’, ‘prefix_show_me_the_scripts’ ); /** * Show what Scripts and…
