• Tư vấn điều trị
      bệnh khàn tiếng


    www.trikhantieng.com

    Liên hệ + 0913163316

BlogList111

Việt Nam Gia Phả, nơi lưu trữ Gia Phả của người Việt Nam  Kiến thức Blogspot Ngonluanho: Nhung cau chuyen thap lua-Tin-Cay-Men Vngreenzone Là một nơi chia sẻ kinh nghiệm làm blogger - Nơi tôn vinh tâm hồn blogger Việt

Tạo Auto Readmore cho blog chuyên về phim

28
25/02/2011

Đối với các blogspot chuyên giới thiệu về phim hay video được upload lên hoặc lấy từ Youtube.com thì để có được chế độ Readmore tự động lấy hình đại diện cho youtube video và đoạn trích dẫn thì cần phải sử dụng thủ thuật riêng chứ không dùng script tạo Auto Readmore cho các blog thông thường được.

Bạn có thể xem một ví dụ về một blogspot như vậy tại đây.

Để thực hiện thủ thuật này, bạn hãy thực hiện như sau.

Bước 1. Đăng nhập Blogger, vào Design >> Edit HTML, chọn Expand Widget Templates.

Đặt đoạn code bên dưới vào trước thẻ </head>.

<script type='text/javascript'><!--//--><![CDATA[//><!--
var thumbnail_mode = 'float' ; summary_noimg = 50; summary_img = 50; img_thumb_height = 120; img_thumb_width = 192;


function createVideoThumb(pID){
var div = document.getElementById(pID);
var summ = summary_noimg;
if (div.innerHTML.indexOf("http://www.youtube.com/watch?v=")!=-1){
var vidid = div.innerHTML.substring(div.innerHTML.indexOf("http://www.youtube.com/watch?v=")+31,div.innerHTML.indexOf("endofvid"));
}else {var vidid =""};

var postlink = div.innerHTML.substring(div.innerHTML.indexOf("[postlink]")+10,div.innerHTML.indexOf("[/postlink]"));
if (vidid ==""){var imgvid ='<a href="'+ postlink + '"><img class="thumbnail" src="http://i195.photobucket.com/albums/z105/dantearaujo/novideo.png" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></a>';
}else{
var imgvid ='<a href="'+ postlink + '"><img class=thumbnail src="http://i2.ytimg.com/vi/'+vidid+'/default.jpg" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></a>';
};

var summary = imgvid ;
div.innerHTML = summary;
}

function createVideoThumb2(pID){
var div = document.getElementById(pID);
var imgtag = "";
var summ = summary_noimg;
if (div.innerHTML.indexOf("http://www.youtube.com/watch?v=")!=-1){
var vidid = div.innerHTML.substring(div.innerHTML.indexOf("http://www.youtube.com/watch?v=")+31,div.innerHTML.indexOf("endofvid"));
}else {var vidid =""};

var textinside = div.innerHTML.substring(div.innerHTML.indexOf("[starttext]")+11,div.innerHTML.indexOf("[endtext]"));
var postlink = div.innerHTML.substring(div.innerHTML.indexOf("[postlink]")+10,div.innerHTML.indexOf("[/postlink]"));
var embedvid = "";
if (vidid!="") {
embedvid = '<object width="654" height="393"><param name="movie" value="http://www.youtube.com/v/'+ vidid + '&hl=en&fs=1&rel=0&autoplay=1"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/'+ vidid + '&hl=en&fs=1&rel=0&autoplay=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="654" height="393"></embed></object>'
}
var summary = embedvid + '<div class="content">' + textinside + '</div>';
div.innerHTML = summary;
}

//--><!]]></script>

Trong đoạn code trên, bạn có thể điều chỉnh các con số trong phần code được đánh dấu màu đỏ, lần lượt là số ký tự khi không có ảnh đại diện, số ký tự khi có ảnh đại diện, chiều cao ảnh đại diện, chiều rộng ảnh đại diện (px).

Bước 2. Tìm dòng code <data:post.body/> (hoặc <p><data:post.body/></p>) và thay nó bằng đoạn code bên dưới.

<div expr:id='&quot;summary&quot; + data:post.id'>[postlink]<data:post.url/>[/postlink]<data:post.body/></div>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script type='text/javascript'>createVideoThumb2(&quot;summary<data:post.id/>&quot;);</script>
</b:if>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<script type='text/javascript'>createVideoThumb(&quot;summary<data:post.id/>&quot;);</script>
</b:if>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:post.title'>
<h3 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>
</b:if>
</b:if>

