FlowCraft · Live demo

FlowCraft Floating Contact Hub

Call, text, WhatsApp and email behind one friendly button, with "Open now" or "Closed · opens Mon 8:00 AM" worked out on the business's own clock. The round button in the corner of this page is the real thing. It runs the same app.js that comes with the paid component.

Sample business. "Harbor Plumbing" is made up for this demo, with Pacific-time hours, a fictional 555-01xx phone number and an example.com email. The contact buttons on this page don't open anything, and nothing you enter is saved or sent.

Try it

Pretend it's another time. Jump to lunchtime, a weekend or a holiday and watch the status change.
Open the corner button. Bottom right of this page. Close it with ×, Esc or a click outside.
Outside Pacific time? You'll see the business's time plus your own, e.g. "(3:00 PM your time)".

Pretend it's…

On the business's clock (Pacific time)

Visitors see: …

These buttons are for this catalogue page only; they aren't in the product. They move both hubs on this page: the inline one here and the round button in the corner.

A friendly support person with a headset, surrounded by phone, text and email icons

Harbor Plumbing (sample business)

Open now

Call us(206) 555-0142 · we’re answering now Send a textUsually replies within minutes WhatsAppChat with us now Email usReplies within a few hours

Opening hours

How it works

The right clock, every time

Your hours and time zone sit in index.html as simple JSON, and all the logic lives in app.js, commented so a junior developer can follow it.

Your clock, not theirsA visitor in New York checking a Seattle plumber at 10 AM Pacific sees "Open now · until 12:00 PM PDT (3:00 PM your time)".
Real-world hoursSplit hours for lunch, a "Closing soon" warning, holidays, and daylight-saving changes, all handled.
Never a dead endAfter hours the buttons stay, with notes like "leave a voicemail" or "we'll reply when we open", plus a form to leave an email.

No guessing: if the hours or the time-zone name can't be read, the hub shows "Contact us" rather than a wrong "Open now", and every button still works.

{
  "timezone": "America/Los_Angeles",
  "hours": {
    "mon": "08:00-12:00, 13:00-17:00",
    "sat": "09:00-13:00",
    "sun": ""
  },
  "closedDates": ["2026-12-25"],
  "closingSoonMinutes": 30
}

The four contact buttons are ordinary tel:, sms:, WhatsApp and mailto: links. Use it as a floating corner button, or inline on a Contact page.

What the full version includes

Delivered as a ZIP download through Payhip.

index.htmlA sample page with the hub: your hours, your four contact buttons and the email form, styled with Tailwind CSS
app.jsOpen, closing-soon and closed on your time zone, split hours, holidays, daylight saving, the panel and the form, heavily commented
style.cssThe corner button, panel, status dot, inline layout and hours list
assets/images/A sample header illustration, plus README.txt and an optional .htaccess

Requirements

Your hours and time zone. Plus your own phone number, WhatsApp number and email in the four buttons.
Any web host, or none. Paste one block into your pages. No server code, database or API key.
A form endpoint to receive leads (optional). Any service that accepts a JSON POST, for example Formspree, Make or Zapier. Until you add one, the form sends nothing and says so.
An internet connection for visitors. Tailwind CSS loads from its public CDN. No npm install or build step.

Get the Floating Contact Hub

Start with the free static shell to check the layout, or get the full version with the working hub you just tried.

Free

Free Static HTML Shell

The layout: the panel shown open with its header image, status line, four contact buttons, opening hours and email form, so you can review the design and markup.

Complete visual layout with the sample image
Sample structure and markup
Does not include the open/closed logic, panel or form logic

Try the Free Static Shell

Opens the free download on Payhip.

Full version

Full Floating Contact Hub — $47

The working hub on this page, ready for your own hours and numbers.

Call, text, WhatsApp and email in one corner button, or inline on a Contact page
"Open now", "Closing soon" or "Closed · opens Mon 8:00 AM" on your own time zone
Split hours, holidays and daylight saving; visitors elsewhere also see their own time
Email form sends each visitor's email and whether you were open to your form service

Buy the Full Floating Contact Hub — $47

Checkout and download are handled by Payhip.

Back to the FlowCraft catalogue to see the other components.