Styling WooCommerce Default DropDown Sort Select Field
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 MoreStyling Beaver Builder Buttons Globally using a CSS Snippet
Styling buttons in Beaver Builder can be quite a lengthy and tedious task and if a change has to be done over many pages the task becomes more onerous. The Builder Module UI covers most aspects of the style but is missing elements such as borders and shadows and the RGBA color model for colors.…
Read MoreAdd The Title Attribute To Featured Image in WordPress
The title attribute for the WordPress featured post has been removed for a while, but you can get it back with the wp_get_attachment_image_attributes filter which can add the HTML attribute markup back in, add to your functions.php file… add_filter( ‘wp_get_attachment_image_attributes’, ‘tl_add_img_title’, 10, 2 ); // Add title attribute to featured image function tl_add_img_title( $attr, $attachment…
Read MoreImage Carousel Thumbnail Slider with ACF Gallery Field in WordPress
Here is a guide on how to make an image carousel thumbnail slider with ACF in WordPress using the ACF gallery field. Lightslider, a lightweight image slider seems to fit the bill perfectly – I need it to just display simple thumbnails below the main image which on click/touch show the image in the main slide…
Read MoreAdd Lets Encrypt SSL Certs on ServerPilot Free Plan
ServerPilots‘ free plan does not offer SSL certs from Lets Encrypt, it is only available on the paid plans, here is a guide below that can allow you to install and renew the SSL certs with a custom script. You need to be comfortable in the command line and be aware that ServerPilot will not…
Read MoreNo Header Footer Genesis Template
Below is the code to create a Genesis template with no default header or footer elements, perfect to slot in to a page builder page. Add it in your child theme and add any other CPT names in the Template Post Type line, the option to choose it will be under the Page attributes meta…
Read MoreCustomize WooCommerce Product Search Field
The WooCommerce Product Search field can be added via a widget and also via a template tag… get_product_search_form() Another option is a filter get_product_search_form() by which you can create your own custom search field including using an icon. The Original Markup View the code on Gist. This will just reproduce the form in it’s original…
Read MoreSkip Cart Go Straight to Checkout Page in WooCommerce
WooCommerce workflow can be a little too long for simple products, 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 themeprefix_add_to_cart_redirect() { global $woocommerce; $checkout_url = wc_get_checkout_url();…
Read MoreMake the Top Bar Sticky in Beaver Builder Theme
Beaver Builder Theme has the option to make sticky the page header which shrinks after a little scroll and sticks to the head of the page, but this does not apply to the ‘page top bar’ if used which just scrolls in the viewport. Here is a CSS snippet to make the top page…
Read MoreSetting up a WordPress VVV2 Vagrant Workflow
Using VVV2 Vagrant as a WordPress local development workflow is a great flexible platform, here’s mine which uses 3 bits of software, (plus 2 as options) to create a vagrant box. VirtualBox, Vagrant, VVV, VVV Dashboard (optional) and VVV Base (optional, but very worth it IMO). Each of these bits build on the other and…
Read More