Ghi chú kết dính trong Blogspot khi kéo thanh cuộn trình duyệt

Một yêu cầu khá hay từ bạn có nickname con gái khi bạn hỏi Phong về thủ thuật nào giúp mình tạo được 1 Widget mà khi mình có kéo thanh cuộn trình duyệt xuống thì tiện ích đó bị dính lên trên cùng của trình duyệt....Nắm bắt được câu hỏi của bạn và gửi Website có chức năng tương tự thì mình biết đó là 1 kỹ thuật tạo Sticky - đó là kết dính 1 phần tử của Website, Blog luôn ở trạng thái lên đầu.
Hiệu quả của việc ghi chú kết dính này: Đó là làm người xem Website, Blog của bạn chú ý ngay tới phần bạn muốn người đọc hướng tới, chú ý tới. Đặc biệt khi bạn dính quảng cáo lại thì khá hiệu quả trong việc người xem hướng tới quảng cáo của bạn.

Rõ hơn hết là bạn xem Demo trực tiếp tại Blog demo: Trung tâm da liễu Đông Y Việt Nam bằng việc bạn kéo thanh cuộc trình duyệt xuống sẽ thấy.

Cách làm như sau:
Bước 1: Xác định tiện ích (Wiget mình muốn để kết dính) bằng cách vào bố cục -> lựa chọn tiện ích muốn dính -> Chỉnh sửa.
Có được ID của tiện ích như hình dưới

Bước 2: Vào Mẫu (Template) -> Chỉnh sửa HTML (Edit HTML)
Bước 3: Ctrl + F tìm tới </body> và dán code dưới đây trước nó

<script>
// Sticky widget by itviet360.com
// Free to use or share, but please keep this notice intact.
//<![CDATA[
bs_makeSticky("HTML6");
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:#f2f2f2 !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> 

- Trong đó HTML6 là ID của tiện ích vừa lấy.
Chúc các bạn vui vẻ !