HubL Reference

Table of contents
Close

How to add videos to dynamic pages in HubDB

A dynamic website page is a CMS page whose content changes based on the path of the URL requested by an end user. HubDB already allows you to store, filter, and display data in your HubSpot website pages. Multilevel dynamic pages takes this concept further, allowing you to create up five levels of pages within one dynamic template.

Each dynamic page includes its own unique, SEO-friendly URL, and offers page-specific analytics. You can reference more detailed HubDB documentation here.

  • A HubSpot account with the $300 Website Add-On
    • Portals with Website Starter or without the Website Add-On do not support HubDB
    • You can check if your portal has the $300 Website Add-On by signing in here.
  • Some prior knowledge of HubSpot's CMS, HTML and HubL

Please note that this tutorial assumes you already have multiple HubDB tables created. Please see the HubDB documentation if you are unfamiliar with HubDB or want to create your first HubDB tables.

1. Add a 'VIDEO' column to your table.

Navigate to HubDB in your HubSpot portal, and edit the table you would like to be a parent of other tables. Click 'Add new column' and create a column with type 'VIDEO'.

Screen Shot 2019-01-10 at 2.50.13 PM

2. Select videos for each row.

You can now add a video to your row by clicking the 'choose' button in the video column.

Screen Shot 2019-01-10 at 2.52.00 PM

Selecting a video will store the video `player_id` as the column value in the row. The file thumbnail is used to visually represent the video in the UI.

Screen Shot 2019-01-10 at 2.52.54 PM

 

3. Add the video player widget to your dynamic template.

You can now reference the row data in your dynamic template to build a 'video_player' widget.

{% if dynamic_page_hubdb_row %}
  {% video_player "embed_player" player_id="{{dynamic_page_hubdb_row.video}}" %}
{% endif %}