The Definitive Guide to Setting Up WordPress in 2024: A Bristol Freelance Web Developer’s Essential Setup
In the ever-evolving landscape of website development, staying ahead of the curve...
For example, this is from a recent freelance web design project for a company near Bristol. It’s handy if you have Trade and Non-Trade customers and want to deliver a “sitewide” experience for each. The ideal scenario is when you land on the site, you have 2 buttons, “Trade” and “Non-Trade”. Depending on which one you choose drops/switches a cookie and delivers bespoke products and content.
The best way to deliver the correct products depending on which cookie is set, is to hook in to the core WooCommerce product loop parameters and filter the results.
First off, you will need to create a radio button for your products using ACF. Then set each product to show, hide or display on both.
Download js-cookie https://github.com/js-cookie/js-cookie and add the cookie functions for each button to your custom js file.
<script>
jQuery(document).ready(function(){
jQuery('a.trade').click(function() {
jQuery.removeCookie('NONTRADE', { path: '/' });
var trade = 'trade';
jQuery.cookie('TRADE',trade, { expires: 7, path: '/' });
jQuery('body').addClass(trade); // Adds the cookie class to the body for good measure
});
jQuery('a.nonTrade').click(function() {
jQuery.removeCookie('TRADE', { path: '/' });
var nontrade = 'nontrade';
jQuery.cookie('NONTRADE',nontrade, { expires: 7, path: '/' });
jQuery('body').addClass(nontrade); // Adds the cookie class to the body for good measure
});
</script>
The place this in your functions.php file.
<?php
add_action( 'woocommerce_product_query', 'tradehide_product_query' );
function tradehide_product_query( $q ){
$meta_query = $q->get( 'meta_query' );
if (isset($_COOKIE['TRADE'])) :
$meta_query[] = array(
'relation' => 'OR',
array(
'key' => 'acf_radio_fieldname',
'value' => 'trade',
'compare' => 'LIKE'
),
array(
'key' => 'acf_radio_fieldname',
'value' => 'both',
'compare' => 'LIKE'
)
);
elseif (isset($_COOKIE['NONTRADE'])) :
$meta_query[] = array(
'relation' => 'OR',
array(
'key' => 'acf_radio_fieldname',
'value' => 'nontrade',
'compare' => 'LIKE'
),
array(
'key' => 'acf_radio_fieldname',
'value' => 'both',
'compare' => 'LIKE'
)
);
endif;
$q->set( 'meta_query', $meta_query );
}
You can also use this anywhere in your templates to hide or show content:
<?php if (isset($_COOKIE['TRADE'])) : ?>
// Your trade content
<?php elseif (isset($_COOKIE['NONTRADE'])) : ?>
// Your non-trade content
<?php endif; ?>
ACF, Coding Tips, jQuery, PHP, WooCommerce Tips
Share
In the ever-evolving landscape of website development, staying ahead of the curve...
In the digital realm, your website serves as the cornerstone of your...
In the ever-evolving world of e-commerce, having a robust and flexible platform...
Get the featured image dimensions (width and height) in WordPress. Paste the following code in the single.php file. <?php $post_id...
To exclude draft posts from appearing in the ACF Relationship field, add this code to your functions.php file. All you...
A quick snipped of code filter parameters into YouTube oEmbed requests. Handy to remove suggested videos, YouTube contols and info....