Filtering Posts with Custom Fields Using meta_query
You can further refine a list of posts by filtering any custom fields that the post has for a certain set of conditions, this is possible with WP_Meta_Query, which allows you to target custom fields as known as post meta. There are a couple of ways to use the WP_Meta Query class, the meta_query array is…
Read MoreChange Number of Posts Displaying on CPT Archive Page
To change the number of posts that appear in an archive page for a custom post type you can change the number using the pre_get_posts action. Normally the number of posts displayed per page is defaulted to the setting in the Dashboard Reading Settings > Blog pages show at most – you may want regular posts…
Read MoreFilter Custom Post Types by Taxonomy in WP Admin Dashbaord
Filter CPTs by a linked custom Taxonomy in the WP Admin Dashboard is possible with restrict_manage_posts. In the screenshot there is a CPT list of posts, with a dropdown menu of a linked custom taxonomy terms which are filterable via the filter button next to it. The code goes in functions.php View the code on…
Read MoreAdd Event Categories as CSS classes to Event Posts in Modern Tribe
Event Categories are not added as CSS classes to individual Event Posts in Modern Tribes Event Plugin for WordPress however you can use the body_class filter to add them in. add_filter( ‘body_class’, ‘cp_event_taxonomy_in_body_class’ ); // https://theeventscalendar.com/support/forums/topic/add-category-name-as-body_class/ // Add event categories terms to body class of event posts function cp_event_taxonomy_in_body_class( $classes ){ global $wp_query; $event_id =…
Read MoreChanging the Modern Tribe Events Date Format
This is some code borrowed and extended on to change the Modern Tribes Event plugins date output format to make it a bit easier on the eye than the default output. View the code on Gist. It is a shortcode [all_the_single_dates] that outputs the dates like so …. 09 – 14 September 2018 28 October…
Read MoreAdd Search & Filter Pro to Beaver Themer Post Module CPT Archive
You can use Search and Filter Pro with Beaver Builders Themer Post Module columns post layout, this guide goes through the tweaks needed and uses a CPT (custom post type) archive page. Create your Posts Module CPT Archive Page via Themer Create your Posts Module with the columns layout on a CPT…
Read MoreAdd Search & Filter Pro to Beaver Builder Masonry Grid
You can use Search and Filter Pro with Beaver Builders Themer Post Module grid masonry layout, this guide goes through the tweaks needed and used the main blog post archive page. Create your Posts Module Archive Page Create your Posts Module layout on the main Post Archive page with Beaver Themer and add in your…
Read MoreAvoid 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 in order for them to display properly. Add FontAwesome CSS First up is to call…
Read MoreAdd a ‘Continue Shopping’ Button to Woo Commerce Checkout and Cart Page
By default WooCommerce Cart page does not have a ‘Continue Shopping’ or ‘Return to Store’ button. However if you go to the cart page when the cart is empty, there is a ‘Return to Store’ button. We just need to add this button code to the cart page when the cart has items. Copy WooCommerce Templates into…
Read MorejQuery replace an image on click
jQuery replace an image on click- example below, this is a method to swap numerous images in HTML by manipulating the images src attribute value from the click of another element such as a button. HTML <div class=”button-container”> <button class=”black-button”></button> <button class=”red-button”></button> <button class=”blue-button”></button> <button class=”yellow-button”></button> </div> <img id=”change-image” src=”/wp-content/uploads/2018/09/black.jpg” alt=”Black Image” /> jQuery jQuery(document).ready(function($){ $(‘.black-button’).on({…
Read More