OptisioToolsVisit Optisio
All tools

Optisio Tool

MessagingLive

WhatsApp Chat Button Generator

Design a floating WhatsApp button for your site. Normalize Indonesian numbers, preview the result, then copy a wa.me link or lightweight HTML embed — no accounts required.

Configuration

Shuffle colors, shape, shadow, and hover — phone & message stay put.

Indonesian numbers accepted as 08..., +62..., or 62.... Normalized: —

Optional. Encoded into the wa.me link.

Color
Font color

Picks light or dark text automatically from the button background.

Customize design & hover

Fix validation issues to unlock copy actions.

Live preview

yoursite.com

How it works

Configure once. Embed anywhere.

  1. 01

    Enter your number

    Use a local or international Indonesian format. We normalize it for wa.me.

  2. 02

    Shape the button

    Set label, color, icon, corner position, and an optional prefilled message.

  3. 03

    Preview live

    Check the browser mockup before you commit anything to your site.

  4. 04

    Copy & place

    Grab the link or HTML embed and paste it into WordPress, HTML, or a builder.

WordPress

Install on a WordPress site

Copy the HTML embed from the generator. In the WordPress admin, open Appearance → Theme File Editor (or your child theme / code snippets plugin) and paste the snippet just before the closing </body> tag in footer.php.

Prefer a safer path? Paste the same snippet into a “Custom HTML” block in the footer template via the Site Editor, or use a reputable header/footer scripts plugin. Publish, then check the button on mobile and desktop.

HTML

Install on a static HTML site

Open the page template where the button should appear site-wide — usually your shared layout or index.html. Paste the embed snippet before </body>.

The CSS is scoped to .optisio-wa-btn, so it won’t restyle unrelated links. Adjust bottom and left/right if your layout needs more clearance.

FAQ

Common questions

Does this work with Indonesian phone numbers?
Yes. Enter numbers as 08…, +62…, or 62…. The generator normalizes them to the international format WhatsApp expects.
Will the prefilled message always appear?
Most WhatsApp clients open with your message ready to send. Visitors can still edit it before tapping send.
Is the embed snippet safe to paste?
It’s lightweight HTML and CSS only — no scripts, trackers, or remote calls. Review it once, then paste into your theme or page builder.
Can I change the button later?
Update the values here, copy a fresh embed, and replace the previous snippet. Or edit the color, label, and position directly in the pasted CSS.

Related

More from the library

Optisio

Need more than a button?

Optisio helps teams run calmer, clearer digital operations — beyond a single chat widget.

Visit optisio.com