▀▄▀▄▀▄▀▄▀▄▀▄ Các bài đăng mới ▀▄▀▄▀▄▀▄▀▄▀
    Kenh sctv1 Kenh sctv1 Kenh sctv1
    Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1 Kenh sctv1
    Kenh sctv1 Kenh sctv5 Kenh HTV2 Kenh SCTV16




Xem truyền hình trực tuyến (Click here)

HIỂN THỊ CÁC BÀI VIẾT TRONG CÙNG MỘT NHÃN (KIỂU 5)

Với thủ thuật này, các bài viết trong cùng một nhãn sẽ hiển thị trong một khung hình chữ nhật được chia thành 2 cột, cột bên trái là hình đại diện và một số dòng giới thiệu của bài viết mới nhất, cột bên phải sẽ hiển thị hình đại diện và tiêu đề bài viết thứ hai, số còn lại sẽ hiển thị theo dạng List. Ngoài ra, ở trên cùng của khung còn hiển thị một số Tab để các bạn có thể theo dõi các nhãn khác....
Mời các bạn bấm vào xem thử phía dưới sẽ thấy rõ hơn.




Xem thử




Đầu tiên bạn đăng nhập vào Blog > chọn thiết kế > Thêm tiện ích HTML, và dán tất cả các code phía dưới vào.




