Thứ Hai, 12 tháng 12, 2011

Tiện ích Recent Posts 3 cột cho Blogspot

| | 0 nhận xét
Hi các bạn,
Hôm nay cóp nhặt được một thủ thuật cũng rất là hay nên chia sẻ cùng các bạn ^^


Chắc các bạn cũng thấy trên site iTechPlus.info ở sidebar có một trương mục là Bản quyền phần mềm, với bố cục là logo và tên của phần mềm được chia làm 3 cột hiển thị khá gọn gàng và đẹp mắt.

Tiện ích này rất thích hợp cho các trang giới thiệu phần mềm, ebook, quảng cáo sản phẩm,…kết hợp sử dụng tiện ích Multi Tabbed Widget For Blogger sẽ càng làm cho Blog của bạn trông ngăn nắp và chuyên nghiệp hơn.
Tiện ích Recent Posts 3 cột cho Blogspot
Hình minh họa | Demo
Thể theo yêu cầu của bạn Mobile, cũng như muốn chia sẻ với các bạn tiện ích hữu ích này, bài viết bên dưới iTechPlus sẽ hướng dẫn các bạn cách tạo widget Recent Posts with 3 columns for Blogger qua 2 bước đơn giản.
Thực hiện :
1. Vào Thiết kế > Phần tử trang
2. Tạo một widget HTML/JavaScript và dán code bên dưới vào :

<style type="text/css">
#itechplus-rc-3cot {width:350px;}
table#itechplus-rc-3cot {border:1px solid #ccc;}
#rc-3cot {padding:0 8px;width:30%;}
#rc-3cot p{padding:0;margin:0 0 5px 0;}
#rc-3cot img {margin:8px 0 2px; height:50px; width:50px; border:1px solid #ccc; padding:1px;}
#rc-3cot a:link {font:normal 12px arial;}
#itechplus-rc-3cot h2 {
background:url(https://lh3.googleusercontent.com/_PAuO_he0N0k/TbzBhkqMYFI/AAAAAAAAII8/foXvO5UIqg4/itechplus-rc-3cot.gif) no-repeat top left;
padding:5px 0 14px 15px;
font:bold 13px Verdana;
margin:0px;
color:#fff;
}
</style>
<script type="text/javascript">
home_page = "http://dinhquandongnai.cuncon1202.net/";
label = "Tin Giao Thông";
numposts = 9;
sumTitle = 24;
colortitle = "#333";
imgr = new Array();
imgr[0] = "https://lh6.googleusercontent.com/_PAuO_he0N0k/TZRW-L29nGI/AAAAAAAAFuM/14HvFKPlaKo/noimage.jpg";
showRandomImg = true;
</script>
<div id="itechplus-rc-3cot">
<h2>Tin Tức Giao Thông</h2>
<script src="http://cuncon1202.googlecode.com/files/itechplus-rc-3cot.js" type="text/javascript"></script>
<p style="float:right;margin:0;padding:3px">Xem thêm về<a href="http://dinhquandongnai.cuncon1202.net/search/label/Tin Giao Thông?&max-results=20"> Tin Giao Thông &#187;</a></p>
</div>


Trong đoạn code trên :
  • width:350px; : chiều rộng của widget
  • height:50px; width:50px; : chiều rộng và chiều cao của ảnh đại diện
  • home_page = "http://dinhquandongnai.cuncon1202.net/"; : địa chỉ blog của bạn
  • label = "Tin Giao Thông"; : tên trương mục muốn hiển thị
  • numposts = 9; : số bài viết sẽ hiển thị
  • sumTitle = 24; : số ký tự dòng tiêu đề bài đăng
  • colortitle = "#333"; : màu tiêu đề bài đăng
  • imgr[0] = “…”; : hình đại diện cho bài viết không có ảnh
Các bạn thay đổi cho phù hợp. Hy vọng các bạn sẽ thích tiện ích này.
Chúc các bạn thành công !

Nguồn: itechplus.info

Không có nhận xét nào:

Đăng nhận xét

Support : Guide | Blogspot Tips | Television | ↑ back to top
Ghi rõ nguồn ex.cuncon1202.net khi phát hành lại thông tin từ trang này
Copyright © 2011. Kiếm Tiền Online Việc Làm Online Kiếm Tiền Trên Mạng Make Money Online - All Rights Reserved
Đây là trang của cuncon1202
Xem tốt nhất ở độ phân giải 1024 x 768 pixel
http://ex.cuncon1202.net/