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...
To stop any page from being deleted by any user role, including admins, add the following code to your functions.php...
In the thriving city of Bristol, businesses are constantly seeking innovative ways to stand out in the digital landscape. When...
Being a freelance web developer, I often work on websites for start up and small businesses. The topic of social...