How to add a WhatsApp floating button to your Bubble.io website in simple steps following this tutorial. No code skills are required!
Today, we’ll guide you through adding a ‘Click to WhatsApp’ button to your Bubble.io web page, even if you have no coding skills. In just a few minutes, you’ll have a fully functional WhatsApp widget ready for your customers to reach out to.
By integrating the Wassenger WhatsApp button on your website, you provide a direct, fast, and familiar communication channel for potential clients. This simple addition can significantly increase customer engagement, foster trust, and ultimately drive more sales by making your business readily accessible to answer inquiries or close deals.
🤩 🤖 Wassenger is a complete communication platform and API solution for WhatsApp. Explore more than 100+ API use cases and automate anything on WhatsApp by signing up for a free trial and getting started in minutes!
Requirements
- Visit the Wassenger widget button’s page here
- A Bubble.io account: sign up here
- Having or creating a page ready to be published: do it here
Let’s continue with the steps below.
Step 1: Create a new page
If you already have one, skip this step :)
Okay, from your Bubble.io apps page, click on Create an app
Add a name and optionally, Start from a given template:
Then you will move to the design page
How Wassenger can improve your communication?
Wassenger revolutionises WhatsApp communication and provides many productivity features like Automatic replies, Quick Replies, Team Permissions, Chat assignments to your team members, Usage analytics, Automatic messaging via API integration, Chatbot creation and much more. Reduce response time so you can reach customers faster on WhatsApp with Wassenger.
Step 2: Get the WhatsApp Floating Button Code
Now, to embed your new WhatsApp button widget, you need to visit our dedicated page here and generate the code for the integration. Don’t worry! You won’t need to change anything. The code is ready to use :)
Next, click on ‘Generate Button’ and copy the provided code
🤩 🤖 You can also automate messages with Wassenger! Explore our app and boost your sales by signing up for a free trial and getting started in minutes! 🚀
Step 3: Insert the given code into an HTML element
Next, after copying the provided Wassenger code, we will create a new HTML element
After clicking the page, the HTML element will show up, and we will click on ‘HTML editor’
Paste the code and click ‘Save’
Your WhatsApp widget button will be displayed
🤩 🤖 You can also automate messages with Wassenger! Explore our app and boost your sales by signing up for a free trial and getting started in minutes! 🚀
Step 4: Preview and Launch the page
Once we have pasted the code we will click on the ‘Preview’ button
And voilà! Your WhatsApp button is ready to rock!
Click on the button that will redirect you to the Whatsapp number
There you go! It was easy right!? Discover how Wassenger can make you engage more customers and grow your sales!
FAQ
How a WhatsApp button can increase your business sales?
- Better Communication: Allow customers to initiate a WhatsApp conversation with you immediately directly from your website
- Effective WhatsApp communication: Many customers prefer communicating through WhatsApp, as it is more simpler and comfortable way than other channels, it is more personal and direct to the customer.
- Effortless Lead Collection: Capture and store customers’ numbers automatically for future use when they message you via a WhatsApp button from your website
How Wassenger can improve your WhatsApp business communication?
Wassenger revolutionises WhatsApp communication and provides many productivity features like Automatic replies, Quick Replies, Team Permissions, Chat assignments to your team members, Usage analytics, Automatic messaging via API integration, Chatbot creation and much more. Reduce response time so you can reach customers faster on WhatsApp with Wassenger.
Can I customize the size and position of the button?
Yes, you can. Simply select the option you prefer in the generator and the code will be generated accordingly.


