Bước 3. Để đăng youtube video lên blogspot trong trường hợp này thì bạn phải tạo tài khoản Youtube trên Youtbube.com hoặc nếu không thì bạn có thể tìm trên Youtube.com để lấy URL nguồn cho video. Để lấy URL, khi bạn xem một video nào đó trên Youtube.com hãy nhấp vào nút Share rồi copy URL trong khung. Bên dưới là một ví dụ.

http://www.youtube.com/watch?v=7g6jc_9OzhI

Bước 4. Trong bảng điều khiển Blogger, vào Settings (Cài đặt) >> Formatting (Định dạng), kéo xuống khung Post Template (Mẫu bài đăng) rồi dán đoạn mẫu sau đây vào khung Post Template.

endofvid
[starttext]
Nội dung bài đăng đặt ở đây
[endtext]

Nhấp SAVE SETTINGS để lưu cài đặt.

Trong đoạn mẫu ở trên thì, "endofvid" được dùng để cho Template hiểu rằng URL video hoàn thành, để bạn dán URL video ngay trước nó mà không có khoảng cách. [starttext] và [endtext] là các phần bao nội dung bài viết, nếu bạn cần viết mô tả nội dung video thì đặt vào giữa hai dòng này.

Bước 5. Vào Posting (Đăng bài) ở chế độ Compose. Trong phần nội dung, bạn đặt URL của video vào trước dòng endofvid, phần nội dung bài đăng thì đặt vào giữa 2 dòng [starttext] và [endtext]. Bên dưới là hình minh họa.



Lưu ý thủ thuật này chỉ áp dụng cho video được upload lên hoặc lấy từ Youtube.com.

Nguồn tham khảo: Xem >>

{28 bình luậnAdd yours ?}

09:44:00, 25 thg 2, 2011

ở bước 2, 2 cái code đó mình tìm chả thấy cái nào, còn mở rộng tiện ích thì vẫn chưa mỡ đc :(
Dù sao cũng cám ơn bạn

Reply
09:58:00, 25 thg 2, 2011

Ở bước 2, tìm dòng này bạn nè: <data:post.body/> là do mình lúc đầu đăng thiếu dấu /. Hôm nay Blogger vẫn đang bảo trì gì đó nên tính năng Expand Widget Templates vẫn chưa hoạt động. Có lẽ chờ mai thôi bạn.

Mà không mở rộng được mẫu tiện ích thì làm sao tìm được dòng <data:post.body/> do đó cũng chưa áp dụng được thủ thuật. Pls wait till 2morrow

Reply
10:03:00, 25 thg 2, 2011

uhm, cám ơn bạn, chả hỉu google đang làm gì mà bảo trì riết :61)
Cái bài trình chíu nội dung và hình ảnh hình như ko hoạt động bạn ơi http://huynh-nhat-ha.blogspot.com/2010/12/gallery-slideshow-using-mootools.html
MAi mốt bạn có rãnh nghĩ ra thêm vài cái trình chíu ảnh và nội dung đẹp nữa nhen :65)

Reply
10:15:00, 25 thg 2, 2011

@Lê Trương Vĩnh TrungDùng Mootools nó kén chọn lắm, hay xung đột với các thư viện khác nên k hoạt động, ở riêng một mình thì ok.

Nếu blog vể phim thì cũng nên có một cái slide phim cho oách, từ từ nhé

Reply
10:43:00, 25 thg 2, 2011

Ôi bạn thật là nhiệt tình, cám ơn nhìu nhé, blogspot mà có chương trình thanks bài viết hay biết mấy nhỉ:51)

Reply
12:30:00, 25 thg 2, 2011

Mình dung cái trình chiếu đó xung đột dữ quá nên bỏ rồi

Reply
00:57:00, 18 thg 3, 2011

bạn có mẫu template nào để dành cho 1 blog xem video không bạn .mình tìm được mẫu blog " BloggerTube " nhưng mà nó chỉ hỗ trợ cho YOUTUBE còn các trang khác thì không.nếu bạn có mẫu nào như vậy có thể cho mình xin được không .nếu có thể thì nhắn tin vào yahoo cho mình được thì tốt quá yahoo mình là : chantinh031188 .thanks

Reply
08:23:00, 5 thg 4, 2011

Anh cho hỏi có cách nào tạo Readmore cho riêng từng bài đăng không vậy. Em thấy có mấy blogger có cái này........

Reply
15:31:00, 5 thg 4, 2011

em dùng cái jump link có sẳn trong Post Editor

Reply
18:13:00, 20 thg 4, 2011

bạn cho mình hỏi muốn dùng cho wordpress thì phải làm thế nào
thank!

Reply
Bloggerism
AUTHOR
19:48:00, 20 thg 4, 2011

Mình chưa nghiên cứu về Wordpress, nhưng nếu xài cho WP thì phải khác nhiều lắm.

