Top
Embed a video hosted on Google Drive in a Pop-up
  • 04 Apr 2024
  • 4 Minutes To Read
  • Dark
    Light
  • PDF

Embed a video hosted on Google Drive in a Pop-up

  • Dark
    Light
  • PDF

Article Summary

Whatfix enables you to embed Google Drive videos to any Pop-up template to deliver more information to your users. The video can be embedded in the description section. For more information on Whatfix Pop-up templates, see Choose the Pop-up template.

To add a video hosted on Google Drive to your Pop-up, use one of the following two ways:

Embed a Google Drive video using the Existing Templates

Adding Google Drive video in a Pop-up is a 2-step process.

Step 1: Get the video embed code
Step 2: Insert the video embed code in the Pop-up

Use the following steps to add a video hosted on Google Drive:

Step 1: Get the video embed code

  1. Go to the video on Google Drive and open it.

  2. On the top right, click the More icon.
    clm_google drive_elipses

  3. Click Open in new window.
    clm_google drive_open in new window

  4. On the new window, on the top right, click the More icon, and then click Embed item.
    clm_google drive_embed

  5. Copy the embed code and click OK.
    Clm_google drive_embed link

Step 2: Insert the video embed code in the Pop-up

  1. On the Whatfix Guidance dashboard, click Widgets.
    ia_left_nav_widgets

  2. Click Pop-ups.
    ia_widget_popups

  3. Hover your cursor over the Pop-up segment you want to configure, and then click the Edit icon.
    Edit_popup_DB

  4. In the Description section, place the cursor where you want to add the video and double-click to open the Rich Text Editor.
    RTE_Popup

  5. Click the Insert Video icon.
    Click_insert_videoicon

  1. Paste the embed code.
    studio_GD_embed_code

  2. Click Insert.
    studio_GD_embed_code_insert

  3. Once the video is added, click Set Visibility Rules →.
    studio_pop_up_VR

  4. Set the visibility rules for the Pop-up to appear. For more information on the different conditions that can be used in Visibility rules, see Visibility Rules.

  5. Click Edit Pop-up or Finish later depending on your preference.
    Studio_pop-up_finish later or edit

OR

Embed the Google Drive video using the Visual Editor

Adding Google Drive video in a Pop-up is a 2-step process.

Step 1: Upload the video to your Dashboard
Step 2: Insert the video in the Pop-up Visual Editor

Use the following steps to add a video hosted on Google Drive:

Step 1 : Upload the video to your Dashboard

Download the Google Drive video

  1. Go to the video on Google Drive and open it.

  2. On the top right, click the Download icon.
    Click_download_icon

  3. The video is downloaded to your local drive.

Upload the video to your Dashboard

  1. On the Whatfix Guidance dashboard, click Content.
    ia_left_nav_content

  2. Click All content.
    ia_dashboard_left_nav_all_content

  3. Go to the Draft stage.
    CLM_DB_Draft_stage.png

  4. Click Create content.
    CLM_DB_CreateContent.png

Note

You can view the Create content button only in the Draft stage of the dashboard.

  1. Click Video.
    clm_db_content_video

  2. On the Video Pop-up, enter the Title.
    video_link_title

  3. Drag and drop the video from your local drive or click Browse to select the video from your library.

    Upload_video_CLM

  4. Add search keywords and tags to your video link if needed.
    tags_keywords

  5. Click Save video.
    save_video

Note
  • You can view the video content that you just created in the Draft Stage of the Dashboard.
    clm_db_video_dashboard

  • A link is generated for the video uploaded from your local drive or library. You can find this link inside the video content you created on the Dashboard and then insert it in your Flows, Smart Tips, Pop-ups, and other Whatfix content.
    2022-08-09_16-56-14

  • The video you create is stored in the Whatfix cloud.

  1. Click Copy Link to copy the video link.
    Click_Copylink

Step 2: Insert the video in the Pop-up Visual Editor

your title goes here
  • Visual Editor is a Beta feature. To enable the feature, contact support@whatfix.com.
  • Once you enable the Visual Editor, you won’t be able to go back to the old experience.
  • Once the Visual Editor is enabled, Pop-ups can only be created using Whatfix Studio, and not using the Dashboard.
  • After creating Pop-ups using the Visual Editor, you can edit them using the Dashboard.
  • Pop-ups that are not created using the Visual Editor cannot be customized further but their visibility rules can be edited.

Note:
  • If the Pop-up is shown in a secure webpage (https) and if the video is hosted on a non-secure website (http), then the video is displayed as a broken link to the end users.

The Visual Editor enables you to add a video to the Pop-up template directly using the UI.

Use the following steps to embed a video URL in a Pop-up using the Visual Editor:

  1. On the Whatfix Guidance dashboard, click Widgets.
    ia_left_nav_widgets

  2. Click Pop-ups.
    ia_widget_popups

  1. Hover your cursor over the Pop-up segment you want to configure, and then click the Edit icon.
    Edit_popup_DB

  2. In the Description section, double-click the text to open the Rich Text Editor.
    RTE_add_video

  3. Click the + icon. The Add Component dialog box opens.
    Add_component_RTE

  4. On the Add Component dialog box, click Video.
    Click_Video_Addcomponent

  5. Paste the video link.
    CLM_Visual Editor

  6. Click Insert.
    image.png

your title goes here
  • Using the Drag and Drop feature, you can move or re-position the video around the Pop-up.

  • Using the Drag Handlers the video can be moved/re-positioned both vertically (column-wise) and horizontally (row-wise).

    video_dnd

your title goes here

When you make changes to the Pop-up using the Drag Handlers, you may not be able to undo certain changes. In that case, you may need to re-create the Pop-up. For more information, see Can I undo the changes made with the Drag Handlers?

  1. Once the video is added, click Set Visibility Rules →.
    studio_pop_up_VR

  2. Set the visibility rules for the Pop-up to appear. For more information on the different conditions that can be used in Visibility rules, see Visibility Rules.

  3. Click Edit Pop-up or Finish later depending on your preference.
    Studio_pop-up_finish later or edit

  4. Once you have set Visibility Rules, select the Pop-up using the checkbox, and then click Send to ready.
    clm_db_send_to_ready

  5. Go to the Ready stage, and then click Push to production.
    clm_db_push_to_production


Was this article helpful?

Changing your password will log you out immediately. Use the new password to log back in.
First name must have atleast 2 characters. Numbers and special characters are not allowed.
Last name must have atleast 1 characters. Numbers and special characters are not allowed.
Enter a valid email
Enter a valid password
Your profile has been successfully updated.