Embed a video with the Zype Player on your website Embed a video with the Zype Player on your website

Embed a video with the Zype Player on your website

 

Embed a video

mceclip0.png

From your admin panel, you can access the required code snippet to embed a video with the Zype player. To start, go to your video library and click on Embed & Publish tab. There you'll be able to configure the different settings for the video embed. Once configured, copy the embed code by clicking on the Copy to Clipboard button and then paste it in your website to embed the video.

Paywall (Subscription, Purchase, Rental, Registration)

Note: in the code examples where a subscription/rental/purchase is required, you can use the testing card 4242 4242 4242 4242 with any valid CVC number, any future date and any valid zip code. You can check here for more testing cards.

If the video you want to embed is premium, you must turn this option on so the player can verify that the user is allowed to view the content.

There are four different options for premium content:

1 - The video can require a registration

registracion_required.png

2 - The video can require a rental

rental_settings.png

See the Pen Rental required example by Zype Documentation (@zypedocumentation) on CodePen.

 

3 - The video can require a purchase

purchase.png

See the Pen Purchase required example by Zype Documentation (@zypedocumentation) on CodePen.

4 - The video can require a subscription

subscription.png

See the Pen Subscription required example by Zype Documentation (@zypedocumentation) on CodePen.

These options can be configured in the Monetization tab in the video details.

It's important to mention that activating any of these options without turning on the Paywall option in the Embed & Publish section will make the content accessible to anyone without requiring to pay for it.

The only exception is when the video requires a subscription but the Paywall option is turned off. In that case the video player will only display an explanatory message if the viewer doesn't have a subscription. But it won't give the options for the viewer to purchase a subscription (which is what happens if the Paywall option is turned on).

See the Pen Subscription message example by Zype Documentation (@zypedocumentation) on CodePen.

 

Selecting embed video format

Note: In order to be able to choose the format, the Paywall option must be turned off.

In the Embed & Publish section you can select the code snippet to be generated with an iframe or with javascript. You can see how the code at the right section changes accordingly as you click on any of these options. In both cases you have to click on the Copy To Clipboard button and then paste it on your website to embed the video.

Iframe Example

See the Pen Video Iframe Example by Zype Documentation (@zypedocumentation) on CodePen.

 

Javascript Example

See the Pen Player Javascript example by Zype Documentation (@zypedocumentation) on CodePen.

 

Autoplay Video

It's pretty simple to configure your video to autoplay. You just need to make sure that the Auto Play option is turned on - that's all!

See the Pen Autoplay example by Zype Documentation (@zypedocumentation) on CodePen.

 

Audio Only

If you want to only stream audio without video, make sure that the Audio Only option is turned on.

See the Pen Audio Only example by Zype Documentation (@zypedocumentation) on CodePen.

 

Disable Ad Timings

If you want to disable ads for a video embed, make sure that the Disable Ad Timings option is turned on.

 

Customize Size

Below the Disable Ad Timings section we have 2 numeric fields(width and height respectively) to manually set the size of the video. To modify the size, enter a width and/or height. Make sure to click outside the fields (or hit tab key) so the settings are updated accordingly.

There is also the option to Lock Aspect Radio. If turned on, the page will calculate the proper width every time you update the height (and vice versa) in order to keep the video aspect ratio.

 

Switching between Audio and Video

Important: This option is only available when the Paywall option is turned on.

If you want to let your viewers manually change from Audio only to Video at will, turn this option on.

 

Player Controls

Important: This option is only available when the selected embedded format is javascript.

If you want to hide the player controls in the video player, turn this option off.

See the Pen Hide Player controls by Zype Documentation (@zypedocumentation) on CodePen.

 

Loop

Important: This option is only available when the selected embedded format is javascript.

Turn this option on if you want your video to loop automatically.

See the Pen Loop Example by Zype Documentation (@zypedocumentation) on CodePen.

Was this article helpful?

0 out of 0 found this helpful