Can I add social chat buttons without a plugin?

Yes, you can add them without a plugin by placing normal links in a Custom HTML block and styling them with CSS. WhatsApp and Telegram provide link formats that open their chat interfaces, while other services may require a page URL or invitation URL. This is a good option for one or two buttons, but you must maintain the links and styling yourself.

How do I create a WhatsApp chat button in WordPress?

Create a normal link using WhatsApp's click-to-chat format, such as https://wa.me/15551234567 , and place it in a Button block or Custom HTML block. Use the full international phone number without spaces, brackets, dashes or unnecessary zeroes. Test the link on both a phone and desktop browser before publishing it.

Why does my social chat button open the wrong account?

The button usually opens the wrong account because its destination URL contains an old phone number, username, page address or invitation link. Copy the current link directly from the relevant service, replace the old value in WordPress and test it while logged out. Slack invite links can also expire, so check their status before assuming the CSS or WordPress block is broken.

Should social chat buttons float on every page?

Floating buttons are useful when visitors may need help from any page, but they can cover content on small screens. Start with a compact vertical group, test it over menus, cookie notices and checkout controls, and consider showing only one primary channel on mobile. A plugin is usually more practical than custom CSS when you need different positions or visibility rules across the site.

How to add social chat buttons to a WordPress site

Social Time About 20 minutes 6 steps Updated 8 Nov 2026

The short answer

You can add one or two social chat buttons manually with WordPress buttons or a Custom HTML block, then link them to WhatsApp, Telegram, Messenger or another service. For a floating, multi-channel button across the whole site, a plugin is quicker and easier to maintain.

The route

01Choose the channels and destinations
02Create and check each chat link
03Add the buttons manually
04Style the buttons with CSS
05Test the complete visitor journey
06Use a plugin for the fast way

What you need

WordPress administrator access
The account, phone number or invite URL for each messaging service
A backup or staging copy if you are changing theme CSS

Choose the channels and destinations

Decide which services you actually monitor and where each button should send visitors. A WhatsApp link needs a full phone number in international format without brackets, spaces, dashes or extra zeroes. Telegram can link to a public username, while Slack links should normally be invitation links rather than a general workspace URL.

Keep the list short. Three clear choices are usually easier to understand than a row of ten unfamiliar icons.

Create and check each chat link

For WhatsApp, use a link such as https://wa.me/15551234567. You can add a pre-filled message with ?text=, but encode spaces and punctuation correctly. For Telegram, a public username link follows the form https://t.me/username.

Open every destination link in a private browser window before adding it to WordPress. Check that the right account opens, the phone number is correct and any Slack invitation still works. Slack invitation links can expire, so replace them when necessary.

Add the buttons manually

Edit the page, template part or footer where the buttons should appear and insert a Custom HTML block. Paste simple links such as <div class="social-chat-buttons"><a href="https://wa.me/15551234567" aria-label="Chat on WhatsApp">WhatsApp</a><a href="https://t.me/example" aria-label="Chat on Telegram">Telegram</a></div>, replacing the example destinations with your own. WordPress provides a Custom HTML block for adding markup directly to a page.

Use text labels or accessible labels rather than relying only on coloured icons. Save or publish the page, then view it while logged out to confirm visitors can see the buttons.

Style the buttons with CSS

For a simple inline row, use your theme's Additional CSS area. For a floating button group, add CSS similar to .social-chat-buttons{position:fixed;right:20px;bottom:20px;z-index:9999;display:flex;flex-direction:column;gap:8px}.social-chat-buttons a{display:block;padding:12px 16px;border-radius:999px;background:#25d366;color:#fff;text-decoration:none;font-weight:600}.social-chat-buttons a:last-child{background:#229ed9}.

Adjust the colours, spacing and position to suit your design. Check the buttons on a small phone screen so they do not cover cookie notices, checkout controls or other important content. Additional CSS is intended for custom styling, but theme-specific CSS can need checking again after a theme change.

Test the complete visitor journey

Test on desktop and mobile, while logged out and with browser pop-up blocking enabled. Confirm that each button opens the expected app or web page, the link remains usable when the label wraps, and the destination account can receive messages.

The common Friday problem is a button pointing to a personal account, an old phone number or an expired Slack invitation. Send a real test message and update the button whenever the receiving account changes.

Use a plugin for the fast way

If you want a floating button with several channels, centralised settings and less custom CSS, install and configure a social-chat plugin instead of maintaining the markup yourself. Bit Assist Pro is one option for displaying multi-channel chat buttons for WhatsApp, Messenger, Telegram, Slack and other services.

After activation, add only the channels your team can answer, enter the verified destination details, choose the button position and test the result on mobile. The manual route is perfectly adequate for one or two links; the plugin route is faster when the buttons must appear site-wide or include several services.

The fast route

Let Bit Assist Pro do it

Multi-channel chat buttons for WhatsApp, Messenger, Telegram, Slack, and more when visitors prefer social messaging.

Get Bit Assist Pro

Tools that do this job

All of these solve the task above. They are listed as we have covered them.

Our pick

Bit Assist Pro

Multi-channel chat buttons for WhatsApp, Messenger, Telegram, Slack, and more when visitors prefer social messaging.

Get it

WhatsApp Chat WordPress

Adds customizable WhatsApp chat buttons with multiple numbers and business hours for direct visitor support.

Get it

Sources

faq.whatsapp.com /5913398998672934?utm_source=openai
slack.com /help/articles/201330256-Invite-new-members-to-your-workspac…
wordpress.org /documentation/article/custom-html/?utm_source=openai
wordpress.org /documentation/article/advanced-settings-overview/?utm_sourc…

Questions

Can I add social chat buttons without a plugin?: Yes, you can add them without a plugin by placing normal links in a Custom HTML block and styling them with CSS. WhatsApp and Telegram provide link formats that open their chat interfaces, while other services may require a page URL or invitation URL. This is a good option for one or two buttons, but you must maintain the links and styling yourself.
How do I create a WhatsApp chat button in WordPress?: Create a normal link using WhatsApp's click-to-chat format, such as <code>https://wa.me/15551234567</code>, and place it in a Button block or Custom HTML block. Use the full international phone number without spaces, brackets, dashes or unnecessary zeroes. Test the link on both a phone and desktop browser before publishing it.
Why does my social chat button open the wrong account?: The button usually opens the wrong account because its destination URL contains an old phone number, username, page address or invitation link. Copy the current link directly from the relevant service, replace the old value in WordPress and test it while logged out. Slack invite links can also expire, so check their status before assuming the CSS or WordPress block is broken.
Should social chat buttons float on every page?: Floating buttons are useful when visitors may need help from any page, but they can cover content on small screens. Start with a compact vertical group, test it over menus, cookie notices and checkout controls, and consider showing only one primary channel on mobile. A plugin is usually more practical than custom CSS when you need different positions or visibility rules across the site.