Embedding Videos to your site

This is a fairly simple yet crucial skill considering that we all will have to upload our projects from this course to our personal websites. Dreamweaver presents an easy way of adding video to your site by local source (meaning, you have the original video on your computer, you don’t have to embed it via a link to vimeo). I apologize for the ugliness of the site in my example photos. I created the code/site for the purpose of this blog post. I will continue refining the page on my actual website.

Below is the code I typed. Note that I set the size dimensions I added for the video so that it wasn’t taking up the whole page. You can alter these dimension according to your personal preference.


This code produces the following site:


So the video is there, but where are the controls?! How do I watch it? Don’t worry, Dreamweaver has a simple solution:


Next to the size dimensions you have typed, add: controls”controls”> Dreamweaver will automatically apply the control bar to the bottom of your video, complete with play, pause, replay, volume control, and full screen option:


See? Super easy.

The video I added is in mp4 format. Some browsers (such as firefox) do not recognize mp4 video content. In this case, you will need to use a file converter to convert your mp4 video to and ogv (an Ogg file) and include both in the code. It’s a little different.

I’ve been enjoying reading all of the awesome Dreamweaver posts from this blog so far. I’ll definitely be consulting them in the future! Thanks everyone.

Happy Mischief Night o_O



Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s