Chúng tôi sẽ tìm hiểu trong bài viết này làm thế nào để làm cho một widget blogger dính. Bạn phải đã nhìn thấy hoặc Top Menu hoặc bên phải / bên trái cố định tại vị trí của nó trong khi di chuyển một blog hoặc một mẫu blogger. Một số mẫu blogger đáp ứng mới nhất có tính năng này đã có trong đó, làm cho trình đơn trên cùng hoặc thanh bên / s dính. Nhưng nếu mẫu bạn đang sử dụng không có tính năng này và bạn không muốn thay đổi mẫu của blog của bạn và bạn muốn làm cho widget của nó dính.
Bước 1
Đi đến bảng điều khiển blogger của bạn, bấm vào ‘Mẫu’ và sau đó bấm vào ‘Chỉnh sửa HTML’.
Bây giờ điều đầu tiên luôn được khuyến khích làm là lấy bản sao lưu mẫu của bạn. Vì vậy, chỉ cần sao lưu mẫu của bạn.
Bước 2
Tìm mã sau trong Mã XML của Mẫu (Chủ đề) của bạn: </ body> Bây giờ, ngay phía trên mã này, dán mã sau:
<script>
// Sticky widget by Bloggersentral.com
// Tutorial at http://www.bloggersentral.com/2013/04/how-to-make-any-widget-sticky.html
// Free to use or share, but please keep this notice intact.
//<![CDATA[
bs_makeSticky("HTML10"); // enter your widget ID here
function bs_makeSticky(elem) {
var bs_sticky = document.getElementById(elem);
var scrollee = document.createElement("div");
bs_sticky.parentNode.insertBefore(scrollee, bs_sticky);
var width = bs_sticky.offsetWidth;
var iniClass = bs_sticky.className + ' bs_sticky';
window.addEventListener('scroll', bs_sticking, false);
function bs_sticking() {
var rect = scrollee.getBoundingClientRect();
if (rect.top < 0) {
bs_sticky.className = iniClass + ' bs_sticking';
bs_sticky.style.width = width + "px";
} else {
bs_sticky.className = iniClass;
}
}
}
//]]>
</script>
<style>
.bs_sticking {background:#198dc9 !important; position:fixed !important; top:0; z-index:9999; box-shadow:0px 10px 4px -5px rgba(0,0,0,0.3); margin-top: 0; position:relative\9 !important;}
</style>
(Nguồn: bloggersentral.com)
Bước 3
Thay thế văn bản ‘TÊN WIDGET / ID ĐÂY’ của bạn bằng tên hoặc id của tiện ích con mà bạn muốn tạo nét.
Bước 4
Lưu mẫu của bạn và xem kết quả.
