Rich Media Components
      Back to home
      1. Knowledge Base
      2. Building Ads
      3. Rich Media Components

      VPAID Player

      This article will teach you how to add a VPAID Tag to your ad unit.

      In this article, you will learn:

      How to Add a VPAID Tag to Your Ad Unit

      How to Add a VPAID Tag to Your Ad Unit

      There are two different ways to add a VPAID video player to an Adventive ad unit - Inserting a VPAID URL or by inserting a VPAID code snippet.

      1. In the Builder, Create a New File.
      2. Choose the ad format and dimensions of the ad unit you wish to add the VPAID tag to.  For guidance on building specific formats, check out this article.



      3. Click Submit.

       

      Insert a VPAID URL - VAST Video Component

      1. To Insert a VPAID URL, select the components icon component , Video Player > VAST Tag  from the left side menu:

        KB-VPAID
      2. A 300x250 video placeholder will appear on the canvas and a “VAST Tag” layer will appear at bottom of builder in Screens & Layers panel.

        KB-VPAID-Canvas
      3. With the placeholder selected, you’ll see the Video Component Properties appear, with VAST Tag selected, to the right of the Builder.


        KB-VPAID-Properties

      4. Paste the VPAID URL into the URL field:

        KB-VPAIDVAST
      5. The VAST Video should now appear on your canvas.
      6. Be sure to resize the player container if needed to avoid cutting off video content.
      7. Save and use the Ad Previewer to test positioning and size for best results.

       

       

      Insert a VPAID Code Snippet - HTML5 Import Component

      1. To insert a VPAID code snippet, select the components icon component , HTML5 Import from the left side menu:

        KB-Spotify-HTML5-Component

      2. With the placeholder selected, select Paste Snippet from the dropdown under the HTML5 Import Menu in the right side properties panel. Click Open Snippet Editor.

        Ad Builder - HTML5 Import Menu - Paste Snippet

      3. The code editor will open, here paste the VPAID code snippet.
      4. Your VPAID ad will load in the 300x250 frame.

        * Note - You can also test your tag for any errors with Google's Vast inspector:  https://developers.google.com/interactive-media-ads/docs/sdks/html5/vastinspector

        * Errors can occur when either the encoding or decoding of a URI was not successful. You should ensure that any special characters in your URI strings are encoded correctly.

      5. Move and resize the placeholder on your canvas by click/dragging or using the General Properties width and height to the right of the builder.
      6. Default clickthrough URLs will not override VPAID files, so you’ll want to add a Hitbox over the entire ad to ensure users can click through.
      7. If clickthrough data is already embedded in the tag, but you want to also track clicks in Adventive, OR overwrite the embedded URL, you'll need to add a Hitbox over the entire unit and add the default URL/Click Tracker as an Open URL Action.

        * Note - You will not need to extract the Impression tracker from the file/do not add under 3rd party tracking, as it will already be embedded in the tag, and to avoid counting twice.

      8. Save and use the Ad Previewer to test positioning and size for best results.