Open form from a Link or Button

By default, WhatsForm displays a floating launcher button on your website. You can hide this default launcher and trigger the widget from your own custom button, link, or element instead.

This is useful when you want full control over the placement and design of your call-to-action.

How It Works

Step 1: Add the widget script to your page

Place the WhatsForm embed script in your HTML, just as you normally would:

<script async src="https://whatsform.com/launcher.js" id="wf-widget" data-id="demo" data-message="Message on WhatsApp"></script>

Replace demo with your actual WhatsForm form ID.

Step 2: Hide the default floating button

Add the following line anywhere after the embed script. This tells WhatsForm not to show the default launcher:

<script>window.whatsformHideButton = true;</script>

Step 3: Open the widget from your own button

Use the whatsform.open() method to trigger the widget when a user clicks your custom element:

<button onclick="whatsform.open()">Chat with us</button>

You can attach this to any clickable element, not just buttons. For example, a link:

<a href="#" onclick="whatsform.open(); return false;">Talk to Sales</a>

Full Example

<!-- WhatsForm Widget -->
<script async src="https://whatsform.com/launcher.js" id="wf-widget" data-id="demo" data-message="Message on WhatsApp"></script>

<!-- Hide the default floating button -->
<script>window.whatsformHideButton = true;</script>

<!-- Your custom trigger -->
<button onclick="whatsform.open()">Chat with us on WhatsApp</button>

Common Use Cases

Inline CTA on a landing page - Place a "Chat with us" button inside your hero section or pricing table instead of relying on the floating widget.

Navigation bar link - Add a "WhatsApp" link in your site header that opens the form on click.

Conditional triggers - Use JavaScript logic to open the widget after a delay, on scroll, or based on user behavior.

// Example: Open widget after 10 seconds
setTimeout(() => {
  whatsform.open();
}, 10000);

Notes

  • Make sure window.whatsformHideButton = true is set before the widget finishes loading. Placing it right after the embed script is the safest approach.

  • The whatsform.open() function becomes available once the script has loaded. If you call it too early (before the script loads), it may not work. For programmatic triggers, consider wrapping it in a check or a short delay.

  • This feature works with all WhatsForm widget types.



Still need help?

Contact us

Features