1. Help Center
  2. Business Portal 101
  3. Player Embed Guidance and Sharing

Displaying a Dynamic Carousel on a Product Detail Page

Learn how to enhance your Product Detail Page (PDP) with the Dynamic Carousel

We will eventually leverage a choice from the HTML layout selector. This is the current method today. 

How to Embed a Dynamic Carousel

  1. From the Firework Business Portal, navigate to the playlist that you want to display on your PDP.
  2. Click the Add to Site button in the top right corner of the Videos page.
  3. Next, select the Carousel option and then proceed to Copy Code.  (Note: This player display works only for carousel)
  4. Next, paste the HTML code to your desired section on your PDP. We recommend directly underneath the main product image or under the right hand side of the details. 
    1. If on Shopify, use the custom liquid option to paste this code.
  5. To showcase the video as a PDP carousal, simply include thumbnail_style="dynamic" in the HTML code. As written in the example below:
    <script async type="text/javascript" src="//asset.fwcdn3.com/js/embed-feed.js"></script> 

    <fw-embed-feed channel="firework_depot"
    playlist="5aZ0jo"
    mode="row"
    open_in="default"
    max_videos="0"
    placement="middle"
    player_placement="bottom-right"
    thumbnail_style="dynamic"    

    ></fw-embed-feed> 

Note:

  • Images display as a static posters that go full screen when clicked on.
  • The Dynamic Carousal will display based on the width of the browser window being used to view it.