Donald Hessing

How to add YouTube movies with the Content Editor Web Part in SharePoint 2010

During the Microsoft SharePoint Connections 2010 in Amsterdam someone from the audience came with the question ”how to add a YouTube movie to a publishing page in SharePoint 2010”. According to the attendee, the content editor corrects or filters  the html / object tag inside the rich text editor of a YouTube movie. So back at home, I tried to figure this out. You can add a YouTube movie to a page by adding the embed tag of the movie. For example

<object width="425" height="344"><param name="movie" value="http://www.youtube.com/v/GgHoxwESqtI&hl=nl_NL&fs=1&"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/GgHoxwESqtI&hl=nl_NL&fs=1&" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="344"></embed></object>

My first try was to paste the HTML by going to the HTML editor mode. You can do this by selecting the content editor web part and go to HTML à Edit HTML Source. By pasting the embed tag for the YouTube movie, the YouTube movie appeared in the page. However, after doing several page edits / check-in / publishing etc, the YouTube movie didn’t show up anymore. After investigating the HTML, it looks liked the content editor encoded parts of the inserted HTML. This makes sense, in order to comply to the XHTML rules.

In my search for disabling the encoding behavior of the content editor, I found a new property in the property pane of the web part called Content Link. By setting the Content Link property to a document which is uploaded to your SharePoint site, the Content Link property will load the content and insert that inside the content of the Content Editor web part.

So what I did is the following. I created a text file with the embedded html for the YouTube movie and uploaded that to the document library of the site. I then configured the Content Link property in the web part panel (go to edit properties of the rich text editor web part) to “/documents/youtube.txt” (use test link before click apply). After that, the content editor web part loads the content of the file and shows the YouTube movie. It turns out that this content is not encoded anymore after edit, check in – publish actions J

 

Comments

Dave said:

Thanks for posting this note about using YouTube with MOSS.

As an implementation, it works; although it's not ideal (c'mon MOSS Team, support YouTube in CWPs!), it's better than not at all, or having to pay for a commercial WP to make it happen.

Again: thanks!

--Dave

# February 12, 2010 4:50 PM

uberVU - social comments said:

This post was mentioned on Twitter by whatsonamstrdam: How to add YouTube movies with the Content Editor Web Part in...: ...in Amsterdam someone from the audience came w... http://bit.ly/8Hiz7c

# February 19, 2010 1:48 PM

Tom Resing said:

Well done. Too bad this isn't supported OOTB, but this is an easy workaround.

# May 17, 2010 4:45 AM

me said:

Yes, this does work, but so does working with the source editor as far as I can tell. The only annoying thing is that when you are in a secure environment (https), I keep getting an annoying security warning. Have you found a way around this yet? Everything I have tried doesn't work. All posts say to change every link within the code to https but all that does is break the link as it's not a secure link and obviously can't find a secure link on a non secure server!

Cheers,

me

# May 20, 2010 1:31 AM
Leave a Comment

(required) 

(required) 

(optional)

(required) 


Please add 4 and 4 and type the answer here: