How to embed a youtube playlist on your blogger blog
In this tutorial, you will learn how to create a YouTube video gallery with jQuery and add a Youtube playlist to your Blogger blog. In this gallery/playlist, you can add your favorite YouTube videos or any video you want to share with your visitors. Due to its default size (765 pixels wide), it is recommended to add it just below the blog header; however, you can edit the CSS code to fit where you want to add it.
To add this video slider or YouTube playlist to your blog, follow these steps:
Step 1: In the Blogger toolbar, select " Template " > " Edit HTML " and click anywhere in the code area to open the Blogger search box by pressing CTRL+F.
Step 2: Glue or Glue tag in the search box and hit enter to find it.
Just above this tag, add the following scripts:
Step 3 Now let's add the CSS code. a little bigger than him tag, add this code:
Step 4. Click the " Save Template " button.
To make this YouTube playlist work, we need to add its HTML structure:
Step 5: Navigate to the Layout or Pages section or wherever you want to add it and add the following code to the HTML area (if you want to add it as a widget, paste the code in the gadget HTML/Javascript by clicking on Add device "). link in "Layout/Page Elements"):
Add video IDs where video_ID _... is specified, titles ( video title ) and a short description ( description ). To get the video ID, open a YouTube video and look at the address bar; you just need the last characters after " v= "
Note that each video ID must be added twice: red for videos and orange for map tiles.
To add more videos, add two lines like the ones in bold above, then change the video number [] and #vid.... If you decide to add it to a post or page, make sure not to return to " Create " and do not publish your article while it is still in the HTML tab; otherwise the #vid location will be replaced with other weird Blogger URLs.
To add this video slider or YouTube playlist to your blog, follow these steps:
Step 1: In the Blogger toolbar, select " Template " > " Edit HTML " and click anywhere in the code area to open the Blogger search box by pressing CTRL+F.
Step 2: Glue or Glue tag in the search box and hit enter to find it.
Just above this tag, add the following scripts:
Step 3 Now let's add the CSS code. a little bigger than him tag, add this code:
Step 4. Click the " Save Template " button.
To make this YouTube playlist work, we need to add its HTML structure:
Step 5: Navigate to the Layout or Pages section or wherever you want to add it and add the following code to the HTML area (if you want to add it as a widget, paste the code in the gadget HTML/Javascript by clicking on Add device "). link in "Layout/Page Elements"):
- #view1">
video_ID_1 /default.jpg "class="thumb-vid"/> Video Title Video Description
- #view2">
- #view3">
- #view4">
- #view5">
video_ID_1 /default.jpg "class="thumb-vid"/> Video Add video IDs where video_ID _... is specified, titles ( video title ) and a short description ( description ). To get the video ID, open a YouTube video and look at the address bar; you just need the last characters after " v= "
Note that each video ID must be added twice: red for videos and orange for map tiles.
To add more videos, add two lines like the ones in bold above, then change the video number [] and #vid.... If you decide to add it to a post or page, make sure not to return to " Create " and do not publish your article while it is still in the HTML tab; otherwise the #vid location will be replaced with other weird Blogger URLs.
