1. Shortcodes

The Shortcodes tab allows you to generate ready-to-use shortcode snippets that can be placed anywhere on your WordPress site (pages, posts, sidebars, or custom templates). These shortcodes make it easy to display WhatsApp buttons without relying only on floating chat layouts.

Select Button Style

• Advance Button → Displays a more detailed button with agent photo, name, and designation. Suitable when you want to show a personalized support agent experience.
• Simple Button → Displays a clean and minimal button with only an icon and label (e.g., “How may I help?”). Perfect for compact placements like sidebars or product pages.

Shortcode

• Once a style is selected, a shortcode is automatically generated.
• Example for Advance Button:

[chat_help style="1" primary_color="#118c7e" secondary_color="#0b5a51" type_of_whatsapp="number" number="+8801123454646778" message="Hi! I have a question about your service." name="John Doe" designation="Technical Support" label="How can I help you?" online="I am online" offline="I am offline" visibility="wHelp-show-everywhere"]

• Example for Simple Button:

[chat_help style="2" primary_color="#118c7e" secondary_color="#0b5a51" type_of_whatsapp="number" number="+88012345678" message="Hi! I have a question about your service." label="How can I help you?" visibility="wHelp-show-everywhere"]

• Use the Copy Shortcode button to quickly copy it and paste anywhere on your site.

👉 This flexibility means you can insert WhatsApp chat buttons directly into blog posts, landing pages, WooCommerce product descriptions, or even custom layouts.

Shortcode Attributes Reference #

Below is a list of supported attributes for the [chat_help] shortcode:

• style
  • Defines the button style.
  • 1 = Advance Button (shows photo, name, designation).
  • 2 = Simple Button (icon + label only).
• primary_color
  • Sets the primary color of the button.
  • Example: "#118c7e"
• secondary_color
  • Sets the secondary (hover/contrast) color of the button.
  • Example: "#0b5a51"
• padding
  • Controls button padding (inside spacing).
  • Example: "10px 18px 10px 18px"
• type_of_whatsapp
  • Defines whether the button links to a number or group.
  • Values: "number" or "group"
• number
  • The WhatsApp phone number with country code.
  • Example: "+8801234567"
• group
  • Paste the group link if using a WhatsApp group button.
• message
  • The pre-filled message shown when a user clicks the button.
  • Example: "Hi! I have a question about your service."
• photo(Advance Button only)
  • URL of the agent’s profile photo.
  • Example: "https://yoursite.com/photo.jpg"
• name(Advance Button only)
  • The display name of the agent.
  • Example: "John Doe"
• designation(Advance Button only)
  • The role or title of the agent.
  • Example: "Technical Support"
• label
  • The button text shown to users.
  • Example: "How can I help you?"
• online(Advance Button only)
  • Custom text when the agent is online.
  • Example: "I am online"
• offline(Advance Button only)
  • Custom text when the agent is offline.
  • Example: "I am offline"
• visibility
  • Controls where the button is displayed.
  • Example: "wHelp-show-everywhere"
• sizes
  • CSS class for button size.
  • Example: "wHelp-btn-lg"
• timezone(optional)
  • Define a timezone if you want availability rules to apply.
  • Example: "Asia/Dhaka"
• sunday to saturday(optional)
  • Set availability hours for each day.
  • Example: sunday="00:00-23:59"

👉 Users can remove attributes they don’t need. For example, a minimal Simple Button shortcode might look like this:

[chat_help style="2" number="+88012345678" message="Hello! I’d like to know more." label="Chat with us"]

Whereas a fully detailed Advance Button could be:

[chat_help style="1" photo="https://yoursite.com/photo.jpg" name="John Doe" designation="Sales Support" number="+88012345678" message="Hi, I’d like more info about your product." label="Talk to Sales" online="I am online" offline="I am offline" primary_color="#118c7e" secondary_color="#0b5a51" padding="10px 18px 10px 18px"]