Do you want to display a videoask on your website? Embed a videoask directly in your page with an iframe using a little bit of HTML code so site visitors can view, interact, and submit responses without leaving your site.
If you're hoping to embed a videoask in the footer of your page or website, or to expand and collapse the videoask, learn how to embed a videoask widget.
Embed a videoask in your page
1. Log in to your VideoAsk account and select the videoask you want to embed. Click the Share & Embed icon.
2. Click Embed in a website.
3. The dropdown options should be set to Iframe.
4. If you want to change the height of your videoask, you can edit the number of pixels.
Note: The width of your iframe will automatically adjust based on the height you set. If you want to set a specific width, you can modify it directly in the code.
5. Click Copy embed code.
6. Go to your website builder and paste the code you just copied into your website editor (this part might vary depending on which website builder you use).
You can embed videoasks in almost any website, online store builder, or CMS, so long as it allows you to insert custom code or edit the HTML code of pages. There are, however, some requirements for your embedded videoask to work smoothly:
- Your site must be compatible with iframes.
- Your website must have a valid SSL certificate (using HTTPS://). If we cannot detect a valid SSL certificate, we will display a "Reply" button on your embedded videoask instead of the answer prompts you have selected. This button will open the videoask in a new tab to ensure responses are submitted over a secure connection.
- Make sure to use the embed code provided in the app. Camera and microphone permissions are included in it which are essential for respondents to be able to record answers. Attempting to embed your videoask without using the embed code above could result in the recording process failing.
Use these step-by-step instructions for your specific website builder or CMS:
Change the videoask layout
The default embed code generated in-app will display the videoask at 100% of the page width, as allowed by the page's styling and design.
There is a breakpoint built in at 1023 pixels that determines the layout of a videoask. If fewer than 1024 pixels are allowed, then a videoask will switch from split-screen view (with buttons displayed to the right of the videoask) to mobile view (with buttons stacked on top of the video).
If you want to force the mobile view for an iframe embedded videoask, change the width from 100% to a numerical value of less than 1024 pixels in the embed code.
💡 Tip: VideoAsk embed code contains your videoask URL. You can search for your videoask URL in your site code if you need to locate and remove the embed later.
I'm using 100% of the width and my embedded videoask is still showing a mobile layout. Why?
If you're using the default code but your videoask is still not showing a split-screen view, this is likely because of other design elements on your page or site constraining the width.
If your page has wide margins or sidebars, then there may not be enough space to display the video and buttons side by side.
Do embedded videoasks affect load time?
Because all the video content is hosted by us, embedded videoasks should not significantly affect the load speed of your site.
Load speed can, however, be affected by your geographic location when loading a videoask (ie relative proximity to our servers) as well as the method of embedding (iframe vs widget).
To test and compare this, please see our page load speed test.
Building your own app and want to use VideoAsk? Learn how to embed a videoask in a native app.
Embedding videoasks as an iframe will place the video in the midst of other content on your page, like this. ⤵️