The Wistia extension for Webflow lets you browse your Wistia library and add videos to your site without leaving the Webflow Designer. Connect your account, find a video or Channel, and insert it onto the canvas with one click. Videos are displayed with the full Wistia player, including SEO value and engagement analytics—no embed code needed.
Connect to Wistia in Webflow
To get started, open a new or existing Webflow site.
In the Webflow Designer, search for and open the Wistia extension.
Click "Connect Wistia".
Sign in on the Wistia page that opens to authorize the integration.
Tip
If you don't have a Wistia account yet, create one when prompted, verify your email address, then return to Webflow and refresh. Once you're signed in, the extension opens straight to your library.
Install the Wistia for Webflow app
In addition to connecting the integration directly from the Webflow Designer, you can also install the Wistia for Webflow app from the Webflow Marketplace: https://webflow.com/apps/detail/wistia
On the Wistia app page, click "Install App" to authorize and connect the integration.
Once installed, you can open the Wistia extension from the "Apps" tab in the Designer.
Find a video or Channel
When you're connected, the extension opens the chooser, where you pick what to add:
Folders — your collections of individual videos.
Channels — your Wistia Channels, which work like playlists.
Use the search bar at the top to search across your library by title, description, transcript, and tags.
Upload a video from Webflow
You can also add a video to your Wistia library without leaving the Webflow Designer:
Open a folder in the chooser and click "Upload here".
Select a video from your device to upload to the folder.
The uploaded video appears in the folder, ready to insert.
Insert a video
In the chooser, click into the video you want to open its details.
On the canvas, select the element where the video should go.
Click "Insert." You may need to scroll down in the extension modal to access that option.
Wistia adds the video to the selected element as a standard Webflow video block. It comes in as a responsive, ad-free Wistia player that scales to fit its container across screen sizes.
From a video's details pane, the following options are also available:
Copy URL — copy the video's URL.
View in Wistia — open the video in Wistia to customize it.
Player styles from Webflow variables
When you insert a video, the extension automatically applies a short list of Webflow variable overrides to the player, if you've set them:
Player color
Player color corner rounding
Caption colors
Fonts
To customize anything beyond these, click "View in Wistia" and adjust the video in your Wistia account. For more information on variables, refer to Webflow's documentation.
Insert a Channel
In the chooser, open the "Channels" tab and select a Channel.
On the canvas, select the element where the Channel should go.
Click "Insert."
Channels are added with a custom embed rather than the native video element. Webflow variable overrides don't apply to Channels — to change a Channel's styling, click "View in Wistia" and customize the Channel embed there.
Publishing and keeping videos up to date
Publish your Webflow site as usual, and your embedded videos and Channels will load and play on the live page.
Because each embed is a true Wistia embed, you don't need to re-embed when you make changes in Wistia. Update a video or Channel in your Wistia account and your Webflow site keeps pointing to the same player. Every play also feeds into your Wistia analytics, so views from your Webflow site show up alongside the rest of your video data.