How to display YouTube videos

We've integrated the YouTube API directly into the uSkinned Site Builder for Umbraco. There are plenty of places you can place YouTube videos and all it takes is to copy and paste the video URL.

Get your YouTube URL

Step 1

Go to any video on YouTube. 

Step 2

In the browser bar, copy the YouTube URL.

Step 3

Log in to the uSkinned Site Builder CMS.

Step 4

Create or go to any page.

Step 5

At the label, Main Content, click to 'Add content'.

We'll now show you the various ways you can auto-display YouTube videos with uSkinned for Umbraco.

Using the Gallery Component

Step 1

In the slide-out panel, select 'Gallery'.

Step 2

At the label, 'Image/Video', click 'Add content'.

Step 3

From the options provided, click on 'Single Video'.

Step 4

At the label, 'Video source', select the 'YouTube' icon. A new field will appear below called 'Video', please paste the YouTube URL into this field.

Step 5

At the label, 'Image', please use the image picker to select a placeholder image for your video. 

We use a placeholder image for your YouTube video so that they do not autoload during page load — this is a great saving for page speed that will enhance your search engine ranking.

Step 6

Click 'Submit' in the bottom right and then 'Save and publish' the page to show the Video on the frontend. 

Please note, you can use the 'Settings' options to adjust how the video displays on the frontend.

More ways to display YouTube videos

There are a variety of places you can paste a YouTube URL to automatically display them on your uSkinned Site Builder website.

You can try this out using the same steps for:

— Banner component
— Split component
— Pod component
— Windows component
— Global pods
— Extra Content pods
— Footer pods

#h5yr