Add a lightbox popup to a jQuery lightslider carousel
Adding a lightbox pop up to a lightslider slider/carousel can be achieved by adding a script such as magnificPopup to a lightslider callback once the slider has loaded. The callback name is onSliderLoad which is fired when the slider is loaded. Make sure you have the magnificPopup script loaded, it’s a very popular lightbox and…
Read MoreRemove FOUC on Lightslider jQuery Carousel
When more than one slide is used on a lightslider slider/carousel, the slide images are initially loaded underneath each other and jump into place which causes the layout to jump around which is known as a flash of unstyled content or FOUC. There is a CSS class name that already ships with the lightslider CSS…
Read MoreHow to Add Web Fonts to Beaver Builder Plugin and Theme
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 this you need to enqueue the fonts so the plugin can recognise them which you…
Read MoreSet a Minimum Subscription Period in WooCommerce Subscriptions
WooCommerce Subscriptions currently doesn’t allow a minimum subscription time period when setting up a subscription, nut you can manipulate the WooCommerce Subscription Sign-up fee and free trial fields to allow you to do so. Let’s say you want a minimum 3 month sign up period which then defaults to monthly after the 3 months is…
Read MoreFilter the Additional Information Placeholder Text field in WooCommerce
You can filter the Additional Information placeholder text field in WooCommerce checkout page with the woocommerce_checkout_fields filter. Use it in functions.php like so… add_filter( ‘woocommerce_checkout_fields’ , ‘wpb_custom_additional_info’ ); // Change placeholder text in Additional Notes function wpb_custom_additional_info( $fields ) { $fields[‘order’][‘order_comments’][‘placeholder’] = ‘Add a Shipping address here if different from Billing Address, or any additional…
Read MoreAdd Extra Tabs on WooCommerce Products
WooCommerce allows you to add extra tabs on a product page alongside description, reviews and additional information with the filter, woocommerce_product_tabs. Let’s say you wanted 2 extra tabs – ‘Ingredients’ and ‘How To Use’ as the heading, you can use the filter woocommerce_product_tabs like so… add_filter( ‘woocommerce_product_tabs’, ‘woo_new_product_tab’ ); /** * Add 2 custom product…
Read MoreAdd Navigation Arrows in WooCommerce Product Gallery Slider
You can add Navigation Arrows in WooCommerce Product Gallery by adding a filter and then some CSS. WooCommerce uses a slider called Flexslider and it has a few more configurable options. In functions.php add add_filter( ‘woocommerce_single_product_carousel_options’, ‘sf_update_woo_flexslider_options’ ); /** * Filer WooCommerce Flexslider options – Add Navigation Arrows */ function sf_update_woo_flexslider_options( $options ) { $options[‘directionNav’]…
Read MoreAdd Search & Filter Pro with Ajax Reload to Beaver Builder Post Masonry Grid
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 uses the main query with a masonry layout. Create your Posts Module CPT Archive Page…
Read MoreTemporarily Turn off Modsec filtering
You can temporarily turn off Modsec filtering by adding a code snippet rule to your .htacces file, this can be helpful if you are triggering a number of rules which are false positives or you are unable to get the rules whitelisted whilst you do your development. Add into .htaccess <IfModule mod_security.c> SecFilterEngine Off SecFilterScanPOST…
Read MoreConditional Check if Custom Post Type Posts Are Published
You can check on the existence of published Custom Post Types by using a new WP_Query loop with an if/else statement, as the CPT is already registered it is difficult to use a conditional check without checking the loop of posts. add_filter(‘wp_nav_menu_primary-menu_items’, ‘wpb_add_menu_item’, 10, 2); // Add to primary menu based on CPT existence function…
Read More