Sometimes videos are the easy way to express your thoughts to the visitors instead of writing lengthy content. It can be a how-to tutorial, introduction of your company or anything else. Adding videos in Weebly site is also easy similar to adding audio and text content. There are four ways to add videos in Weebly site as listed below and we will discuss each option in detail.
1. Using HTML5 Video Tag on Weebly Site
HTML5 video tags allow you to host your own videos on default video player. You don’t need to buy Weebly premium plan in order to use HTML5 video player element. You can use video links from other websites or upload your videos under “Theme > Assets” section. It is recommended to add .mp4, .ogv and .webm format videos to overcome browser compatibility issue.
Drag and drop an “Embed Code” element on the page you want to show your video. Paste the below HTML code inside “Embed Code” element. Ensure to replace the video links with your own.
<video poster="https://img.webnots.com/2015/06/Slider-3.jpg" width="640" height="480" preload controls loop> <source src="https://img.webnots.com/2015/06/Slider-Video.mp4"> <source src="https://img.webnots.com/2015/06/Slider-Video.webm"> <source src="https://img.webnots.com/2015/06/Slider-Video.ogv"> </video>
The video will look like below requires manual play and supported by all modern browsers like Chrome, Firefox, Safari and Edge.
2. Video Embedding Using YouTube Element
YouTube is the popular video hosting platform from Google and Weebly offers default YouTube element to embed videos easily. YouTube element is available in Weebly editor under “Media” category. You can drag and drop the element any place on the content area.
Once the element is added on the content area, just click on it to see customizing options. You can add the YouTube video URL, set the alignment and spacing of video.
You also can add or change video ID in the advanced options and change the size of your video to fit within your content.
You can play the video inside the editor and publish your site to check the real streaming on browser.
3. Video Embedding Using Custom HTML
Similar to HTML5 video tags, you can also use “Embed Code” element to insert the iframe video code from YouTube, Vimeo or any other video hosting sites offering iframe embed code.
- Copy the embed code from any sites like YouTube or Vimeo.
- Drag and drop “Embed Code” element in your site’s content area.
- Paste the HTML embed code inside the element and publish your site.
4. Using Weebly Pro HD Video Player Element
The last option is to upgrade your Weebly site to a premium plan and use HD video player element. This is similar to the HTML5 video player but offered as a default element. High Definition (HD) Video Player is one of the key Weebly Pro feature which allows user to upload up to 1GB size of video file on their websites. This is a must feature if you are hosting a video site which requires unlimited video uploads.
4.1. Features of Weebly Pro HD Video Player
- 1GB Video File Size
- Unlimited number of Videos
- Auto HD Conversion
- Unbranded – You can upload videos with your own brand
- Supports all standard formats
- Various Video Sizes
- In Page Video Playing – Video can be played inside Weebly editor without publishing your site.
- Option to choose whether the video can be downloaded by the user or not.
- Adjust the size, margins and position of the video to align with your content.
4.2. Process of Video Uploading to Weebly Site
- Simply Drag and Drop the HD Video icon to your webpage
- Click on the image “Click here to Upload a video” and select the video you want to upload
- Once the video is uploaded it will be automatically encoded
- Choose the size of your video
- Play the video in page without publishing and check the clarity
- Publish your site
4.3. Video Controls
Following video control options are available during the play of the video as shown in the below picture:
- Play or Pause button
- Current time and the total video time
- Seek bar to go to any place in the video
- Volume control
- Full screen mode
By selecting the check box “Video Downloadable” you can make the video downloadable by the user.
The video control will shown an option for downloading the video as shown in the picture below.
Well, HD Video player is one of the main attraction in the Weebly Pro pack but there are simple requirements hopefully Weebly will accommodate in near future.
- Video player is a mere player, you can’t record video from USB camera
- You can’t convert your photos in to you a video
- No possibility to generate embed coding
- Social sharing icons are not available to share the video URL
- Video view statistics not available – you will not know the popularity of your video or how many people viewed it
- No playlist option available, this means only one video can be uploaded and viewed
Even if you upload a wonderful video in your Weebly site, there is no way the users can embed your videos in their site. Worst part is that the video can’t be shared in any social media which means a loss of inbound links to your site and hence the traffic and the search engine ranking. At the same time, this protects the copyright of the owners especially if you are running an online store selling licensed videos.
Weebly Free Vs Pro Video Player
Free video embedding has the following advantages over uploading using pro HD video player element.
- Low page loading time which gives a good user experience in slower internet connections.
- Reduced crawling issues for search engine crawlers due to less page size.
- Overall site size will increase considerably with uploaded video size hence site backup will take longer time to download all your content.
- Embedded videos can easily be shared in social media which will increase the popularity of your site.
- Uploading needs you to create or own your videos, but for embedding you can embed any videos available with free distribution license.