Adding Youtube Playlist Using JW Player to Blogger
Adding Jw Player to blogger
1. Adding Script to Blogger Template
With this tutorial, it very simple and easy way for somebody who is about video blogging.
Now, let see the following step:
1. Go to Blogger Dashboard >> Template >> Edit Template
2. Click anywhere inside the code area >> press "Ctrl + F" on your keyboard to open the search box
3. Inside the search box past this </head> tags and hit Enter to find it.
4. Just above the </head> past the following code.
<script src='http://jwpsrv.com/library/o3BeDjJfEeKT8yIACp8kUw.js'/>
<script src='https://dl.dropboxusercontent.com/s/1sbu88nx2qddejf/jw6-touchscroll.min.js'/>
<script src='http://www.dev.powered-by-haiku.co.uk/jw-html-config/jwplayer/v6/jwplayer.js' type='text/javascript'/>
<script src='http://www.dev.powered-by-haiku.co.uk/jw-html-config/jwplayer/jwplayer-html-config.min.js' type='text/javascript'/>
<script src='http://p.jwpcdn.com/6/5/jwplayer.js?ver=3.8.1' type='text/javascript'/>
<script src='http://powered-by-haiku.co.uk/wp-includes/js/jquery/jquery.js?ver=1.10.2' type='text/javascript'/>
<script src='http://powered-by-haiku.co.uk/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.2.1' type='text/javascript'/>
<script type='text/javascript'>
if (window.jstiming) window.jstiming.load.tick('headEnd');
</script>
<script src='https://dl.dropboxusercontent.com/s/1sbu88nx2qddejf/jw6-touchscroll.min.js'/>
<script src='http://www.dev.powered-by-haiku.co.uk/jw-html-config/jwplayer/v6/jwplayer.js' type='text/javascript'/>
<script src='http://www.dev.powered-by-haiku.co.uk/jw-html-config/jwplayer/jwplayer-html-config.min.js' type='text/javascript'/>
<script src='http://p.jwpcdn.com/6/5/jwplayer.js?ver=3.8.1' type='text/javascript'/>
<script src='http://powered-by-haiku.co.uk/wp-includes/js/jquery/jquery.js?ver=1.10.2' type='text/javascript'/>
<script src='http://powered-by-haiku.co.uk/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.2.1' type='text/javascript'/>
<script type='text/javascript'>
if (window.jstiming) window.jstiming.load.tick('headEnd');
</script>
5. Save Template
2. Adding JavaSript to specific Post/Page
Now you add the following script to the specific post/page you want to:
1. Go to blogger dashboard and create a new post/page for your video
2. Tab to the"HTML" area and past the following script:
<div id="playerSpuurExoMyae">
</div>
<script type="text/javascript">
jwplayer('playerSpuurExoMyae').setup({ playlist: [
{"file": "https://www.youtube.com/watch?v=76yuTxhp-hQ","title": "249.Short Question and Answer [Ven San Sochea]","description": "","image": "http://i.ytimg.com/vi/76yuTxhp-hQ/0.jpg"},
{"file": "https://www.youtube.com/watch?v=_AUqp0fLyVE","title": "244.Short Question and Answer [Ven San Sochea] ","description": "","image": "http://i.ytimg.com/vi/FcLXb0yb3Sw/0.jpg"},
],
listbar: {position: 'bottom',size: 200},
width: '100%',
aspectratio: '16:9',
skin: 'beelden',
});var jwp = jwplayer(playerSpuurExoMyae);
jwtube.patch(jwp);
</script>
Note: 1- You just change youtube video ID in the red color, Video ID is the last character of youtube URL like (v=XXXXXX)</div>
<script type="text/javascript">
jwplayer('playerSpuurExoMyae').setup({ playlist: [
{"file": "https://www.youtube.com/watch?v=76yuTxhp-hQ","title": "249.Short Question and Answer [Ven San Sochea]","description": "","image": "http://i.ytimg.com/vi/76yuTxhp-hQ/0.jpg"},
{"file": "https://www.youtube.com/watch?v=_AUqp0fLyVE","title": "244.Short Question and Answer [Ven San Sochea] ","description": "","image": "http://i.ytimg.com/vi/FcLXb0yb3Sw/0.jpg"},
],
listbar: {position: 'bottom',size: 200},
width: '100%',
aspectratio: '16:9',
skin: 'beelden',
});var jwp = jwplayer(playerSpuurExoMyae);
jwtube.patch(jwp);
</script>
2- For the green color add the same video ID for the thumbnail.
3- If you want to change the position of your video list just choose one of this ( 'right', 'left', 'bottom')
4-If you want to add more videos on a list, just copy the hold script where it say "file":xxxx. Make sure you add video ID to both side "at the red color and green color".
I hope that this tutorail will fully help you. If you still have any questions, please feel free to contact me or write your comment. Don't foreget to subscribe and like facebook page to recieve every post on this site.
Adding Youtube Playlist Using JW Player to Blogger
Reviewed by Unknown
on
3/10/2015 08:35:00 PM
Rating:
hello bro can you tell why code not full screen ? when we press full screen button....thank q bro
ReplyDeleteGreat Blog Thanks
ReplyDeletehttp://youlearningonline.blogspot.com/
There are certainly a lot of details like that to take into consideration. That is a great point to bring up. I offer the thoughts above as general inspiration but clearly there are questions like the one you bring up where the most important thing will be working in honest good faith. I don?t know if best practices have emerged around things like that, but I am sure that your job is clearly identified as a fair game. Both boys and girls feel the impact of just a moment?s pleasure, for the rest of their lives.
ReplyDeletevlc media player download
Efficiently written information. It will be profitable to anybody who utilizes it, counting me. Keep up the good work. For certain I will review out more posts day in and day out. youtube seo
ReplyDelete