MosaicGlobe - Your free artist portfolio website, blog and art directory

Embedding YouTube videos into your MosaicGlobe website

Upload Video
To embed your own video in your MosaicGlobe website you will first need to create an account with YouTube; then upload your video. Once you do this you will have access to the code needed to embed your video on your MosaicGlobe website. (note: the video will not be available right away as it take a while to convert the file for web use)

The code will look something like this:
<object width="425" height="350"> <param name="movie" value="http://www.youtube.com/v/hTOZ_UqtRMo"> </param> <embed src="http://www.youtube.com/v/hTOZ_UqtRMo" type="application/x-shockwave-flash" width="425" height="350"> </embed> </object>

(TIP: To copy the code; highlight all the text and select menu: edit - copy or ctrl+c (mac: apple+c))

Embed Video
Now you want to embed this code into your MosaicGlobe website. Log into your account and navigate to the page or blog post you want to embed the video into. Into order to paste the code into a page you need to switch to 'source code' view. Do this by clicking the View Source Code button;   . This is the HTML code for your page. Paste the YouTube code in the desired location. For this page we placed the code before this paragraph.

(TIP: To paste the code; place your cursor in the location you want the code to begin and select menu: edit - paste or ctrl + v (mac: apple+v))

Advanced Placement
On this page we wanted the video to float on the right side with the text flowing around it. To do so, try adding this around your YouTube code.
<div style="padding: 5px; float: right;">YouTube code</div>
This will float your video to the left and text will flow around it to the right - just like this page! (change to float:left to reverse it.) Also, we decided to reduce the size of the video so it didn't take up so much room on the page. When doing this, it is important to retain the correct ratio. For this page we changed width="425" height="350" to width="300" height="247" (Note: you have to change these numbers in two locations within the code).

There are 0 Comments for Tutorial: YouTube

Add A Comment

Name:

Email:

URL:

Message:

Performing Spam Check