Adding Floating Contact Button

What it looks like

Desktop: You’ll see a round button in the bottom-right corner. When people click it, your booking form pops up.

Mobile: Three buttons at the bottom – Call, WhatsApp, and Book Now. Simple.

Setting it up (takes about 5 minutes)

First, create your booking form popup

• Head to Elementor → Templates → Popups
• Make a new one with your booking form
• Hit publish, then check the URL for the ID number (looks like post=15782)

Now add the widget

• Edit your page in Elementor
• Search for “Floating Contact Button” in the widgets
• Drop it anywhere on the page (it’ll float on its own)

Fill in your details

• Phone Number: Put your number with the country code (like +971507400021)
• WhatsApp Number: Same deal
• Popup ID: That number you grabbed earlier

Hit publish

You’re done. Really, that’s it.

Make sure it works

On desktop, you should see the button floating in the corner. Click it and your form should pop up. On mobile, check that all three buttons at the bottom work – one for calling, one for WhatsApp, and one that opens the booking form.

If something’s not working

• Double-check the popup ID – it needs to be exact
• Make sure your popup is actually published, not sitting in drafts
• Clear your cache (Elementor → Tools → Regenerate CSS) then refresh
• Oh, and you need Elementor Pro for the popup part to work

A few things to remember

• Always include the country code when you type phone numbers
• Test it on your phone, not just desktop
• If you use it on one page and it works well, add it to all your pages

That’s pretty much it. Once it’s set up, people can reach you with just one click. Way better than making them hunt for your contact page.