<style type="text/css">
    .fl{float:left}
    .fr{float:right}
    .folder{width:630px; margin-bottom:8px; overflow:hidden; line-height:1.5em;font:normal 12px arial;border-left:1px solid #ddd;border-right:1px solid #ddd;border-bottom:1px solid #ddd;}
    .folder-title{height:26px; border-bottom:1px solid #eee; overflow:hidden; background:url(http://goo.gl/CyQBL) repeat-x}
    .folder-active{height:24px; padding:4px 10px; background:url(http://goo.gl/EgxmY) repeat-x; font-weight:bold}
    .link-folder:link, .link-folder:visited{color:#fff}
    .subfolder{height:24px; padding:5px 5px 0 15px; background:url(http://goo.gl/Z29yN) no-repeat}
    .folder-content{width:620px; background:#fff url(http://goo.gl/qy9iZ) repeat-x left bottom; padding:10px 6px 2px 10px; overflow:hidden}
    .folder-content p{margin:0}
    .folder-content ul{list-style:none; margin:0; padding:0}
    .folder-content li{padding:0 0 4px 6px; background:url(http://goo.gl/4OvNo) no-repeat 0 8px}
    .folder-topnews{width:350px; padding-right:10px}
    .folder-othernews{width:250px}
    .other-folder{margin:0}
    .img-subject{height:85px; width:110px; border:1px solid #a5a5a5; margin-right:8px}
    .img-other{width:60px; height:50px; border:1px solid #a5a5a5; margin:0 5px 4px 0}
    .xemthem{float:right; display:block; margin:0; padding:5px}
  
</style>

<div class="folder">
<div class="folder-title">
<div class="folder-active fl">
<a class="link-folder" href="http://dunghennessy.blogspot.com/search/label/N%C3%82NG%20CAO">Thủ thuật nâng cao</a></div>
<div class="subfolder fl">
<a class="link-subfolder" href="http://dunghennessy.blogspot.com/search/label/C%C6%A0%20B%E1%BA%A2N">Thủ thuật cơ bản</a> | <a class="link-subfolder" href="http://dunghennessy.blogspot.com/search/label/TRANG%20TR%C3%8D%20BLOG">Trang trí Blogspot</a> | <a class="link-subfolder" href="http://www.dunghennessy.blogspot.com/search/label/Template">Giao diện Blogspot</a> | </div>
</div>
<div class="folder-content" id="tdHomeFolder2">

<script language="javascript">
    imgr = new Array();
    showRandomImg = true;
    summaryPost = 230;
    numposts2 = 5;
    homepage = "http://dunghennessy.blogspot.com/";
    label = "NÂNG CAO";
  
</script>

<script src="https://sites.google.com/site/itechroot/javascripts/VnE-rc-newstyle.txt" type="text/javascript">
</script></div>
</div>



Bây giờ, bạn thay đổi các đường link màu xanh (http://www.dungheineken.blogspot.com/search/label.......) là địa chỉ trang nhãn mà bạn muốn hiển thị, thay đổi các số màu đỏ theo ý muốn của bạn:
* Width: 630px (chiều rộng của tiện ích).
* Folder-topnews (width: 350px-chiều rộng của cột bên trái)
* Folder-othernews (width: 250px-chiều rộng của cột bên phải)
* Img-subject (chiều cao và chiều rộng của hình đại diện bên trái)
* Img-other (chiều cao và chiều rộng của hình đại diện bên phải)
* Home_page: địa chỉ blog của bạn
* Label: Tên nhãn muốn hiển thị
* Numposts2=5: Số bài muốn hiển thị (kể cả bài có hình và bài hiển thị dạng List)
* SummaryPost=230: Số ký tự phần giới thiệu bài viết mới nhất.
và bấm LƯU lại là xong


LƯU Ý: 
 - Nếu thay đổi chiều rộng của tiện ích thì các bạn phải thay đổi đồng thời chiều rộng của cột bên trái và bên phải luôn.
- Các bạn phải điền thật chính xác địa chỉ trang nhãn của bạn ở các dòng màu xanh và ở Label, nếu không nó sẽ bị lỗi và không hiển thị được.
Chúc các bạn thành công



Nguồn: Itech Plus

21 nhận xét:

tung5a nói...

cám ơn bài viết của anh Dũng nha

dungheineken nói...

Không có gì đâu, chúc em đạt được nhiều thành công như ý muốn

sangnguyenMS nói...

Cám ơn bài viết của bạn thật hữu ích.

toan nói...

Anh có thể cho em code như phần xem báo ở http://dungheineken.blogspot.com/

dungheineken nói...

Em vào xem bài "TIỆN ÍCH XEM BÁO KIỂU 2" nha

MON NGON CUOI TUAN nói...

Bạn ơi cho mình hỏi sao mình lấy nguyên code của bạn để qua thì bình thường nhưng khi mình thay đổi link, đường dẫn label theo blog của mình thì phần cột bên phải lại chạy xuống dưới phần hiện thị bài viết. Vậy là lỗi gì? Mình sửa hoài ko được. Bạn giúp mình lại nhé!
My blog: monngoncuoituan.blogspot.com
My email: monngoncuoituan@gmail.com

Thanks bạn

dungheineken nói...

Bạn thu hẹp lại các thông số chiều rộng của tiện ích, chiều rộng của bên trái và bên phải lại là OK

MON NGON CUOI TUAN nói...

Mình làm theo hướng dẫn của bạn chỉ nhưng nó cũng bị vậy bạn ơi!!! Bê nguyên si code mẫu của bạn vô thì ko sao? Chỉ sửa link thôi là nó cũng bị vậy ah???

Bạn vô blog mình xem thử.

MON NGON CUOI TUAN nói...

Bây giờ mình đang để nguyên si code của bạn vô trong blog mình đấy. Nó ko bị lỗi gì cả. Nhưng khi thay đổi đường dẫn là nó bị đẩy các cột bên phải xuống dưới khung bài viết.

dungheineken nói...

Tôi đã vào blog của bạn và không thấy tiện ích này và bạn đã có tiện ích khác khá đẹp rồi!!!
Chúc mừng bạn

MON NGON CUOI TUAN nói...

Mình đã sửa lại trang bài viết theo hướng dẫn của trai dat mui blog, mình nghĩ chắc nó lỗi ko tương thích cho blog của mình đó.hjhj
Ý kiến thêm: Trang này của mình (http://monngoncuoituan.blogspot.com/search/label/Du%20l%E1%BB%8Bch%20%E1%BA%A9m%20th%E1%BB%B1c), mình muốn nó thể hiện giống trang của Dũng (http://dunghennessy.blogspot.com/search/label/NH%C3%83N) thì làm như thế nào?
Mình có làm theo nhưng các bài viết mặc định của blogger lại nằm ở phía dưới.
Giúp mình nhé! Thanks Dũng

dungheineken nói...

Trang của dunghennessy là do giao diện có sẳn, mình không có chỉnh sửa gì cả (2 cột) vì vậy mình không thể giúp bạn được.
Thành thật xin lỗi

Linlken Nguyen nói...

Bạn ơi!! lỗi gì rồi..mình copy nguyên code của bạn sang cũng không hiển thị, mình thay thông số của mình vào cũng không được.
mấy hôm thì ngon nhưng giờ có lẽ lỗi gì...cậu xem lại giùm..trang mình: http://www.webthuthuat.net/

The Manor nói...

Dunghennessy ơi , cho mình hỏi dunghennessy biết web nào mình up ảnh lên , lấy URL full size của nó được không , muốn làm cái background nhưng lấy full size ko dc

dungheineken nói...

Linlken Nguyễn: Tôi đã kiểm tra lại code trên và không nhận thấy lỗi nào cả, chắc do trang của bạn có một số code nào đó xung đột với code này rồi, cách khắc phục là bạn phải tìm ra code đó và xoá nó đi thì thủ thuật này sẽ hiển thị như cũ mà thôi.
Chúc bạn thành công

dungheineken nói...

Bạn Manor: Bạn chỉ cần chèn ảnh vào blogspot, chờ một chút khi blogspot up ảnh mình lên thành công rồi thì bạn bấm chuột vào ảnh chọn 'KÍCH THƯỚC BAN ĐẦU', tiếp theo bấm thẻ HTML trên góc phải của bài đăng, sau đó lấy code của nó là xong
Chúc bạn thành công

DINH VAN Tu nói...

a dũng ơi . nghe bài về quê huong e nè http://tonghop24h.blogspot.com/2012/10/suspicious-activity-in-your-account-we.html

Duy Hoang nói...

Dũng ơi ! sao mình bỏ code này vào , thay tất cả y như bạn chỉ , mà sao nó chỉ hiện lên khung mà không hiện ra các bài đăng , giúp mình với :)

dungheineken nói...

Đó là do bạn thay địa chỉ trang của bạn không chính xác nên nó sẽ không hiển thị và chỉ có khung nền mà thôi.
Muốn khắc phục thì bạn phải thay chính xác tên nhãn ở các thẻ Label (bạn đọc kỹ phần Lưu ý phía dưới bài đăng nha)

Phi Phi Lê nói...

mình thấy code của bạn toàn bị lỗi

http://2.bp.blogspot.com/-4n3eu0MXf3g/UO_qkqwCslI/AAAAAAAAAdo/NKoJ7k5t0Sc/s320/Untitled.png

dungheineken nói...

Lỗi chỗ nào vậy bạn??? Bạn có thể nêu cụ thể để cho mình biết và chình sửa lại nha.
Cám ơn bạn trước...

Đăng nhận xét

 
Powered by by: Blogger