Manual SMS Notifications for Out-of-Stock WooCommerce Products: A Step-by-Step Guide

Staying in touch with customers is crucial in the dynamic world of e-commerce, especially when it comes to product availability. The WooCommerce e-commerce platform offers several hooks that enhance the functionality of your online store. Notifying customers via SMS when out-of-stock products are back in stock is one such enhancement.

In this article, we’ll show you how to add a form to WooCommerce products to allow customers to sign up for SMS notifications. Currently, WP SMS users must manually perform this task. An automatic feature is on the way.

SMS notifications offer higher open rates than emails for informing your customers instantly. Messages are directly sent to the mobile device of your customer, ensuring they are seen as soon as possible.

Requirements

To implement this feature, you’ll need:

  • A WordPress website with WooCommerce installed.
  • WP SMS plugin for managing SMS communications.
  • A basic understanding of hooks in WordPress and PHP.

Step 1: Understanding WooCommerce Hooks

Hooks in WordPress allow developers to ‘hook into’ the platform’s code to alter or add functionality. WooCommerce comes with its own hooks, which we’ll use for our purposes: woocommerce_get_stock_html.

Step 2: Adding a Custom Form to Out-of-Stock Products

When a product is out of stock, we’ll append a form to the stock HTML using the woocommerce_get_stock_html filter. This form will allow users to subscribe to an SMS notification. Here’s the PHP code that does just that:

// Add filter to 'woocommerce_get_stock_html'
add_filter('woocommerce_get_stock_html', function ($html, $product) {
    if (!$product->is_in_stock()) {
        // Your custom form HTML goes here
        $html .= '
        <form action="' . esc_url($_SERVER['REQUEST_URI']) . '" method="post">
            <p class="stock out-of-stock">Out of stock</p>
            <label for="mobile_number">Subscribe to SMS alerts:</label>
            <input type="tel" id="mobile_number" name="mobile_number" required>
            <button type="submit">Notify Me</button>
        </form>';
    }
    return $html;
}, 10, 2);

Step 3: Capturing Form Submissions

Next, we need to handle the form submission and use the provided addSubscriber function from WP SMS Pro to add the user’s mobile number to the SMS group.

// Handle form submission
add_action('init', function () {
    if ($_SERVER['REQUEST_METHOD'] === 'POST' && !empty($_POST['mobile_number'])) {
        // Assume the name is available from user input or user profile
        $name = 'John Doe';
        $group_id = 1; // The ID of your SMS group in WP SMS Pro

        // Add subscriber to SMS newsletter
        if (function_exists('\WP_SMS\Newsletter::addSubscriber')) {
            \WP_SMS\Newsletter::addSubscriber($name, sanitize_text_field($_POST['mobile_number']), $group_id);
            // Provide user feedback (customize as needed)
            add_action('wp_footer', function() {
                echo '<script>alert("Thank you for subscribing to SMS notifications!");</script>';
            });
        }
    }
});

Manual vs. Automatic Notifications

Currently, SMS notifications are sent manually when products are restocked. The store owner must monitor stock levels and send SMS alerts to subscribers. We are excited to announce that automatic SMS notifications are coming soon to the WP SMS WooCommerce Pro Add-On. Using this upcoming feature, customers will be notified automatically when products become available again.