Thứ Hai, 5 tháng 12, 2011

Cách tạo thêm 3 cột tiện ích dưới chân trang Blog

Theo Bloger Tricks cách tạo thêm 3 cột tiện ích dưới chân trang BlogSpot bạn làm như sau.

Bạn đăng nhập vào Blog > Mẫu > Chỉnh sửa HTML > Tiếp tục > Check vào mở rộng mẫu tiện ích, bạn tìm thẻ ]]></b:skin> và dán Code sau vào trước nó.
/*-----   LOWER SECTION   ----- */
#lower {        margin:auto;        padding: 0px 0px 10px 0px;        width: 100%;       background:#333434; } #lower-wrapper {        margin:auto;        padding: 20px 0px 20px 0px;        width: 960px; } #lowerbar-wrapper {      border:1px solid #DEDEDE;        background:#fff;        float: left;        margin: 0px 5px auto;        padding-bottom: 20px;        width: 32%;        text-align: justify;        font-size:100%;        line-height: 1.6em;        word-wrap: break-word;        overflow: hidden; }
 .lowerbar {margin: 0; padding: 0;}        .lowerbar .widget {margin: 0; padding: 10px 20px 0px 20px;} .lowerbar h2 {       margin: 0px 0px 10px 0px;        padding: 3px 0px 3px 0px;        text-align: left;
       color:#0084ce;         text-transform:uppercase;       font: bold 14px Arial, Tahoma, Verdana;        border-bottom:3px solid #0084ce; } .lowerbar ul {       margin: 0px 0px 0px 0px;       padding: 0px 0px 0px 0px;       list-style-type: none; } .lowerbar li {       margin: 0px 0px 2px 0px;       padding: 0px 0px 1px 0px;       border-bottom: 1px dotted #ccc; }
Bước tiếp theo bạn tìm thẻ này </body> và dán Code sau vào trước nó.
<div id='lower'> <div id='lower-wrapper'> <div id='lowerbar-wrapper'> <b:section class='lowerbar' id='lowerbar1' preferred='yes'> </b:section> </div> <div id='lowerbar-wrapper'> <b:section class='lowerbar' id='lowerbar2' preferred='yes'> </b:section> </div> <div id='lowerbar-wrapper'> <b:section class='lowerbar' id='lowerbar3' preferred='yes'> </b:section> </div> <div style='clear: both;'/> </div> </div>
Sau đó bạn có thể tùy chỉnh giao diện, màu sắc cho phù hợp với Blog của bạn ở các tham số tô màu phía trên.
#333434 : Màu nền của tiện ích.
960px : Chiều rộng của tiện ích.
#fff : Màu nền của 3 cột tiện ích.
32% : Chiều rộng của 3 cột tiện ích.
#0084ce : Màu tiêu đề của 3 cột tiện ích
font: bold 14px Arial,Tahoma, Verdana; border-bottom:3px: Kích thước phông chữ của tiện ích.
#0084ce : Màu đường viền khung tiện ích.
#ccc : Màu đường viền liên kết của tiện ích.

Dưới đây là hình ảnh ví dụ về 3 cột tiện ích đã được tạo.



Chúc các bạn vui vẻ.

7 nhận xét:

Vương Hoàng nói...
17:23 31 tháng 5, 2013

Thanks bạn, mình làm được rồi :D. Liên kết với web mình ko bạn? phimmediafire.com

kimduccz nói...
11:14 5 tháng 6, 2013

Cám ơn Vương Hoàng đã ghé thăm.
Mình đã kết nối với bạn trên Google+ rồi đấy. Mình chỉ kết nối trên Blog hoặc Google+ thôi.
Còn trang phim online của bạn là web khác thể loại nên mình không kết nối, thông cảm nhé.

H Max nói...
08:14 11 tháng 4, 2015

The most important thing is to enjoy your life—to be happy—it's all that matters.
- ABN Private Banking Contact Number

hoattu nhan nói...
05:38 26 tháng 6, 2017

Nhìn đẹp <3. À, nếu bạn có nhu cầu thi công nội thất văn phòng hay đơn giản là thi công văn phòng thì ghé mình nha! <3

Một Thành Viên nói...
18:37 17 tháng 8, 2017

Bạn ơi sao web này của mình Tại đây làm rồi mà nó bị lỗi nhỉ, kiểm tra lại thì nó bị lỗi không chuẩn seo là sao, bạn tư vấn giúp mình với

Sofa New nói...
11:50 25 tháng 4, 2018

Cám ơn bạn đúng cái mình đang cần. Sau khi chỉnh sủa nó thành ra thế này đây: goo.gl/LXUoGw :D

Đăng nhận xét

Chào các bạn ghé thăm Blog, bạn hãy để lại nhận xét nếu thấy bài viết có ích. Cám ơn các bạn

Twitter Delicious Facebook Digg Stumbleupon Favorites More

 
Design by WordPress Themes | by Free - Premium Blogger Themes | Facebook Themes

*_* Bảng thông báo


Blog Kimduccz chào các bạn. Cám ơn các bạn đã đến thăm, rất mong nhận được những đóng góp xây dựng cho Blog ngày một tốt hơn, Blog Kimduccz chúc cộng đồng BlogSpot của chúng ta ngày một phát triển, chúc các bạn vui vẻ, thành công.

*_* Liên kết Blog

*_* Bài xem nhiều