Embedding a video

You can embed videos from Facebook, YouTube, Vimeo, and other platforms on your website. There are multiple benefits for video embedding — your site loads faster, visitors can share your videos, and you enjoy more options to control video playback. That’s why there is no need to upload a video directly.

Before you begin

Before you start embedding a video on your page, you should upload the video to a video hosting platform.

Add a video to the block

  1. Choose the place on your page where you want to add the video. Click the + button.
  1. Choose one of the following blocks that have embeddable video elements: Cover, About, or Video

Adding_videos_to_your_page_02__purple_.png

You can match the color of the block to your existing block color or choose a contrasting scheme.

 

3. Hover over the demo video to activate the menu. Click on the iFrame settings icon:

Screen_Shot_2020-08-28_at_16.31.36.png

 

4. In the Iframe settings menu, choose the way to add your video. This depends on what kind of code you have. Some video platforms will provide you with an embeddable piece of code, and others will provide an URL. This tutorial covers both ways.

 

5. In the Embed URL tab, paste the URL of your third-party content:

Screen_Shot_2020-08-28_at_16.36.11.png

Click Submit.

 

6. To embed your content manually, select Embed Code:

Screen_Shot_2020-08-28_at_16.38.02.png

Click Submit.

You can also choose the Allow Full Screen option to enable viewing in full-screen format.

Congratulations! Your video has been added to the page. The video will start playing after you Publish the site:

Screen_Shot_2020-08-28_at_16.40.09.png

 

Embedding a Facebook video 

To share a video from Facebook on your website, you can embed it.  When you embed a video, the video player starts immediately. Here are the steps to accomplish this:
  1. Open Facebook on a computer.
  2. Go to the video you want to embed.
  3. Click  and select Copy Link:

    facebook_1.png

    Keep in mind that you will only see this option if the video's audience is set to Public.

  4. Paste the link in a word editor, such as Notepad, and keep it handy.
  5. Add a Video block where you want your video to appear.
  6. Hover over the demo video and click the IFrame settings icon on the Control Pane:
    facebook_2.png

  7. In the Embed URL tab, paste in the URL of the video that you copied from Facebook.

    facebook_3.png
  8. Click Submit.

Important: If you embed a video and the audience of the video changes to any other option than Public, a message saying the embedded video is no longer available will appear on your website.

Embedding a Vimeo video

You can add a video using an embed code from a third-party service. Here's how you can embed a video using Vimeo as an example:

To get a Vimeo embed code:

  1. Click the Share button directly below the video you’d like to embed on your site.

Screen_Shot_2019-09-13_at_14.57.10.png

  1. Locate the Embed code.

    Screen_Shot_2019-09-13_at_15.01.41.png

  2. Click + Show Options on the right-hand side of the Embed section. Select Responsive within the Size option.

    Screen_Shot_2019-09-13_at_15.05.39.png

  3. Customize the rest of the options to your preference.

  4. Go up and copy the code inside the Embed box. Make sure to copy only the portion of code between <iframe...> and </iframe>. It should look like this:

<iframe src="https://player.vimeo.com/video/359281775" style="position:absolute;top:0;left:0;width:100%;height:100%;" frameborder="0" allow="autoplay; fullscreen" allowfullscreen></iframe>

Embedding a video from Odysee

You can embed a video from the Odysee video platform by embedding the iFrame code. Follow these steps:

1. On Odysee, locate the video you want to embed to your Yola page and click on it.

2. Click the Share button on the video page:

Screenshot_2021-05-31_at_18.14.22.png

3. In the pop-up window, click the "links" button:

Screenshot_2021-05-31_at_18.16.47.png

4. Next, click the Embed this content button:

Screenshot_2021-05-31_at_18.18.12.png

5. In the next window, copy the embeddable code or click Copy:

Screenshot_2021-05-31_at_18.20.03.png

6. Go back to the Sitebuilder and paste the link into the field in the Embed code tab:

Screenshot_2021-05-31_at_18.22.52.png

7. Click Submit. The video will appear on your page.

8. To make the changes live, publish your website.

 

Other helpful articles

Was this article helpful?
0 out of 0 found this helpful