Thủ thuật tạo khung liên kết thanh cuộn cho blogspot

1 Khung liên kết đẹp và gọn được nhiều blogger hướng tới. Chúng ta vẫn bắt gặp những dạng khung liên kết đó xuất hiện ở những blogger khác nhau. Khung liên kết thanh cuộn với những icon bắt mắt.

Thu thuat blogspot, lien ket blog

- Thủ thuật hôm nay mình chia sẻ tới các bạn bằng cách sử dụng 1 đoạn CSS để làm 1 liên kết blog thật đẹp
Demo tại trang blog: Demo thủ thuật Blogspot
- Hướng dẫn thủ thuật:
1. Vào bảng điều khiển blogger -> Bố cục (Layout) -> Thêm tiện ích (Add a Widget) -> HTML/Javascript
2. Dán code dưới đây vào tiện ích vừa thêm:




- Trong đó:
http://i-thuthuat.blogspot.com/favicon.ico là phần favicon của blog. Ví dụ nếu Blog của bạn có tên là abcd.blogspot.com thì link favicon là http://abcd.blogspot.com/favicon.ico
- Mở rộng nếu các bạn muốn cái kéo cuộn là màu xanh như Demo thì các bạn thêm 1 bước sau:
Vào Mẫu (Template) -> Chỉnh sửa HTML (Edit HTML)
Tìm tới (Ctrl + F) ]]> và dán code dưới đây ngay trên nó:

/* lien ket blog - itviet360 */
::-webkit-scrollbar {
height: 12px;
width: 12px;
background: #dddddd;
}
::-webkit-scrollbar-thumb {
min-height: 28px;
padding-top: 100px;
border-left: 12px solid transparent;
border-right: 12px solid transparent;
border-top: 0 solid transparent;
border-bottom: 0 solid transparent;
background-clip: padding-box;
background-color: #0F83A0;
-webkit-box-shadow: inset 1px 1px 0 rgba(0, 0, 0, 0.1), inset 0 -1px 0 rgba(0, 0, 0, 0.07);
}
::-webkit-scrollbar-corner {
background: #dddddd;
}

- Lưu lại và xem kết quả nhé các bạn

0 comments: