FlowCraft Floating Contact Hub
Call, text, WhatsApp and email behind one friendly button, with opening hours that are always right, with no monthly fee.
The FlowCraft Floating Contact Hub is built with HTML, Tailwind CSS (via CDN) and vanilla JavaScript:
- One round corner button opens call, text, WhatsApp and email buttons
- "Open now", "Closing soon" or "Closed ยท opens Mon 8:00 AM", worked out on YOUR business's time zone, not the visitor's
- Visitors in other time zones also see their own time: "(3:00 PM your time)"
- Split hours (closed for lunch), holidays and daylight saving handled automatically
- After hours, buttons stay with helpful notes ("leave a voicemail", "we'll reply when we open"), or hide the ones you choose
- Opening hours list with today highlighted
- Floating corner button, or inline on a Contact page
- Any link can open it with data-hub-open
- Never shows a wrong "Open now": if the hours can't be read, it shows "Contact us" and keeps every button working
- Accessible: labelled buttons, Esc to close, focus moves in and back out
A small form ("Prefer we contact you?") sends each visitor's email, whether you were open and when you next open to your form service (Formspree, Make, Zapier or your own webhook).
WHAT'S INCLUDED
- index.html: a sample page with the hub, your hours, the four contact buttons and the email form
- app.js: all the logic, heavily commented
- style.css: the corner button, panel, status dot, inline layout and hours list
- assets/images/: a sample header illustration
- README.txt: setup, hours and time zones, the contact links, layouts and testing tips, plus an optional .htaccess for Apache/Hostinger
The sample business, phone number (a fictional 555-01xx number) and email are placeholders: replace them with your own.
Try the live demo: https://haveinsights.com/flowcraft/contact-hub/
License: use and modify in unlimited personal and client projects. Resale or redistribution is not permitted.