As a store owner, it’s essential to provide your customers with a personalized shopping experience. One way to enhance this experience is by showing them the products they have recently viewed. This feature allows users to quickly navigate back to previously seen items and potentially increase conversions.
In this blog post, we will walk through the process of building a Recently Viewed Products plugin for WooCommerce. This plugin will display recently viewed products on your site, send an email reminder to customers after 5 days, and support dynamic customization options through a shortcode.
Step 1: Setting Up the Plugin
To begin, let’s create a custom plugin. We’ll structure the plugin file so that it’s easy to expand and customize later on.
Plugin Header
Start by creating a file called recently-viewed-products.php and include the following plugin header at the top:
<?php
/**
* Plugin Name: Recently Viewed Products with Email Notification
* Description: A plugin to display recently viewed products and send email notifications to users after a specific period.
* Version: 1.1.0
* Author: Kishore
* License: GPL3
*/
// Ensure WooCommerce is active
if ( ! class_exists( 'WooCommerce' ) ) {
exit; // Exit if WooCommerce is not active
}Shortcode to Display Recently Viewed Products
We’ll create a WooCommerce shortcode [recently_viewed_products] that will display the recently viewed products on any page or post. This shortcode will accept various parameters like per_page, orderby, order, category, and columns for dynamic customization.
add_shortcode( 'recently_viewed_products', 'wc_recently_viewed_shortcode' );
function wc_recently_viewed_shortcode( $atts ) {
// Set default attributes
$atts = shortcode_atts( array(
'per_page' => 8, // Default to 8 products per page
'orderby' => 'date', // Default sorting by date
'order' => 'desc', // Default order is descending
'category' => '', // Default category is none
'columns' => 4, // Default columns is 4
), $atts, 'recently_viewed_products' );
// Get the recently viewed products from the cookie
$viewed_products = ! empty( $_COOKIE['woocommerce_recently_viewed'] ) ? (array) explode( '|', wp_unslash( $_COOKIE['woocommerce_recently_viewed'] ) ) : array();
// Limit the number of products to 'per_page' (default: 8)
$viewed_products = array_slice($viewed_products, 0, $atts['per_page']);
// If there are no recently viewed products, return nothing
if ( empty( $viewed_products ) ) return;
// Title for the section
$title = '<h3 class="product-section-title container-width product-section-title-related pt-half pb-half uppercase">You Recently Viewed</h3>';
// Prepare the product query arguments based on the attributes
$args = array(
'limit' => $atts['per_page'], // Limit the number of products
'orderby' => $atts['orderby'], // Sorting order
'order' => $atts['order'], // Sorting direction (asc, desc)
'post__in' => $viewed_products, // Limit to recently viewed products
'columns' => $atts['columns'], // Number of columns for product display
);
// Add category filter if specified
if ( ! empty( $atts['category'] ) ) {
$args['category'] = $atts['category'];
}
// Create the WC_Product_Query
$query = new WC_Product_Query( $args );
// If no products are found, return nothing
if ( ! $query->get_products() ) {
return '';
}
// Start the loop to display the products
$output = $title . '<ul class="products columns-' . esc_attr( $atts['columns'] ) . '">';
foreach ( $query->get_products() as $product ) {
// Start the product HTML output
$output .= '<li ' . wc_product_class( '', $product ) . '>';
$output .= '<a href="' . get_permalink( $product->get_id() ) . '">';
$output .= $product->get_image();
$output .= '<h2 class="woocommerce-loop-product__title">' . $product->get_name() . '</h2>';
$output .= '</a>';
$output .= '</li>';
}
// End the list
$output .= '</ul>';
return $output;
}Track Recently Viewed Products
We will track the products that a customer has viewed and store the information in a cookie. This way, the data is accessible on every page load.
function wc_custom_track_product_view() {
if ( ! is_singular( 'product' ) ) {
return;
}
global $post;
// Get the list of viewed products from the cookie
if ( empty( $_COOKIE['woocommerce_recently_viewed'] ) ) {
$viewed_products = array();
} else {
$viewed_products = (array) explode( '|', $_COOKIE['woocommerce_recently_viewed'] );
}
// Add the current product ID to the viewed products list if not already present
if ( ! in_array( $post->ID, $viewed_products ) ) {
$viewed_products[] = $post->ID;
}
// Limit the number of viewed products to 15
if ( sizeof( $viewed_products ) > 15 ) {
array_shift( $viewed_products ); // Remove the oldest product if more than 15
}
// Store the viewed products in a cookie
wc_setcookie( 'woocommerce_recently_viewed', implode( '|', $viewed_products ) );
}
add_action( 'template_redirect', 'wc_custom_track_product_view', 20 );Send Email After 5 Days
Now, we will create a system that sends an email reminder to users 5 days after they viewed a product, provided they have viewed at least 5 products. This is done by checking timestamps associated with the viewed products.
function wc_send_recently_viewed_email( $user_id, $viewed_products ) {
$user_info = get_userdata( $user_id );
$user_email = $user_info->user_email;
// Prepare the product details
$products = wc_get_products( array( 'include' => $viewed_products ) );
$product_list = '';
foreach ( $products as $product ) {
$product_list .= '<li><a href="' . get_permalink( $product->get_id() ) . '">' . $product->get_name() . '</a></li>';
}
// Email subject and body
$subject = 'Your Recently Viewed Products';
$message = '
<html>
<head>
<title>Your Recently Viewed Products</title>
</head>
<body>
<p>Hi ' . $user_info->first_name . ',</p>
<p>Here are the products you have recently viewed:</p>
<ul>' . $product_list . '</ul>
<p>We hope this helps you find what you are looking for!</p>
</body>
</html>
';
// Send the email
wp_mail( $user_email, $subject, $message, array( 'Content-Type: text/html; charset=UTF-8' ) );
}Email Timing
To send the email after 5 days, we will check the timestamp of when the product was viewed and compare it with the current time. If 5 days have passed and the user has viewed at least 5 products, the email will be sent.
Step 2: Plugin Activation and Usage
- Upload the Plugin: Upload the plugin file (
recently-viewed-products.php) to the/wp-content/plugins/directory of your WordPress installation. - Activate the Plugin: Go to the WordPress admin dashboard, navigate to
Plugins, and clickActivatefor the Recently Viewed Products plugin. - Add the Shortcode: Once the plugin is activated, use the shortcode
[recently_viewed_products]to display the recently viewed products anywhere on your site (e.g., in pages, posts, or widgets). Example:
[recently_viewed_products per_page="6" orderby="price" order="asc" category="clothing" columns="3"]- Email Reminders: After 5 days of viewing products, an email will be sent to the logged-in user, displaying the products they recently viewed.
Conclusion
This plugin allows you to provide a more personalized shopping experience for your customers. By displaying recently viewed products and sending email reminders, you can increase engagement and potentially drive more sales.
You can further enhance this plugin by customizing the email content, adding more filters for product queries, or integrating it with other WooCommerce features like dynamic discounts.
If you have any questions or need additional features, feel free to reach out in the comments below!
Leave a Reply