Position WooCommerce Checkout Spinning Icon On Page
WooCommerce checkout page uses a spinning loader icon while the page goes through a series of ajax refreshes throughout the checkout process. The spinning icon is a visual clue to the user to wait until it stops spinning that the page is updated and ready for the next step, however some WordPress themes may not…
Read MoreHide WordPress Admin Toolbar Based On User Role
You can hide the WordPress admin toolbar to logged in users based on their user role and capabilities. First of all you can hide the toolbar on all front end pages from all users by adding to your functions.php add_filter( ‘show_admin_bar’, ‘__return_false’ ); Lets say you wanted regular subscriber users not to see the toolbar when…
Read MoreWooCommerce Skip Cart, Go Straight to Checkout Page
WooCommerce workflow can be a little too long for simple products, you can provide a better user experience, here’s how to get the product to skip past the cart page and go straight to the checkout page. First, uncheck the cart options in WooCommerce Settings -> Products. Then add in your functions.php add_filter(‘woocommerce_add_to_cart_redirect’, ‘themeprefix_add_to_cart_redirect’); function…
Read MoreRemove Meta Boxes in Genesis Theme Settings
You can remove the metaboxes that appear in the Genesis theme settings in the WordPress dasgboard – this may help when you want an end user not to use or change certain theme settings. In this Gist are the main ones just include the ones that you need to remove – any settings that have…
Read MoreCoding a User Friendly Carousel Slider in WordPress
This tutorial uses Slick and Advanced Custom Fields Pro to code a user friendly carousel slider in WordPress. It uses the gallery field from which a user can easily add or change order of slides without having to touch the code. The example slider in this tutorial will use the Multiple Items Layout in Slick. Getting Slick in…
Read MoreCreate Equal Heights for Text Columns in a Row
To create equal heights for text columns in a row depending on data entered can be a CSS challenge, instead of futzing with CSS and height rules at different media queries there is a nice jQuery solution that automagically solves the layout aptly called… matchHeight. So in the above I am using custom post types with custom fields,…
Read MoreCoding a Slider with Slick and ACF Pro in WordPress
Slick is a nifty jquery plugin that makes spiffy (yes I said spiffy) sliders, combined with Advanced Custom Fields Pro gallery field you can make an easy to use client interface to allow them to add images to a slider on a post/page or custom post type. The example slider in this tutorial will use…
Read MoreUsing Slidebars to Slide In and Out Content in A Genesis Theme
Having some content slide out from the side of a page is a great solution for off canvas content, it can solve crowded page issues especially at smaller sizes as it can slide in content that takes prominence, do what it needs to do for the user and then slide out again, Slidebars is a jQuery plugin solution that…
Read MoreUp and running with Sidr Off Canvas Menu for WordPress
Sidr is a very popular jQuery off canvas menu that can slide content from the left or right into the viewport which is a great solution for mobile or tablet display. Here’s how to get it up and running in WordPress. First up is to download the latest zip which contains a minified jQuery file and…
Read MoreRemove Default Sort in WooCommerce and ‘Showing All Results’ Notice
In an e-commerce environment using WooCommerce when there is only a few products to sell, it is cleaner and more intuitive to rid the space of some clutter – such as the ‘Default Sorting‘ options dropdown and the display notice ‘Showing all x results‘. Add this code in your themes functions.php file and you will have…
Read More