Tích hợp AncPlay Media Player cho Blogspot

Bài viết này bên Blog Fandung.com,Chip đã mong đợi từ lâu,hôm nay Chip mượn tạm bên anh Dũng post chia  sẻ cho những bạn yêu thích Blogspot?



Trước kia khi muốn nhúng 1 đoạn video nào đó vào blog ta thường quen với việc nhúng code của nó mà server đó cung cấp. Nếu muốn nhúng nhiều video khác nhau thì ta lại dán 1 đoạn code khác nhau. Và nếu bài viết nào đó phải nhúng nhiều đoạn video vào thì sao? ví dụ 20 video chẳng hạn, nếu ta dùng cách thủ công là chèn tất cả 20 đoạn code của 20 video vào thì cũng được, nhưng như thế trông bài viết sẽ dài lê thê, và cũng không chuyên nghiệp lắm.




Tiện ích Ancplay hôm nay mình giới thiệu sẽ giúp các bạn khắc phục vấn đề trên.Ancplay được phát triển bởi Suzuki_aka, nó cho phép người xem dễ dàng xem nhiều video khác nhau trên bài viết của bạn. Hay nói dễ hiểu hơn nó giống như 1 trình xem video đơn giản, với 1 phần hiển thị video và 1 phần hiển thị danh sách các video. Các bạn chỉ việc click vào danh sách các video và xem. Hiện tại tiện ích hỗ trợ xem video từ các server : youtube.com, videobb.com, clip.vn, cyworld.vn, video.zing.vn, stream.pub.vn, dailymotion.com, videozer.com, 4shared.com, 2shared.com.

                                                                   Xem DEMO

Sau đây là các bước chèn tiện ích vào blog :
1. Vào trong code template (không cần nhấp mở rộng mẫu tiện ích), sau đó chèn đoạn code bên dưới vào trước thẻ đóng </body>
, các bạn có thể chèn ở vị trí khác cũng được, nhưng bắt buộc phải chèn sau tiện ích Blog1 (phần hiển thị bài viết) :


<script src='http://fandung.googlecode.com/svn/trunk/js/ancplay-mp.js' type='text/javascript'/>
<script type='text/javascript'>

//<![CDATA[

M.pl(M.re("Blog1"),"anc_pl","anc_tp");



var anc_ida = M.re("Blog1").split('|')[0].split(';')[1]; 

$_("anc_content").innerHTML = $_("anc_nd").innerHTML;



var player_id = "player"; 

var player_width = 640; 

var player_height = 420;

var player_stream = ""+anc_ida+"";
var params = {allowFullScreen: true, scale: 'scale', allowScriptAccess: 'always'};
var attributes = {id: player_id, name: player_id};
var player_dvrMinutes = 30; 
swfobject.embedSWF('http://cdn.octoshape.net/resources/player/infinitehd/player1.swf', player_id, player_width, 

player_height, "10.0.0", null, null, params, attributes); 

function Rload(x){
player_stream = ""+x+"";
swfobject.embedSWF('http://cdn.octoshape.net/resources/player/infinitehd/player1.swf', player_id, player_width, 

player_height, "10.0.0", null, null, params, attributes);
swfobject.addDomLoadEvent(fixReference);
}
//]]>
</script>


Update (30/11/2011) : đã fix code javascript, do 1 số template không có thẻ div có id là wrap2, nên mình đã sửa wrap2 thành Blog1 là ổn nhất.


2. Save template lại.

Như vậy đã xong bước chèn tiện ích vào blog. bây giờ mình giới thiệu qua cách post bài viết.
Để trình xem video hiển thị được, bắt buộc bài viết của bạn phải tuân theo mẫu bên dưới :


{Một vài thông tin về video - vị trí 1 }


<div align="center" id="anc_pl"></div>

<div id="anc_tp"></div>



<div id="anc_content"></div>



{Một vài thông tin về video - vị trí 2 }



[id]1;link video 1|2;link video 2|[/id]

- Thông tin về video các bạn có thể đặt ở vị trí 1 hoặc 2 tùy thích. Tùy vào cách bố trí bài viết của các bạn, hoặc có thể sử dụng đồng thời 2 vị trí cùng 1 lúc cũng được.
- phần code màu tím là code bắt buộc có trong bài viết.
- Sau đây là hướng dẫn chèn link video vào bài viết. Như trong đoạn code trên ta thấy, chèn link vào bài viết có dạng như bên dưới :


[id]1;link video1|2;link video2|[/id]

- Ví dụ ta có 2 link từ youtube và 2 link từ dailymotion và code mẫu như bên dưới :


[id]1;link youtube1|2;link youtube2|1;link dailymotion1|2;link dailymotion2|[/id]

và phần hiển thị sẽ trông như thế này :


