Tag: Shipping Methods

WooCommerce: Add ‘Click & Collect’ without a plugin

If you want to offer your customers a convenient “Click & Collect” option in WooCommerce without installing extra plugins, this guide will show you how to do it quickly and cleanly. By customizing WooCommerce’s built-in local pickup shipping method, you can create a seamless in-store pickup experience without the overhead of additional plugins.

Quick Fix: Customize Local Pickup for ‘Click & Collect’

1. Enable the Local Pickup shipping method in WooCommerce settings.
2. Rename “Local Pickup” to “Click & Collect” via a filter in your theme’s functions.php.
3. Optionally, add instructions or pickup details on the checkout page.
4. Test the checkout flow to ensure the option appears and works as expected.

Why This Happens

WooCommerce includes a “Local Pickup” shipping method by default, designed for customers who want to pick up their orders instead of having them shipped. However, the default label and messaging might not suit your branding or customer experience goals. Instead of installing a plugin that adds a new shipping method, you can simply repurpose and rename the existing local pickup option. This approach keeps your site lightweight and maintains compatibility with WooCommerce updates.

Step-by-step: Add ‘Click & Collect’ Without a Plugin

1. Enable Local Pickup Shipping Method

   Go to WooCommerce > Settings > Shipping. Select your shipping zone or create a new one if needed. Click Add shipping method and choose Local Pickup.

2. Rename Local Pickup to Click & Collect

   Add the following code snippet to your active theme’s functions.php file or a site-specific plugin:

   add_filter( 'woocommerce_shipping_method_title', 'rename_local_pickup_to_click_collect', 10, 2 );
   function rename_local_pickup_to_click_collect( $title, $method ) {
       if ( 'local_pickup' === $method-id ) {
           $title = 'Click & Collect';
       }
       return $title;
   }

3. Add Pickup Instructions on Checkout (Optional)

   To provide customers with pickup instructions, add this snippet to display a custom message when “Click & Collect” is selected:

   add_action( 'woocommerce_review_order_after_shipping', 'display_click_and_collect_instructions' );
   function display_click_and_collect_instructions() {
       $chosen_methods = WC()-session-get( 'chosen_shipping_methods' );
       if ( ! empty( $chosen_methods ) && in_array( 'local_pickup', $chosen_methods ) ) {
           echo '<div class="woocommerce-info">Please collect your order from our store during business hours.</div>';
       }
   }

4. Test Your Checkout

   Visit your store’s checkout page, add a product to the cart, and select the “Click & Collect” shipping option. Confirm the label change and that the instructions appear if you added them.

UX Tips for ‘Click & Collect’

• Clear Pickup Location: Include your store address and opening hours in the instructions or confirmation emails.
• Order Ready Notification: Consider adding an email or SMS notification to inform customers when their order is ready for pickup.
• Pickup Time Slots: For advanced setups, you might later integrate a time slot selector, but this requires custom development or plugins.
• Visual Indicators: Use icons or badges to highlight the “Click & Collect” option at checkout for better visibility.

Works on

FAQ

1. Can I add multiple pickup locations without a plugin?

   WooCommerce’s default local pickup method supports only one pickup location per shipping zone. To manage multiple locations, you would need custom code or a plugin.

2. Will this method affect shipping calculations?

   No. Local Pickup is treated as a shipping method with zero cost by default, so it won’t interfere with shipping rates or taxes unless customized.

3. How can I change the pickup instructions text?

   Edit the message inside the display_click_and_collect_instructions function in your functions.php file.

4. Is this solution update-safe?

   Yes. Since it uses WooCommerce’s built-in shipping method and standard filters, it is safe through WooCommerce updates. Just keep your theme or custom plugin updated.

5. Can I style the pickup instructions?

   Yes. The instructions are wrapped in a div with the woocommerce-info class, which you can target with CSS in your theme.