How to embed a video on your page

Add videos to your public website or members-only course pages easily

ShinePages Support

Last Update 8 maanden geleden


Adding a video to any page is simple with ShinePages.


Option 1:

Grab the "Video" Widget under the Widgets Menu (the second icon down on the left-hand side with a Plus Sign (+) is the Widgets Menu) and drag it onto the page where you would like.


Then grab the "share link" from your video hosting platform (Vimeo, YouTube, Muse.ai, etc.) and paste it into the "Video Source" field. You can also copy and paste the "embed code" link vs. the "share link" into this box.


Option 2:

If the video widget is not uploading your video correctly - you can try the "Code or Embed" widget instead. Drag the widgets onto the page and instead of pasting in your "share link" - paste in the "embed code" snippet that you can grab from your video hosting platform. You will paste this into the "black box" area that will pop up once you add the Code widget to the page.


Set the widget settings using the gear icon in the widget's menu.


NOTE: While ShinePages can host image files, PDF files, font files, and audio files in our "File Manager" - we do not currently offer video hosting although we do plan to add it in the future.  


As stated above, you can embed videos to play directly on your pages using sources like YouTube, Vimeo, Wistia, Muse.ai, and others using the Video widget or the Code or Embed widgets.


Using a video hosting service is preferred for several reasons. Having the videos on a separate dedicated hosting platform means we can keep our costs down while ensuring your sites render quickly and aren't slowed down by a huge load of video files.


It also helps to ensure that wherever your visitors view it, the video is encoded, compressed, and viewable on a wide variety of screens and browsers across the world.


In other words - your site will run faster, your pages will load quicker and your videos will be more widely viewable when hosted on a video hosting platform. :)


Note: YouTube will show other videos at the end of your video.  Paid services like Vimeo or Muse.ai will not. 


A NOTE ABOUT AUTO-PLAY ON VIDEOS: 

Recently - most browsers have limited (or completely stopped) the ability to "auto-play" videos with sound embedded onto websites. You CAN embed and "auto-play" videos as the "background" of a Block - however they will not work if the volume is above 0 for these "background" videos.   


Videos embedded on your page via a video widget will not "auto-play" when using the standard YouTube "share code".  It is not considered good web-design practice to "auto-play" videos with sound on your site as a general rule. 


However if you wish, you CAN set videos to auto-play by using the Code widget instead of the Video widget and pasting an edited version of the code snippet below into that Code widget. Here's how: 


Edit the following code with YOUR unique video ID (replace the XXXXXXXXX with YOUR video ID) and then PASTE this code snippet into the CODE widget you've dragged onto your page: 


<iframe width="560" height="315" src="https://www.youtube.com/embed/XXXXXXXXX?si=lLbIC6GnZ1O7QALQ&autoplay=1" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>


(Note - again - you will need to replace the XXXXXXX above with the numbers and letters that make up YOUR video's unique ID code before you paste this code into the Code widget.  You can find this video ID number in the URL bar of your browser when watching the video on YouTube. See image below.  In this example - I would replace the XXXXXXX in the code snippet above with the string of numbers after the "=" symbol in the URL - so the full string of numbers that looks like: G0xxxxzew would replace the XXXXXXXX numbers in the code snippet.) 


Was this article helpful?

1 out of 1 liked this article

Still need help? Message Us