With Hippo Video, you can embed videos in two ways.
Inline Embed - Helps play the video directly on the webpage i.e. inline with your content.
Popover Embed - Helps play the video over the content on the webpage i.e. the video plays in a popup window when you click on the thumbnail.
Advantages of using:
Inline Embed:
Set video size
Set the video to be responsive (resize accordingly)
Update SEO metadata (Search engine indexing)
Popover Embed:
Occupies less space in the webpage
Attracts the customer to explore the video (blurs the background)
Update SEO metadata (Search engine indexing)
To embed a video as inline/popover:
Login to Hippo Video with your existing credentials.
You can either record a new video or embed an existing one.
Note: Click here to learn how to record a video.
Click on the Assets icon from the left navigation bar > All Assets > select the video of your choice.
On the right side of the video preview, click on Share/Embed Code icon.
From the Embed drop-down, select Inline Embed/Popover Embed.
Inline Embed:
 |
By default, the video size will be set as 720.
Select Custom Size, to set the height and width of your choice.
Select Responsive, to render well on a variety of devices and windows or screen sizes, whether it is a desktop, a laptop, a tablet, or a mobile phone.
Check Use oEmbed URL box, to embed the video in Wordpress (this is applicable only for Wordpress).
Note: To paste the oEmbed URL in Wordpress, please click here.
Check Push video metadata to the page for all search engines to index box, to index your videos in SEO during search (any search engine).
Once you’re done, click COPY CODE and navigate to the appropriate webpage.
Now, paste the copied code in the desired HTML editor of the webpage i.e. in the backend.
You will notice that the video gets pasted in the webpage along with your content.
Now, the video will play directly on the webpage where it’s embedded.
You can always enter the full screen mode by clicking at the bottom of the player and press Esc button from your keyboard, to exit full screen mode.
Popover Embed:
 |
Thumbnail - Set width and height & check Responsive (to make the video get resized automatically based on your webpage space availability).
Text - Enter the text to refer to this video.
Once you’re done, click COPY CODE and navigate to the appropriate webpage.
Now, paste the copied code in the desired HTML editor of the webpage i.e. in the backend.
You will notice that the video gets pasted in the webpage as a thumbnail image along with the content.
Now, the video will play within the pop-up box.
Then, click on the top-right corner of the pop-up box, to exit/close.
To learn how to add an in-video meeting link.
*****************************************************************************
FAQ:
Why my CTA link is not working on my website?
When you embed a video with an iframe on your website, the specific script tag will be removed automatically and because of that Hippo Video gets access only to that iframe. This restricts the meeting link (CTA) to show on the full screen or in some cases, the CTA button may not work. To fix this issue, you need to add the below scripts to your website page which enables Hippo Video to make the CTA show in full screen.
<script>window.hippoEmbedSeo = "9bd30585-873b-475a-baac-5142c3d9ac14.json";</script><script src="https://hippo-embed-scripts.s3.amazonaws.com/video-delivery-embed.js" async></script><script>window._hippo_cx_domain = "https://www.yourhippovideosubdomain.io";var hippo_script=document.createElement("script");hippo_script.src="https://hippo-embed-scripts.s3.amazonaws.com/video-embed-mh.js";document.body.appendChild(hippo_script);</script>
Note: Please change the “_hippo_cx_domain in the below code if you use subdomain or customdomain in hippovideo”. e.g https://example.hippovideo.io
If the same issue occurs, please contact us at support@hippovideo.io
To check out other topics related to this topic.