Server Youtube: Tập 1 | Tập 2 |
Server Daily: Tập 1 | Tập 2 |

- nếu Tập 1 được chia làm nhiều phần nhỏ thì ta cứ thêm tuần tự link vào, và các link được ngăn cách bằng dấu chấm phẩy. ví dụ như bên dưới :


[id]Tập 1;link youtube1-a;link youtube1-b;link youtube1-c;link youtube1-d|Tập 2;link youtube2|Tập 1;link dailymotion1|Tập 2;link dailymotion2|[/id]

- thì phần hiển thị sẽ như thế này :


Server Youtube: Tập 1a | Tập 1b | Tập 1c | Tập 1d | Tập 2 |

Server Daily: Tập 1 | Tập 2 |

- Tương tự như thế, nếu video có từ nhiều nguồn thì ta cứ việc thêm vào phía sau nó. ví dụ như bên dưới :


[id]Tập 1;link youtube1-a;link youtube1-b;link youtube1-c;link youtube1-d|Tập 2;link youtube2|Tập 1;link dailymotion1|Tập 2;link dailymotion2|1;link zingmovie1|2;link zingmovie2[/id]

- và phần hiển thị sẽ là :


Server Youtube: Tập 1a | Tập 1b | Tập 1c | Tập 1d | Tập 2 | Server Daily: Tập 1 | Tập 2 |
Server Zing: 1 | 2 |

Như vậy mình đã giới thiệu xong. chúc các bạn thành công.

update: Bước 1:
<script src='http://chipteenplis.googlecode.com/files/ancmedia2.js'/> <script> //<![CDATA[ var anc = { width : "100%",height : "497", id1: "Blog1", id2:"anc_pl",id3: "anc_tp", home: "ChipKool", logo : "http://3.bp.blogspot.com/-33UczRcXewY/Ttyu8WNfD8I/AAAAAAAABh0/57ggsGsmHmQ/s1600/ckl.png" }; ANCMedia.call(anc); M.pl(M.r()); $_("anc_content").innerHTML = $_("anc_nd").innerHTML; //]]> </script>
Nguồn Fandung.com

Chip cũng làm thành công nè?here
In bài này
Previous
Next Post »

11 comments

Click here for comments
Jack
admin
7/12/11 ×

