How to Add a Branch-Wise WhatsApp Sticky Button in WordPress

Do you run a multi-branch business or offer location-based services? Want your customers to reach the right branch via WhatsApp with a single click?
This guide walks you through a custom WordPress plugin that adds a sticky WhatsApp button, tailored per page (branch) with a dynamic and easy-to-use admin interface.

🧩 Plugin Features

• ✅ Assign a unique WhatsApp number per page (using slugs).
• ✅ Clean and dynamic admin settings table for managing branch info.
• ✅ Lightweight and responsive sticky button on the bottom-left of each page.
• ✅ Easily extendable and developer-friendly code.
• ✅ Custom styling and mobile-friendly design.

🔧 How the Plugin Works

This plugin registers a settings page in the WordPress admin under Settings > Branch WhatsApp Button. Here you can:

• Add branch slugs (e.g., lahore-branch)
• Assign the corresponding WhatsApp number (e.g., 923001234567)
• Dynamically add/remove branch rows
• Save and reflect changes immediately on the front-end

🧠 Technical Breakdown

1. Admin UI Table

The plugin uses standard WordPress functions like add_options_page() and wp_nonce_field() to create a secure form with dynamic row addition using jQuery.

2. Data Handling

The submitted data is saved in the WordPress options table via update_option() and retrieved using get_option().

Format:

[
  ['slug' => 'karachi-branch', 'number' => '923001234567'],
  ['slug' => 'lahore-branch', 'number' => '923451234567'],
]

3. Front-End Display

When a page loads, the plugin:

• Checks if it’s a page (not a post)
• Gets the current page’s slug
• Matches it with the saved settings
• Displays the WhatsApp button with the branch’s WhatsApp number

4. Sticky Button UI

The sticky button is placed on the bottom-left and includes:

• A WhatsApp icon
• Smooth scale-on-hover effect
• Mobile-friendly responsive styles

🖼 Example Output

If you’re on the page /karachi-branch, and the WhatsApp number for that slug is saved, you’ll see a sticky button like this:

Clicking the button opens:

https://wa.me/923001234567

📥 Download or Customize

You can create this plugin yourself or download it from your GitHub or official plugin directory (if submitted).

Plugin Header Example:

/*
Plugin Name: Branch WhatsApp Sticky Button
Description: Display a branch-specific WhatsApp sticky button on designated pages.
Author: Ali Shahbaz
*/

💡 Use Cases

• Real estate agencies with multiple office branches
• Healthcare clinics in various cities
• Service providers offering city-specific support
• Schools and coaching centers by campus
• Any business needing branch-level WhatsApp support

🔒 Security Notes

• Uses check_admin_referer() to protect against CSRF
• Sanitizes inputs using sanitize_title() and sanitize_text_field()
• Renders outputs using esc_attr() to prevent injection

📌 Final Thoughts

This WordPress plugin offers a simple but powerful way to improve customer support and lead conversion for businesses with multiple branches. By customizing contact at the page level, you’re giving users a faster way to connect with the right person—directly via WhatsApp.

📈 Want to Build More?

Need help customizing plugins like this or creating full-scale WordPress solutions?
👉 Hire Atechno for WordPress Development