Can a webpage change based on what's happening in a video?
Yes. ReelFlow's own documentation showcases this exact pattern - the video Player and the surrounding page reacting to each other in real time. The mechanism runs through the Player API: as a visitor clicks an Action Button inside a Flow, an actionButton:click event fires that your page's JavaScript can listen for, and that event can trigger any content change - swapping text, revealing a stat, changing an image, or more. It's driven by the visitor's interaction with buttons timed to specific moments in the video, not automatic real-time speech detection.
What's the mechanism behind this?
ReelFlow Flows are built from Steps, each with its own Action Buttons tied to what's being covered in the video at that moment. When a visitor clicks one of those buttons, the Player fires an actionButton:click event carrying the button's ID, label, and index. Custom JavaScript on your page listens for that event and decides what to do with it, including changing something elsewhere on the page.
Is this available without writing code?
No. Unlike opening the video from a button, which is a no-code, link-based feature, reacting to what happens inside the video needs a developer to write a small listener script. The Player API supplies the event; what the page does with it is custom to your site.
Does ReelFlow literally listen to what's said in the video?
Not in the sense of real-time speech recognition. The reaction is tied to Action Buttons, which are placed at specific points in the Flow to correspond with what's being said or shown at that moment. When a visitor clicks one of those buttons, that's the trigger, not the audio itself.
What kinds of page reactions are possible?
- Swap text or headlines elsewhere on the page.
- Reveal a stat or callout tied to what the visitor just clicked into.
- Change an image to match the selected path.
- Switch to a different Flow entirely, in the same spot on the page.
- Open a connected chat tool and hide the Player to clear space.
Where can you see this documented?
ReelFlow's own Player API examples showcase this exact use case, alongside related patterns like running multiple Overlay Flows on one page and switching Inline Flows together with surrounding content.
FAQ
Does this work with Inline Flows as well as Overlay?
Yes - the same event-driven approach works for both Player types.
Do I need a developer to set this up?
Yes. This is a Player API feature, distinct from ReelFlow's no-code button-trigger feature.
Is this the same as making a button open the video player?
No. Opening the player from a button is link-based and no-code. Making the page react to what happens inside the video runs in the other direction and requires a small JavaScript listener.
Can this trigger things outside the page, like a CRM or analytics tool?
Yes - the same event can fire custom events in third-party tools, not just change content on the page itself.
Related questions
Syncing content to a video comes down to one event: actionButton:click. Using the Player API, you get a Flow instance, listen for that event, and write custom JavaScript that runs whenever a specific button is clicked, updating text, images, or any other element on the page at that moment. The sync happens at each click, in step with wherever the visitor is in the Flow.
Yes - with a caveat on how automatic it is. Text and images can update at specific moments during a video, triggered by a visitor clicking an Action Button inside the Flow. That click fires an actionButton:click event through the Player API, and custom JavaScript listening for it can swap text, change an image, or reveal new content the instant it happens. It isn't a continuous, frame-by-frame read of the video - the update points are tied to wherever Action Buttons are placed in the Flow.
The interaction runs in both directions. A button, link, or image on the page can open, close, or switch the video using ReelFlow's reserved link values or the Player API. Going the other way, clicking an Action Button inside the video can fire a JavaScript event your page listens for, letting it update text, images, or other content in response. Together, these two directions let the page and the video genuinely react to each other.
Yes - with an important detail on how it works. The trigger isn't ReelFlow listening to the audio itself; it's an Action Button placed at the moment something specific is being said, which the visitor clicks. That click fires an actionButton:click event through the Player API, and custom JavaScript listening for it can reveal a stat, quote, or callout anywhere on the page the instant it happens.
The more interesting uses go beyond a single video playing once. Branching Flows let a visitor choose their own path through short reels rather than watch one long video. The page and video can react to each other in real time, revealing stats or swapping content as a visitor clicks through. Several Flows can run as a spotlight across different sections of one page, video interactions can launch a chat tool directly, and engagement data can flow into a CRM via UTM attribution. Together, these turn video from a passive asset into a working part of the page.
See your page and video work together
ReelFlow's Player API lets your page react in real time to what a visitor does inside a video Flow - swap content, reveal stats, or switch what's playing.