Các bước thực hiện:
B1: Chèn đoạn CSS này vào sau vào trước thẻ ]]></b:skin>:
#top-wrap-bsw-menu{z-index:9999;width:100%;height:52px;padding:6px 0;background:#447F00;-moz-transition:all .1s ease;-webkit-transition:all .1s ease;-ms-transition:all .1s ease;-o-transition:all .1s ease;transition:all .1s ease}B2: Chèn đoạn Script này và trước thẻ đóng </head>:
.top-wrap-menu_bsw{width:100%;margin:0 auto}
.top_wrap-menu-bsw{margin:0 auto;max-width:1200px;position:relative;width:100%}
.top_wrap-menu-bsw ul,.top_wrap-menu-bsw li{margin:0 0;padding:0 0;list-style:none;}
.top_wrap-menu-bsw li a:hover{background:rgba(0,0,0,.2)}
.top_wrap-menu-bsw li a:focus{background:rgba(0,0,0,.3);color:white}
.top_wrap-menu-bsw li{margin:0 5px 0 0;float:left;display:inline;position:relative;text-transform:none}
.top_wrap-menu-bsw a{display:block;padding:0 15px;line-height:40px;text-decoration:none;color:#fff;font-size:17px;font-weight:400;text-transform:none;letter-spacing:-.11px;border-radius:4px;transition:.1s}
.res-bsw-menu{display:none;margin:0 0;paddi.top_wrap-menu-bsw ul.drop-down-bsw_menung:0 0;width:80px;height:35px;opacity:0;cursor:pointer}
.res_bsw-menu{font:bold 30px 'Roboto',sans-serif;display:none;width:35px;height:36px;line-height:36px;text-align:center}
.top_wrap-menu-bsw ul.drop-down-bsw_menu{margin:0;width:250px;background:#fff;box-shadow:0 10px 23px rgba(0,0,0,.2);position:absolute;z-index:99;border-top:6px solid #447F00;padding:0;opacity:0;visibility:hidden;transition:all .5s ease-in-out}
.top_wrap-menu-bsw ul.drop-down-bsw_menu:before{content:'';position:absolute;top:-12px;right:10px;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-bottom:12px solid #fff;left:35px}
.top_wrap-menu-bsw ul .drop-down-bsw_menu li{display:block;width:100%;font:12px 'Roboto',sans-serif;text-transform:none}
ul.drop-down-bsw_menu.morong-colum{width:500px}
.top_wrap-menu-bsw li:last-child ul.drop-down-bsw_menu{right:0}
.top_wrap-menu-bsw li:last-child ul.drop-down-bsw_menu:before{content:'';position:absolute;top:-12px;right:35px;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-bottom:12px solid #444;left:inherit}
.top_wrap-menu-bsw li:hover ul.drop-down-bsw_menu{opacity:1;visibility:visible;transform:none}
.top_wrap-menu-bsw ul.drop-down-bsw_menu a{color:#555;padding:12px 20px;line-height:normal}
.top_wrap-menu-bsw ul .drop-down-bsw_menu li a{font:400 15px Roboto!important;text-transform:uppercase;letter-spacing:.012435em}
.top_wrap-menu-bsw ul.drop-down-bsw_menu a:hover{background:rgba(0,0,0,.1)}
.top_wrap-menu-bsw ul.drop-down-bsw_menu a:focus{background:rgba(0,0,0,.3)}
.search_box_menu{display:inline;float:right}
#bsw_menu_search_box_v2_top_ws{background:rgba(0,0,0,.2) url(//3.bp.blogspot.com/-xFfHAeNGXEY/WMo2gvshvbI/AAAAAAAAAHU/o80fP425rwMHfpVrUnnQ62N7SkQWAj30gCLcB/s24/search-eee-icon--------bacsiwindows-com.png) no-repeat center left;background-position:3% 50%;outline:0;border:0;border-radius:5px;color:#eee;padding:0 10px 0 42px;font:400 16px Roboto;line-height:35px;float:left;margin:3px 0 0 0;width:350px;letter-spacing:0}
#bsw_menu_search_box_v2_top_ws::-webkit-input-placeholder{color:#ddd}
/* TOP MENU with Banner */
#bsw_bg_m_top{background:#fff;position:relative;padding:15px 0 5px 0;margin:auto;max-width:100%;overflow:hidden;text-align:left;margin:0}
.bsw_bg_m_top{width:1200px;margin:auto}
.bsw_bg_m_top a{color:#66689c;font:700 34px Roboto;text-transform:uppercase;letter-spacing:.05em}
.bsw_bg_m_top a:hover{color:333}
@media screen and (max-width:768px){.top_wrap-menu-bsw ul.drop-down-bsw_menu a{color:#ccc!important}
.top-wrap-menu_bsw{width:100%!important;margin:0 auto}
.top_wrap-menu-bsw{margin:0 auto;width:100%!important;position:relative}
#top-wrap-bsw-menu{z-index:9999;width:100%;height:55px;background:#447F00!important;position:inherit!important;top:0;padding:0}
.top_wrap-menu-bsw ul{background:rgba(48,55,59,0.98);position:absolute;top:40px;right:0;left:0;display:none;padding:15px 0!important;transition:.1s;position:relative;z-index:99999}
.top_wrap-menu-bsw ul.drop-down-bsw_menu:before{display:none!important}
.top_wrap-menu-bsw a{display:block;line-height:0;padding:10px 15px!important;text-decoration:none;color:#fefefe!important;text-transform:none}
.top_wrap-menu-bsw ul li a{font:400 18px Roboto!important}
.top_wrap-menu-bsw ul.drop-down-bsw_menu{height:auto;width:100%!important;background:transparent!important;position:inherit!important;z-index:99;display:block!important;visibility:visible;opacity:1;border:0;box-shadow:none!important;padding:8px 0!important;top:0!important;display:none;transform:none}
.top_wrap-menu-bsw li{display:block;float:none;width:100%}
.top_wrap-menu-bsw input,.top_wrap-menu-bsw label{position:absolute;top:12px;left:15px;display:block}
.top_wrap-menu-bsw input{z-index:4;width:90%}
.top_wrap-menu-bsw input:checked + label .hamburger1{transform:rotate(225deg);top:14px}
.top_wrap-menu-bsw input:checked + label .hamburger2{transform:rotate(-45deg);top:12px}
.top_wrap-menu-bsw input:checked + label .hamburger{transform:rotate(90deg);top:-50px}
.top_wrap-menu-bsw input:checked ~ ul .top_wrap-menu-bsw label{top:10px}
.top_wrap-menu-bsw input:checked ~ ul{top:55px;display:inherit;text-align:center;padding: 70px 0 0 0!important}
.top_wrap-menu-bsw input:checked + ul .drop-down-bsw_menu{display:block}
.hamburger,.hamburger1,.hamburger2{transition:.45445s!important}
.hamburger{font-size:18px;background:#fff;height:2px;display:block;position:relative;top:6px}
.hamburger1{font-size:18px;background:#fff;height:2px;display:block;position:relative;top:12px}
.hamburger2{font-size:18px;background:#fff;height:2px;display:block;position:relative;top:18px}
.top_wrap-menu-bsw .title-bsw{color:#fff;font:500 26px Roboto;text-transform:uppercase;line-height:55px;left:70px;position:absolute;letter-spacing:0;display:none}
<script>//<![CDATA[B3: Chèn đoạn code sau vào nơi muốn hiển thị Menu (Đối với các template thì thường là sau phần tiêu đề):
// sticky menu
!function(t){var e={topSpacing:0,bottomSpacing:0,className:"is-sticky",center:!1},n=t(window),i=t(document),c=[],s=n.height(),a=function(){for(var t=n.scrollTop(),e=i.height(),a=e-s,o=t>a?a-t:0,r=0;r<c.length;r++){var p=c[r],l=p.stickyWrapper.offset().top,d=l-p.topSpacing-o;if(d>=t)null!==p.currentTop&&(p.stickyElement.css("position","").css("top","").removeClass(p.className),p.currentTop=null);else{var h=e-p.elementHeight-p.topSpacing-p.bottomSpacing-t-o;0>h?h+=p.topSpacing:h=p.topSpacing,p.currentTop!=h&&(p.stickyElement.css("position","fixed").css("top",h).addClass(p.className),p.currentTop=h)}}},o=function(){s=n.height()};window.addEventListener?(window.addEventListener("scroll",a,!1),window.addEventListener("resize",o,!1)):window.attachEvent&&(window.attachEvent("onscroll",a),window.attachEvent("onresize",o)),t.fn.sticky=function(n){var i=t.extend(e,n);return this.each(function(){var e=t(this);if(i.center)var n="margin:auto;";stickyId=e.attr("id"),e.wrapAll('<div></div>').css("widthth",e.width());var s=e.outerHeight(),a=e.parent();a.css("widthth",e.outerWidth()).css("heightht",s).css("clear",e.css("clear")),c.push({topSpacing:i.topSpacing,bottomSpacing:i.bottomSpacing,stickyElement:e,currentTop:null,stickyWrapper:a,elementHeight:s,className:i.className})})}}(jQuery),$(document).ready(function(){$("#top-wrap-bsw-menu").sticky({topSpacing:0})});
//]]></script>
<div class='' id='top-wrap-bsw-menu'>Bây giờ, các bạn chỉ cần điều chinhr nội dung, url phần menu cho phù hợp với blog của bạn là xong rồi! Ở đây, mình có sử dụng Fontawesome, nếu blog bạn nào chưa có thì thêm vào nhé!
<div class='top-wrap-menu_bsw'>
<nav class='top_wrap-menu-bsw'>
<input class='res-bsw-menu' type='checkbox'/>
<label class='res_bsw-menu'><span class='title-bsw'>Trọng Khanh Nguyễn Blog</span>
<span class='hamburger'/>
<span class='hamburger1'/>
<span class='hamburger2'/>
</label>
<ul>
<li><a expr:href='data:blog.homepageUrl' itemprop='url' style='background:rgba(0,0,0,.2)'><i class='fa fa-home fa-lg'/></a></li>
<li> <a href='/search/label/Blogspot' style='margin:0 0 0 8px; color:#fff'>BLOGSPOT<i class='fa fa-angle-down' style='margin:0 0 0 8px; color:#fff'/></a>
<ul class='drop-down-bsw_menu'>
<li><a href='/search/label/Blogspot Tips'><i class='fa fa-angle-right' style='margin:0 10px 0 0'/>Thủ thuật Blogspot</a></li>
<li><a href='/search/label/Templates Blogspot' target='blank'><i class='fa fa-angle-right' style='margin:0 10px 0 0'/>Templates blogspot</a></li>
</ul>
</li>
<li><a href='/search/label/Facebook' style='background:#3b5998;color:#fff;clear:both'>FACEBOOK</a></li>
<li><a href='/search/label/Thủ thuật máy tính' style='margin:0 0 0 8px; color:#fff'>THỦ THUẬT MÁY TÍNH<i class='fa fa-angle-down' style='margin:0 0 0 8px'/></a>
<ul class='drop-down-bsw_menu'>
<li><a href='/search/label/Windows XP'><i class='fa fa-angle-right' style='margin:0 10px 0 0'/>Windows XP</a></li>
<li><a href='/search/label/Windows 7'><i class='fa fa-angle-right' style='margin:0 10px 0 0'/>Windows 7</a></li>
<li><a href='/search/label/Windows 8'><i class='fa fa-angle-right' style='margin:0 10px 0 0'/>Windows 8</a></li>
<li><a href='/search/label/Windows 10'><i class='fa fa-angle-right' style='margin:0 10px 0 0'/>Windows 10</a></li>
</ul>
</li>
<li><a href='/search/label/PSD' style='margin:0 0 0 8px; color:#fff'>PHOTOSHOP</a>
</li>
<li><a href='#' style='margin:0 0 0 8px; color:#fff'>KHÁC<i class='fa fa-angle-down' style='margin:0 0 0 8px'/></a>
<ul class='drop-down-bsw_menu'>
<li><a href='/search/label/Mẹo vặt'><i class='fa fa-angle-right' style='margin:0 10px 0 0'/>Mẹo vặt</a></li>
<li><a href='/search/label/Giải trí'><i class='fa fa-angle-right' style='margin:0 10px 0 0'/>Giải trí</a></li>
<li><a href='/search/label/Tên miền'><i class='fa fa-angle-right' style='margin:0 10px 0 0'/>Tên miền</a></li>
<li><a href='/p/hop-tac.html'><i class='fa fa-angle-right' style='margin:0 10px 0 0'/>Một số nội quy</a></li>
<li><a href='/p/lien-he.html'><i class='fa fa-angle-right' style='margin:0 10px 0 0'/>Liên hệ</a></li>
<li><a href='/p/auto-like-facebook_9.html'><i class='fa fa-angle-right' style='margin:0 10px 0 0'/>Buff Facebook</a></li>
<li><a href='/p/tri-ban-oc.html'><i class='fa fa-angle-right' style='margin:0 10px 0 0'/>Tri ân bạn đọc</a></li>
<li><a href='http://www.trongkhanhnguyen.com/p/ul.html'><i class='fa fa-angle-right' style='margin:0 10px 0 0'/>Bình luận gần đây</a></li>
<li><a href='http://www.trongkhanhnguyen.com/p/content-wrapperwidth100.html'><i class='fa fa-angle-right' style='margin:0 10px 0 0'/>Top bình luận</a></li>
</ul>
</li>
<div class='search_box_menu'>
<form action='/search' id='searchthis' method='get' style='display:inline;'>
<input id='bsw_menu_search_box_v2_top_ws' name='q' placeholder='NHẬP TỪ KHÓA TÌM KIẾM...' size='30' type='text'/>
</form>
</div>
</ul>
</nav></div></div>
Chúc các bạn thành công!
Công Cụ TEST Thử CODE JS CSS HTML Trước Khi Coppy