hi,,, bạn thấy blog load nặng lắm à... hix chắc là do script nhiều quá đấy mà... hix... :(

Reply
avatar
7/12/11 ×

blog của chip cũng lắm js nhưng load còn nhanh chán.hahaha:-u

Reply
avatar
1/1/12 ×

Bài viết thật tuyệt. Nhưng mình không hiểu là phần 1;link youtube1|2;link youtube2|1;link dailymotion1|2;link dailymotion2| mình dán code hay link mà mình làm không được. Nhờ bạn chỉ giúp như

Reply
avatar
1/1/12 ×

ok,Thế này nhé,code player này rất đơn giản thôi.sau khi bạn chèn code javar và temple xong nhé,mỗi khi bạn đăng bài,bạn nhớ phải có code này <div align="center" id="anc_pl"></div>
<div id="anc_tp"></div>
<div id="anc_content"></div> trong bài viết thì mới hiển thị,tốt nhất là khi bạn đặt dầu bài viết như của chip,còn vấn đề link,[id]Tập1;link youtube|Tập2;linkyoutube|Tập3;linkyoutube|Tập1;linkdailymotion|Tập2;linkdailymotion|[/id] kết quả hiển thị sẽ là

Server youtube Tập1 | Tập2
Server dailymotion Tập1 | Tập2

Còn nếu bạn chỉ có link youtube thì bạn viết [id]Tập1;linkyoutube|Tập2;Linkyoutube;Tập3;linkyoutube|[/id]

hiển thị sẽ là server youtube: Tập1 | Tập2 | Tập3 bạn tăng tùy ý chúc bạn thành công:D

Reply
avatar
7/1/12 ×

http://photoknu.blogspot.com/2012/01/vietsub-kara-lovey-dovey-t-ara-fullver.html
vào day rùi tìm cách sửa giùm mình chèn thì thanh cong rùi mà giời có 1 vấn dề là trong bài dang phổ biến nó hiện link ra mới chết chứ tim cah nhe chipkool.

Reply
avatar
7/1/12 ×

để lại nhận xét trên blog của mình nha bạn

Reply
avatar
7/1/12 ×

MÀ NẾU FLASH BỊ DIE THÌ SAO CÓ THỂ CHO MÌNH XIN FLASH KO .MÀ UP O ĐÂU.

Reply
avatar
7/1/12 ×

sr vì comments sai topic nhưng chả biết comments ở đâu cả :((
Hiện giờ hình như thèng FPT nó cũng chặn blogspot không biết vì mục đích gì.
Mình liền đăng ký tên miền .tk mà sao khi gõ tên miền .tk nó lại nhảy về blogger rồi lấy dữ liệu từ đó và thế là không vào được blog luôn.
Nhưng mà mình vào blog của chíp bình thường.
Có gì chỉ giáo vài chiêu làm sao add tên miền nó vào .tk nha
:-t:-t:-t:-t

Reply
avatar
7/1/12 ×

doi 1 thoi giang blogger va tk cap nhat ban oi

Reply
avatar
8/1/12 ×

@bùi văn vịnhChào bạn,mình đã trả lời thắc mắc của bạn trên blog của bạn rồi nhé,mạng chỗ chip vào chán quá,bị chặn lên load hơn con rùa,chip phải dùng thêm U mới vào được trang bạn đó,hic hic=))

Reply
avatar
8/1/12 ×

@Nguyễn Doãn Đứchihihi,đúng là sự lựa chọn tên miền cho blog là 1 sự lựa chọn sáng suốt,cậu tạo sau đó đợi 30 phút hoặc 24h là ok,còn chip đợi có 30 phút thui,nếu bạn bị ẫn bạn click vào chọn chuyển sang tên miền: tenmien.tk của bạn trong chỗ cài đặt là ok,hihi

Reply
avatar

Bạn đọc hãy giúp chúng tôi xây dựng cộng đồng bằng cách để lại bình luận, chúng tôi luôn đón nhận mọi ý kiến của các bạn:
» Bình luận nghiêm túc và không chứa các liên kết quảng cáo.
» Vui lòng không Spam nhận xét với mọi hình thức.
» Rất mong bạn đề tên cho nhận xét của chính mình - Bằng cách chọn vào Tên/URL và điền tên bạn vào (Phần URL có thể bỏ trống ).

- Bạn có thể chèn Link nhạc (NCT), video(Youtube),Hình ảnh vào comment bằng cú pháp:
+ [youtube] Link video Youtube [/youtube].
+ [img] Link ảnh( định dạng PNG, JPG,GIF) [/img]
+Chèn link liên kết: <a href="LINK" rel="nofollow">Name</a>
-Bạn copy mã bên cạnh biểu tượng chèn vào nhận xét để bày tỏ cảm xúc!! ConversionConversion EmoticonEmoticon

       Mạch Khóa Số Điện Tử Mạch Đếm Sản Phẩm Mạch Đèn giao thông Ngã Tư Mạch Trái Tim Final Mạch Trái Tim Final Mạch Trái Tim I Love U

THƯ MỤC KHO TÀI LIỆU MIỄN PHÍ ECHIPKOOL

Code 8051 - ASM Code 8051 - C Code AVR - C Code led sao băng Code PIC - C Điện tử cơ bản điện tử viễn thông Đo Nhiệt Độ DS18B20 + LCD Đo Nhiệt Độ LM35 + LCD Đo Nhiệt Độ LM35 + Led 7 thanh Đo tốc độ động cơ Động cơ robo Ebook Đại Học ebook điện tử Ebook đồ án Học Orcad Học Protues Hồng ngoại Lập Trình 8051 Lập Trình AVR lập trình c++ Lập Trình Led Quảng Cáo lập trình PIC Lập trình Robot Lập trình VHDL Lcd16x2 Led Clock Led Quay Led RGB Mạch 7seg Mạch Amply.Mạch Loa Mạch Cảm Biến Mạch cube Mạch Đếm Sản Phẩm Mạch điện cơ bản Mạch điện hay Mạch Điện Ứng Dụng Mạch đọc file nhạc MP3 dùng Atmega 8 Mạch Động Cơ Mạch đồng hồ Mạch đồng hồ LCD Mạch đồng hồ Matrix Mạch giao thông Mạch in Mạch khóa số điện tử Mạch Led đơn Mạch Led Quảng Cáo Mạch Led Vumeter Mạch Ma trận Phím Mạch Matrix Mạch nạp Mạch nguồn Mạch Nút Bấm Mạch RS232 Mạch RS485 Mạch thu phát Mạch tổ hợp MSI Mạch trái tim Mạch truyền điện không dây Mạch Vi điều khiển Module Bluetooth Module Sim Module Sim548 Motor Nhiệt độ - Độ ẩm oscilloscope Phần mềm điện tử Phần Mềm Diệt Viruts Phần Mềm Hay Phần Mềm Led Quảng Cáo Phần mềm vi tính robocon Rule robocon Sạc Acquy Sản Phẩm Thương Mại Sáng tạo Smart Home Tài liệu Điện Tử Tranzitor Tụ điện TUT - 8051 - ASM TUT - 8051 - KeilC UART Ứng Dụng Led Quảng Cáo Ứng dụng USB USB TO COM Vi điều khiển - Ứng dụng Vi mạch số VOM Wifi ESP8266