Styling WooCommerce Default DropDown Sort Select Fields
The default dropdown select field form element is difficult to style in CSS alone – it needs a bit of jQuery love, here is a guide to add some cleaner styling to the WooCommerces default dropdown sort select field – which you can apply to any select field too. Then one with some jQuery…
Read MoreShow related posts in Beaver Builder from one CPT to another with ACF Relationships
Showing related posts in Beaver Builder from one Custom Post Type to another is possible with an ACF Relationship field and Beaver Themers Post Module and relationship field connector from version 1.1.1. You can also use the Post Slider and Post Carousel Modules. This tutorial uses 2 CPTs, ‘Lights’ and ‘Projects’, the intent is to…
Read MoreAdding a loading icon spinner on Search & Filter Pro Archive Page
Search & Filter Pro is a great WordPress filter tool, here is a guide to add a loading icon animation whilst the page is ajax refreshed when the user has selected a filter request and is waiting for the page to load the new results. The plugin author has made 2 event callbacks where you…
Read MoreShow related posts from one CPT to another with ACF Relationships
Showing related posts from one Custom Post Type to another is possible with an ACF Relationship field. This tutorial uses 2 CPTs, ‘Lights’ and ‘Projects’, the intent is to show the ‘Lights’ used in each ‘Project’ so the reader can click the link back to see the light from a project CPT. (This is also…
Read MoreChange and Update WordPress URLS in Database When Site is Moved to new Host
After migrating a WordPress site to a new URL either to a live production site or a testing development server, the new URL strings in the MySQL database need to be changed and updated in the various MySQL database tables. This method just uses the whole MySQL database rather than a WordPress export/import from within and…
Read MoreAdding Multiple Fading Images To A Background with jQuery
You can add multiple sliding/fading images to a background HTML element using the Backstretch jQuery plugin, this is great if you just want to alternate a number of images behind another web page element similar to a slider but without the overhead of using a slider plugin. Image Preparation Generally you’ll want to optimize your…
Read MoreAdding a Sticky Footer to Beaver Builder Theme with CSS
A sticky footer refers to a web page footer that sticks to the foot of the page even when there is not a lot of content on the page, without one the footer will ride up leaving the layout somewhat unsightly. There are various methods to add a sticky footer, some javascript and others CSS, you…
Read MoreHide WooCommerce Product Categories on Shop Page or other Page
You can hide certain WooCommerce product categories from the shop page or other targetted pages, by using an action called woocommerce_product_query Add it in your theme via functions.php and it works like so… So the action is wrapped in a conditional statement that targets the pages you want the Product Categories to not display. Then…
Read MoreInstalling WordPress wp-cli on macOS
Installing wp-cli on macOS – WordPress has a command line tool which operates similar to what Drush does for Drupal, it is called wp-cli and runs on macOS/Linux operating systems with a minimum of PHP 5.3.2 or later and WordPress 3.5.2 or later. Install wp-cli on macOS curl -O https://raw.githubusercontent.com/wp-cli/builds/gh-pages/phar/wp-cli.phar Verify Install neilg@[~]: php wp-cli.phar –info PHP binary: /usr/bin/php PHP…
Read MoreAdd Taxonomy Terms as CSS Classes to a Post
You can use the body_class filter in WordPress to add the Taxonomy Terms of a Custom Taxonomy as CSS classes to a post. The CSS class appears in the body element and is only used if the post has been assigned to the taxonomy. The code goes in your functions.php file. add_filter( ‘body_class’, ‘themeprefix_add_taxonomy_class’…
Read More