We'll look at two ways to add videos:
Embedding them into your page from YouTube
Embedding a video file that you upload to the server
First find the video you want to embed on YouTube
Then click on the Share button:
Then select the first option "embed" from the list:
Then click the "copy" button to copy the embed HTML code:
Paste that code into your HTML page:
<iframe width="560" height="315" src="https://www.youtube.com/embed/IvUU8joBb1Q" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
The "iframe" is the tag that YouTube uses to handle video files. You don't need any additional code for this to work. You may want to adjust the width or height of your image to fit the design of your page though!
Use Secure Copy to upload your video from your computer to the web server:
scp file.mov username@to_host:/remote/directory
In our case it would look something like this:
scp /Users/dcool/Desktop/fingers.mov pi@100.11.81.217:/var/www/html
I had my file on my desktop. To get the file path right, just type "scp", put a space, and then drag and drop the file you want to transfer into the terminal, it will automatically insert that correct path on a Mac OS computer! :-)
Now you can add the video to your webpage with the video tag:
<video width="320" height="240" controls>
<source src="fingers.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>