Reply
01:37:00, 13 thg 5, 2011

Anh Huỳnh Nhật Hà có thể nói rõ hơn đc ko ak!

Reply
18:27:00, 15 thg 5, 2011

code hướng dẫn ở trên chỉ làm được 1 video 1 bài viết. muốn đưa 3 video cùng 1 bài viết mà không được :(. có cách nào không vậy bạn

Reply
12:01:00, 2 thg 8, 2011

bác nhiều bài rất tuyệt, nhưng quả thật để tìm bài trong site của bác như mò kim đáy bể đấy, e nghĩ nên cho thêm phần bài viết liên quan hoặc label cho dễ bề tìm và đọc thêm bài bác à! Thanks!

Reply
12:08:00, 2 thg 8, 2011

@Tăng Doãn Du Có bài viết liên quan mà bạn. :51)

Reply
12:10:00, 2 thg 8, 2011

@Tăng Doãn Du Bổ sung thêm, có cả Label sẵn luôn.

Reply
14:08:00, 2 thg 8, 2011

@Tăng Doãn Du Chà chà. Tìm còn dễ hơn mò kim trong bọc nữa ấy chứ. Cái Tag Cloud quá rõ rồi mà. Bạn có cao kiến gì nữa k. À có cả cái Search nữa chi.

Reply
18:52:00, 13 thg 10, 2011

sặc nhầm rồi đại ca ơi, ý E muốn là tự nó nấy ảnh từ youtube cho cái tiện ích tự gọn bài viết trên blog cảu E ấy :|

Reply
18:53:00, 13 thg 10, 2011

à cái này có tự nhận ảnh thường nữa không nhỉ mà cái blog của E thì chèn vô đâu

y/h:alobabydey

Reply
23:56:00, 30 thg 10, 2011

Anh ơi tại sao blog cua em có đa số video nó lại không hiện ảnh đại diện cho video vậy. cần anh giúp đõ gấp. nghenhacnet.blogspot.com
email: giakhanh9x@gmail.com
thanks.

Reply
08:20:00, 31 thg 10, 2011

@Gia Khánh Bạn kiểm tra kỹ lại theo 5 bước ở trên đã nhé.

Reply
14:34:00, 31 thg 10, 2011

Temp của em đâu có đoạn code này <data:post.body/> (hoặc <p><data:post.body/></p>) . Từ trước tới giờ em chỉ biết làm theo bước 5 thôi, khổ nỗi có video nó tự tạo anh hiển thị có video lại không, mà số đó là đa số, bất kể là video HD hoạc video thường.

Reply
14:54:00, 31 thg 10, 2011

@Gia Khánh Hình như temp của e dạng Video đã áp dụng sẳn thủ thuật này rồi, em chỉ cần đăng bài theo Bước 5 thôi là được.

Reply
19:02:00, 2 thg 4, 2012

em dung template BloggerTube nhưng trình chiếu không hoạt động mong anh giúp em với Blog em nè http://www.x5nghiphu.co.cc/

Reply
19:05:00, 2 thg 4, 2012

hoặc nếu đc mong anh liên hệ với em qua YM:nolemauvacat
Email: nolemauvacat@yahoo.com

Reply
20:31:00, 4 thg 4, 2012

không thấy anh Online buồn quá
onl nhớ giúp em với nhé anh. Em đổi tên Blog rồi
http://www.x5nghiphu.name.vn/

Reply
21:15:00, 5 thg 4, 2012

[ Gia Khánh ] em hiểu lí do sao nó ko hiện thị ảnh rồi.
tại vì khi nhúng trên Youtube. bạn k nhúng đúng quy định. pm Ym: nolemauvacat em chỉ cho

Reply
Nội quy! Đóng lại Khi bạn viết bình luận, cần tuân thủ một số quy tắc sau:
» Bình luận phải nghiêm túc và không chứa các liên kết quảng cáo.
» Có thể sử dụng các thẻ <b> … </b>,<i> … </i>, <a href="URL..."> ... </a>.
» Yêu cầu thủ thuật tại mục Yêu cầu thủ thuật hoặc hỏi tại mục Hỏi và Đáp.
More →
Chữ đậm Chữ nghiêng Chữ nghiêng 2 Chèn Link Chèn Link Mã hóa code Help ?Nhấn vào biểu tượng hoặc kiểu chữ hoặc chèn link sau đó nhấn nút Chọn rồi copy (Ctrl + C) để paste (Ctrl + V) vào khung viết bình luận. Mã hóa code nếu bạn muốn đưa code vào bình luận.

Chọn Xóa

Next post: Bài đăng Mới hơn

Previous post: Bài đăng Cũ hơn