[Tips] - Hướng dẫn tích hợp AncPlayer cho Blogspot

AncPlayer là trình chơi nhạc hay xem phim cho blogspot cực kỳ chuyên nghiệp mà bất kỳ blog phim hay nhạc đều phải có, thường thì các bạn tải những templates blogspot được tích hợp sẵn chức năng AncPlayer này mà không biết làm sao để thêm vào blog cá nhân của mình. Hôm nay mình sẽ hướng dẫn các bạn tích hợp AncPlayer vào blogspot với phiên bản mới nhất đó là AncPlayer 5.5

DEMO

Cách tích hợp AncPlayer vào Blogspot

1. Đăng nhập vào Blogger

Vào phần quản trị Blogger > Mẫu > Chỉnh sửa HTML.
 tìm đến thẻ

<data:post.body/>

Thường là có hai thẻ giống thế này, bạn tìm đến thẻ thứ hai nhé. Và thay thẻ này bằng đoạn code sau : 

<div id="anc_pl"></div> <!-- Hiện thị player -->
<div id="anc_tp"></div> <!-- Hiện thị server phim -->
<div id="anc_data"><data:post.body/></div> <!-- Noi dung bài viết trang item -->
<script type='text/javascript'>//<![CDATA[
// AncPlayer.Com - Plugins hỗ trợ player video Blogspot và Wordpress
// Hiện Player có gắn ADS ở top hoặc bottom để duy trì VPS và Gkplugins
// Truy cập http://www.ancplayer.com để được hướng dẫn viết mã hóa link
// Để thêm Server thuộc hệ thống GKplguisn các bạn thêm link ở list_sv và tên hiện thị ở ten_sv
// var img_player = document.querySelectorAll('#anc_data img')[0].src
var ancplayer = {
load:{
'width' : '100%',
'height' : '420px',
'player' : 'http://svvn.ancplayer.com/player.swf',
'proxy' : 'http://svvn.ancplayer.com/gkplugins/proxy.swf',
'skin' : 'http://svvn.ancplayer.com/skin/skewd/skewd.xml',
'getlink' : 'http://svvn.ancplayer.com/get', // Link get Player Mobile: Picasa, Zing, NCT, Plus, Xvideos
'imgload' : 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9nafRoVRl2VCXlU8jSjxj-dRlYXTY3qkhvMLJ0tkzW7WpHm5ZN6uVpfIjghj5iNamrFF9WF6tozTNsB2WqYk3ov6it13d5JZQFSni-Pqq6RhVfw_0t8SjvRxQ5xs9u0TxhW9RGtFPbDI/s1600/logo.png', // Autoload image num 1 change: "+img_player+"
'autoplay' : 'true', // true or false
'embedplay' : '1', // 1 or 0 // 1 = autoplay
'site' : 'AncPlayer.com'
},sv:{
'list_sv': 'youtube.com,anc.you,anc.yl,anc.mp4,anc.flv,picasaweb.google.com,anc.ps,anc.tm,plus.google.com,docs.google.com,drive.google.com,tv.zing.vn/video,tv.zing.vn/embed/video,tv.zing.vn/html5/video,tv.zing.vn/html5/movie,nhaccuatui.com,dailymotion.com,xvideos.com,goo.gl,clip.vn,meme.vn,googlevideo.com,zippyshare.com,videobam.com,fptplay.net,novamov.com,24video.net,movshare.net,veoh.com,blip.tv,sendspace.com,speedyshare.com,tunescoop.com,viddler.com,vimeo.com,vidxden.com,xhamster.com,truongxua.vn',
'ten_sv': 'Youtube: ,VIP: ,Gdata: ,Sever Mp4: ,Sever Flv: ,Picasa: ,Picasa2: ,Picasa3: ,Plus: ,Docs: ,Drive: ,Zing: ,Zing 2: ,Zing MB: ,Zing EP: ,NCT: ,Daily: ,Xvideos: ,Goo: ,Clip: ,Meme: ,Google: ,Zippy: ,Videobam: ,Fptplay: ,Novamov: ,24Video: ,Movshare: ,Veoh: ,Bliptv: ,Sendspace: ,Speedyshare: ,Tunescoop: ,Viddler: ,Vimeo: ,Vidxden: ,Xhamster: ,Truongxua: '
}}
//]]></script>
<script src='http://svvn.ancplayer.com/ancplayer/ads-pc-bot-55.js' type='text/javascript'></script>
<link href='http://vjs.zencdn.net/4.12/video-js.css' media='screen' rel='stylesheet'/>
<script src='http://vjs.zencdn.net/4.12/video.js' type='text/javascript'></script>
<!--
ADS PC TOP: http://svvn.ancplayer.com/ancplayer/ads-pc-top-55.js
ADS pc BOTTOM: http://svvn.ancplayer.com/ancplayer/ads-pc-bot-55.js
ADS MOBILE TOP: http://svvn.ancplayer.com/ancplayer/ads-mb-top-55.js
ADS MOBILE BOTTOM: http://svvn.ancplayer.com/ancplayer/ads-mb-bot-55.js
-->

2. Thêm Css

