Web Embeds

Introduction

Vouch Embeds provides the quickest and easiest way to showcase your best responses across your Digital Properties in just a few clicks.

Vouch offers eight Embed types for all users, Button, Card, Dialogue, Email, GIF, Inline Player, Jumbo and Popover. Further information around each embed type and how it can be configured within the Admin User Interface can be found on the Help Centre.

Embed Code

Vouch Embeds offer ways of adding an Embed to a website or application. The first, is via our Javascript Embed, which will render natively on the respective page / app it has been added. The second is oEmbed / iFrame (not supported on Popover) which will render as an iFrame, even using a traditional iFrame code, or using oEmbed.

The structure for each of these Embed types is listed below:

Javascript Embed

<script
  type="module"
  crossorigin="anonymous"
  referrerpolicy="no-referrer"
  src="https://cdn.jsdelivr.net/npm/@vouchfor/uikit/embed/vouch-embed-all.bundle.js"
></script>

<vouch-embed-{{embedtype}}-player
  apikey="{{apikey}}"
  vouchid="{{vouchid}}"
/>

oEmbed / iFrame

https://app.vouchfor.com/embed/{{vouchid}}/{{embedtype}}?apikey={{apikey}}

Both Embed types can support additional configuration parameters, which are listed below.

Parameters

Vouch Embeds have been built in a manner so brands can manipulate the design of their respective Embeds without needing to log into the Vouch Platform.

Required

ParameterDescriptionExpected Value
embedtypeThe Embed type layout you wish to render.One of: button, card, dialogue, inline-player, jumbo, thumbnail, popover
vouchidHash ID of Vouch, Upload, Recording or Playlist.10 digit hash for respective video (eg. 4aLbmxveLp)
apikeyAPI Key specific to the Vouch space.61 character API Key

Optional

ParametersDescriptionExpected Value
shownameShow Customer NameTrue / False
showlogoShow Organisation Name + LogoTrue / False
showcaptionShow Captions in EmbedTrue / False
showcontrolShow controls in EmbedTrue / False
answeronlyShow only answers (Only applies to Inline)True / False
autoplayAutoplay EmbedTrue / False
autoplaynextAutoplay going to next videoTrue / False
questionsDecide what question(s) to show in EmbedString (eg. 1,4,5)
orientationLayout of the EmbedOne of: portrait, square, landscape
responsiveLayout of Embed (overwrites Orientation).True / False
displaynameOverwrite the Customer Name valueTrue / False
fitcoverCrop & Centre the content.True / False