Flowstar Open Hours Widget

How to integrate the Flowstar Open Hours Widget with Webflow

Businesses need to display accurate operating hours to visitors across time zones without building custom solutions or maintaining code. The Flowstar Open Hours Widget automatically handles time zone conversion and updates across all pages where it appears.

Flowstar integrates with Webflow exclusively through the Flowstar app in the native Apps marketplace. Let us take a look at the method in detail:

Use the Flowstar app

The Flowstar Open Hours Widget app installs directly from the Webflow Apps marketplace and requires Owner or Admin permissions. After installation, the widget appears in the Apps panel with configuration options. This method works for displaying standard business hours, seasonal schedule changes, and multi-location availability windows without requiring any code changes.

Navigate to the Flowstar marketplace page, click Add to site, select target Workspaces or sites, authorize required permissions, and follow in-app setup instructions.

To install the widget, follow these steps:

• Visit the Flowstar app listing and click Add to site
• Select Workspaces and sites for installation
• Authorize app permissions for site data, custom code, and publishing
• Open your site in Webflow
• Click the Puzzle icon to access the Apps panel
• Launch Flowstar from the installed apps list
• Configure hours, display format, and styling through the interface

The widget includes the following configuration options:

• Three display formats that let you choose between list view, pop-up modal, or teaser bar presentation
• Automatic timezone detection that adjusts hours based on visitor location without manual setup
• Time format selection that supports both 12-hour and 24-hour notation
• Language localization that offers customizable day formats and translations
• Styling customization that matches brand aesthetics through built-in controls
• Mobile optimization that provides responsive behavior across device sizes

To configure the widget after installation, open your site in Webflow, click the Puzzle icon to access the Apps panel, locate Flowstar in the installed apps list, and click Launch to open the configuration interface. You can configure your business hours settings, display formats, time zone preferences, and styling options directly through the app's interface without any code edits.

To remove the app, open the Apps panel, click the installed app, select Remove app, navigate to Workspace or Site settings, and click Uninstall app (Workspace) or Revoke (Site) in the Apps & integrations tab. Elements added by apps remain on sites after removal, but custom code is removed on the next publish. You'll need to delete app elements manually.

What you can build

Integrating Flowstar with Webflow lets you display timezone-aware business hours across static and CMS-driven pages with centralized configuration that propagates updates site-wide.

• Multi-location hours pages: Build location pages for retail chains or multi-office service businesses where each location shows accurate local hours to visitors worldwide.
• Seasonal schedule displays: Create hospitality sites where hours vary by tourist season, holidays, or special events.
• Client-managed business hours: Create agency deliverables where non-technical clients can update their own business hours without ongoing developer support.
• Service appointment schedulers: Design consultation-based business sites where potential clients see real-time availability windows before booking appointments, reducing scheduling conflicts and timezone confusion.