1. Help Center
  2. Get Started with Firework
  3. Upload Short Videos into Firework and Embed

Embed Videos on Your Webpage

Learn how to generate an HTML tag to embed a video widget on your website.

When you are ready to add video content to your website, you’ll generate an HTML code tag that you can easily copy and paste. You identify where on your page you want the content to live, and then paste the code into the content block that you’ve selected. 

Looking to embed videos using Shopify? Please visit the instructions here.

Looking to embed dynamically to a product page? See here.

To embed a video on your webpage:

  1. In the Business Portal, click into the playlist you would like to add. 
  2. Click on the "Add to Site" button in the top-right corner of the page.
  3. Select your playlist layout. There are five different playlist layouts for you to choose from. 

    Embed playlist v2

  4. Click the Copy Code button.
  5. Embed the HTML code on the webpage by pasting it. 

5 Layout Choices

Story Blocks, Grids, and Carousels are designed to be plugged into the body of your website. They are a static part of the page and can be scrolled past by the visitor. You can learn more about customizing a Story Block here.

Grids and Carousels can continue to be played in Picture-In-Picture mode while the user continues browsing your webpage(s).

The Floating Player is usually plugged into the header or the body of your website. It floats on top of other content and continues playing in the corner of the screen  scrolls with the visitor. 

Story Block: This is a static content block. It will display one video on just a portion of your webpage and can be scrolled past. When one video is complete, the next video in the playlist will play. Customize the background to transparent by adding an additional line of code

Screen Shot 2023-01-12 at 5.39.24 PM
Floating Player: This is a small video screen that is located at the bottom-right corner of the page and will float with the page as the user scrolls. Clicking elsewhere on the webpage will return the playlist videos into a Picture-In-Picture view.

Screen Shot 2023-01-12 at 5.40.04 PM
Grid: Click on a video to enlarge the player and allow the user to scroll left or right through the videos in the playlist. When minimized, the video player will float in the corner of the screen. You can select which corner you want the video to float in.

Screen Shot 2023-01-12 at 5.46.04 PM-1

Carousel: Fixed videos scroll left-to-right. Selecting a video will enlarge the video player. When minimized, the video player will float to a corner of the screen. You can select which corner you want the video to float in. 

Screen Shot 2023-01-12 at 5.45.26 PM
Hero Unit: The Hero Unit is a full-screen view that features a Story Block on the left side of the screen and interactive text, including Call to Actions, on the right. See Enable a Hero Unit to learn more about this livestream specific layout. 

Screen Shot 2023-01-12 at 5.45.44 PM