Tìm đến thẻ ]]></b:skin> và thêm đoạn css dưới bên trên thẻ này

id{font-size:0px;display:none;width:0;height:0;}
#logoplayer {background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9nafRoVRl2VCXlU8jSjxj-dRlYXTY3qkhvMLJ0tkzW7WpHm5ZN6uVpfIjghj5iNamrFF9WF6tozTNsB2WqYk3ov6it13d5JZQFSni-Pqq6RhVfw_0t8SjvRxQ5xs9u0TxhW9RGtFPbDI/s1600/logo.png) no-repeat;float:right;display:inline-block;position:absolute;width:220px;height:60px;filter:alpha(opacity=45);opacity:.45;}
#anc_tp {background:#FAFAFA;border:1px solid #0095B3;border-radius:5px;padding:5px 0;overflow:hidden;position:relative;width:99%;float:left;}
#list_tap{display:inline-block;line-height:16px;width:auto;padding:0 7px;}
#list_tap ul{list-style:none;margin:0;padding:0;clear:both;}
#list_tap ul li{float:left;margin-right:10px;font-weight:700;font-size:12px;text-align:left;}
#list_tap ul li.sev{color:#702526;background:url(http://lh4.googleusercontent.com/-iy4-GBSe6Yg/U48Fzxa1RmI/AAAAAAAAQr8/pngFU0ajvxk/s1600/server.png) no-repeat scroll 0 0 transparent;display:inline-block;float:left;height:16px;margin-right:5px;margin-top:4px;padding-left:23px;}
.a_tap {background:none repeat scroll 0 0 #151515;color:#F9F9F9;display:inline-block;min-width:20px;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;text-align:center;margin:2px 0;padding:2px 3px;text-decoration:none}
.tap_active, .a_tap:hover{background:#0295F6;color:#fff;display:inline-block;min-width:20px;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;text-align:center;margin:2px 0;padding:2px 3px;text-decoration:none}
.sv_active{color:#0095B3;background: url(http://lh4.googleusercontent.com/-iy4-GBSe6Yg/U48Fzxa1RmI/AAAAAAAAQr8/pngFU0ajvxk/s1600/server.png) no-repeat scroll 0 0 transparent;display:inline-block;float:left;height:16px;margin-right:5px;margin-top:4px;padding-left:23px;}

 Đây là mẫu AncPlayer free nhưng khá đẹp nên AncPlayer đề nghị để nguyên quảng cáo để có chi phí cho các bạn sài free. Mình thì mình không xóa nhưng nếu các bạn có nghề thì cứ tự nhiên nhé.

AncPlayer tích hợp lấy video và nhạc từ rất nhiều sever như trong đoạn code ở bước 1 ghi rất rõ và bay giờ các bạn đăng video hay nhạc thì các bạn đăng với cú pháp sau:

[id] link video [/id]

Hoặc các bạn muốn đăng video youtube có luôn thumbnail không cần phải chèn thêm ảnh thì chèn code như sau

[id]https://www.youtube.com/watch?v=mikfm5cofVE[/id]<img border="0" class="anhancmedia" src="http://i2.ytimg.com/vi/mikfm5cofVE/mqdefault.jpg" height="0" width="0" />

Nếu các bạn làm blog phim mà phim của bạn có nhiều tập thì post như sau :

<id>Tập;Link video|</id> hoặc [id]Tập;Link video|[/id]

Ví dụ : 

<id>Full;https://www.youtube.com/watch?v=R43zsh66KEE|</id>

Như vậy thì ở khung tập server khi này sẽ hiện thị : Youtube : Full 

<id>Tập 01;https://www.youtube.com/watch?v=R43zsh66KEE|Tập 02;https://www.youtube.com/watch?v=nfWlot6h_JM|</id>

Ở khung tập server khi này sẽ hiện thị : Youtube : Tập 01 Tập 02

Chúc các bạn thành công nhé, mọi thắc mắc có thể comments bên dưới để được trợ giúp :D

Bài Viết Cùng Chủ Đề

• Auto readmore 3 column không dùng js cho blogspotTiếp tục share mẫu auto readmore không dùng js (javascripts) cho các bạn muốn blog load nhanh nhưng vẫn đẹp. Hôm bữa mì ...
• [Tips] - Thủ thuật khống chế css và js mặc định của blogspotCss mặc định của blog là những css khi bạn search với PageSpeed Insights  thì nó sẽ báo chặn hiển thị trên bl ...
• [Tips] - Làm sao để title, description, keywords cho mỗi trang khác nhau Chào các bạn nói đến title, description, keywords thì chắc ai cũng biết nếu làm blog, đối với seo thì chúng ta có rất ...
• [Tips] - Tự thiết kế blogspot chuẩn W3C/HTML5W3C là từ viết tắt của World Wide Web Consortium, là nhiệm vụ hướng dẫn World Wide Web với đầy đủ các tiềm năng phát tr ...
• Chuyển hướng link trong blogpsot (Redirect 301)Chuyển hướng link hay còn gọi là thủ thuật seo Redirect 301. Ứng dụng khi dùng Redirect 301 cho Seoer: Đó là khi muốn c ...