YouTube is a popular service for sharing video files on the internet.
Rather than uploading video to your NeatClubs.COM site, It probably makes sense to place your videos on YouTube, and then reference them from your website. This is because YouTube has better bandwidth and streaming delivery capability.
From the perspective of a site visitor, they won't know the difference.
The steps involved in embedding YouTube content are listed below:
| 1. | Obtain a YouTube account - You can visit YouTube.COM to get a free account |
| 2. | Upload your Video (or Videos) to YouTube |
| 3. | Create a document in NeatClubs.COM that you would like to embed your video into. |
| 4. | In the editor, click your mouse in the location where you'll want to insert the YouTube video. After this your should click the "Source" tab at the bottom of the HTML editor as shown below. This is necessary since we need to embed the reference to YouTube as HTML source. |
5. Next, in a separate browser window or Tab, with the editor still open, navigate to YouTube.COM and login in.
Follow the instructions under http://www.youtube.com/sharing - Use the "Embeddable Player" option to copy the should fragment of HTML generated by YouTube to your clipboard
6. Next ,Return to the NeatClubs.COM editor and paste the HTML into the NeatClubs editor (make sure that the "Source" tab is selected)
7. Click the "Design" Tab in the NeatClubs.COM editor. You should see the embedded video as shown below.
8. You can right-click on the video element above to access the media properties. In the media properties you can control settings such as the distance between the embedded video element and surrounding text. Notice that the NeatClubs.COM editor recognizes You Tube Video as a file type and behaves accordingly.
9. Once you make any changes, click apply to save these properties. Make sure you then Save the document.
The next time you view the document or web-page your should see the YouTube video embedded.
Tips & Tricks related to YouTube embedded content
Making Content Auto-Play on load
At an autoplay=1 directive to the line cut and pasted from YouTube. The text to add is shown in red below.
<center>
<embed src="http://www.youtube.com/v/6Pxg5ondQeQ&hl=en&fs=1&autoplay=1"
type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true"
width="560" height="340"></embed>
</center>
Avoiding the problem where Menus appear behind YouTube videos
Unfortunately the default HTML generated by YouTube is such that embedded content appears in front of other content. This is a well known issue with YouTube.
There is a work-around that works for most browsers, but unfortunately it means hand-coding your own HTML.
The fix involves adding an addition <param> tag and adding an argument to the embed tag. The changes necessary to correct the issue are highlighted below.
YouTube may address this issue in future, but at the time of this writing it is still a problem.
Apple iPhones and iPads unfortunately exhibit this problem regardless of the "fix" below although Safari functions properly on desktop computers.
<object width="640" height="385"><param name="WMode" value="transparent"></param><param name="movie" value="http://www.youtube.com/v/tq1tzCypvII?fs=1&amp;hl=en_US"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/tq1tzCypvII?fs=1&amp;hl=en_US" wmode="transparent" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="640" height="385"></embed></object>"><object width="640" height="385"><embed style="width: 411px; height: 230px" height="230" type="application/x-shockwave-flash" width="411" src="http://www.youtube.com/v/tq1tzCypvII?fs=1&hl=en_US" allowfullscreen="true" allowscriptaccess="always"></embed></object>