Monday, November 5, 2012

Chèn ảnh, video, nhạc vào comment Blogger

Điểm mạnh của blog là tính tương tác giữa người viết và người đọc. Những dẫn chứng dạng chữ chưa đủ tính thuyết phục thì người đọc còn muốn chèn thêm ảnh, video hoặc nhạc. Ở diễn đàn thì việc chèn ảnh, video hay nhạc được thực hiện dễ dàng với BB code, còn Blogger chỉ hỗ trợ 3 thẻ HTML là <b>, <i> và <a> - điều đó chưa đủ làm thỏa mãn bạn? Bài viết này sẽ giúp bạn làm việc đó dễ dàng cho khung comment của Blogger.
Ảnh được chèn từ direct link còn video và nhạc thì từ Youtube và Nhaccuatui dựa vào link trên thanh địa chỉ. Code để chèn cụ thể:

Chèn ảnh:

Link ảnh là http://domain.com/image.png thì code chèn sẽ là



[img]http://domain.com/image.png[/img]

Chèn video từ Youtube:
Link video là http://www.youtube.com/watch?v=0nbY7Mg_vMI&feature=related thì code chèn sẽ là

[youtube]http://www.youtube.com/watch?v=0nbY7Mg_vMI&feature=related[/youtube]

Link video là http://youtu.be/0nbY7Mg_vMI thì code chèn sẽ là
[youtube]http://youtu.be/0nbY7Mg_vMI[/youtube]

Chèn nhạc từ Nhaccuatui:
Link nhạc là http://www.nhaccuatui.com/nghe?L=6g3kDUIYbvmt thì code chèn sẽ là

[nct]http://www.nhaccuatui.com/nghe?L=6g3kDUIYbvmt[/nct]
Link nhạc là http://www.nhaccuatui.com/nghe?M=B_6M7IcZTz thì code chèn sẽ là
[nct]http://www.nhaccuatui.com/nghe?M=B_6M7IcZTz[/nct]

 Mở template và chèn đoạn mã dưới đây trước thẻ  </body>

 
<b:if cond='data:blog.pageType == &quot;item&quot;'>

<script type='text/javascript'>

//<![CDATA[

function replaceText(){if(!document.getElementById){return;}

bodyText = document.getElementById("comment-holder"); 

theText = bodyText.innerHTML;

theText = theText.replace(/\[img\].*?'.*?\[\/img\]/gi, "");

theText = theText.replace(/\[nct\].*?'.*?\[\/nct\]/gi, "");

theText = theText.replace(/\[youtube\].*?'.*?\[\/youtube\]/gi, "");

theText = theText.replace(/\[img\]/gi, "<div 
style='clear:both'></div><img style='float:left;margin:10px 
0;border:1px solid #DDD;max-width:590px;background:#FFF;padding:4px' 
src='");

theText = theText.replace(/\[\/img\]/gi, "'/><div style='clear:both'></div>");

theText = theText.replace(/\[youtube\]http:\/\/youtu.be/gi, "<iframe 
width='480' height='390' src='http://www.youtube.com/embed");

theText = 
theText.replace(/\[youtube\]http:\/\/www.youtube.com\/watch\?v=/gi, 
"<iframe width='480' height='390' 
src='http://www.youtube.com/embed/");

theText = theText.replace(/&amp;feature=/gi, "?rel=0' '");

theText = theText.replace(/\[\/youtube\]/gi, "?rel=0' frameborder='0' allowfullscreen></iframe>");

theText = 
theText.replace(/\[nct\]http:\/\/www.nhaccuatui.com\/nghe\?L=/gi, 
"<div style='overflow:hidden'><embed 
style='margin-top:-250px;width:300px;height:400px' 
src='http://www.nhaccuatui.com/l/");

theText = 
theText.replace(/\[nct\]http:\/\/www.nhaccuatui.com\/nghe\?M=/gi, 
"<div style='overflow:hidden'><embed 
style='margin-top:-350px;width:300px;height:400px' 
src='http://www.nhaccuatui.com/m/");

theText = theText.replace(/\[\/nct\]/gi, "' quality='high' 
wmode='transparent' 
type='application/x-shockwave-flash'></embed></div>");

bodyText.innerHTML = theText;

}replaceText();

//]]>

</script>

</b:if>

Lưu Mẫu (save template)
 
Chúc mọi người thành công
 
 
 Nguồn: http://namkna.blogspot.com/2011/10/chen-anh-video-nhac-vao-comment-blogger.html


1 comment:

  1. Thử xem nhé.

    [img]http://i1041.photobucket.com/albums/b416/TTM0123/01%20Small/Animal-066.gif[/img]

    ReplyDelete