Cách tạo thanh bar trên đầu trang Web - Blogger

Nhiều bạn hỏi mình rằng làm thế nào để thêm được liên kết, chia sẻ hay những điều cần chú ý trên đầu Website. Qua nghe miêu tả của các bạn thì mình tạm hiểu đó là các bạn muốn tạo được 1 thanh bar trên đầu trang Web hoặc Blog của mình và khi kéo thanh cuộn trình duyệt xuống thì thanh bar đó vẫn giữ nguyên cố định vị trí. Đây cũng là điều quan trọng khi bạn muốn nói cho người xem biết rằng "TÔI MUỐN NHẤN MẠNH" một điều gì đó.
Bài viết này itviet360.com sẽ hướng dẫn bạn làm được điều đó
Demo tại Blog: Thủ thuật blogspot

Cách tạo thanh bar trên đầu trang Web - Blogger

Bước 1. Vào bảng điều khiển Blogger -> Mẫu (Template) -> Chỉnh sửa HTML (Edit HTML).
Bước 2: Ctrl + F tìm tới </b:skin>  và dán code dưới đây ngay trên nó
/* Thanh tren cung hướng dẫn bởi seophongvu.com */
#mbb_bar {
background: none repeat scroll 0% 0% rgb(34, 34, 34);
width: 100%;
margin: 0px auto;
text-align: center;
padding: 5px 0px 5px 25px;
z-index: 9998;
height: 27px;
position: fixed;
vertical-align: baseline;
letter-spacing: 1px;
color: rgb(255, 255, 255);
font-size: 13px;
font-weight: bold;
font-family: Helvetica,sans-serif;
line-height: 24px;
border-top: 1px solid rgb(0, 0, 0);
border-bottom: 2px solid rgb(144, 241, 40);
text-shadow: 1px 1px 4px rgb(0, 0, 0);
text-decoration: none;
box-shadow: 1px 2px 9px rgb(144, 241, 40);
}
#mbb_bar a{
text-decoration:none;
color:#FFFC00;
font-size:12px;
font-weight:bold;
font-family: verdana, arial,"Helvetica",sans-serif;
line-height: 24px;
}
#mbb_bar a:hover{
text-decoration:underline;
}
#mbb_bar p {margin:0; list-style:none;}
#mbb_bar img {vertical-align: middle;
margin-right: 6px;}

Bước 3: Ctrl + F tìm tới </head> và dán code dưới đây ngay trên nó
<script type='text/javascript'>
//<![CDATA[
var mbb_arr = new Array();
var mbb_clear = new Array();
function mbbFloat(mbb) {
mbb_arr[mbb_arr.length] = this;
var mbbpointer = eval(mbb_arr.length-1);
this.pagetop = 0;
this.cmode = (document.compatMode && document.compatMode!="BackCompat") ? document.documentElement : document.body;
this.mbbsrc = document.all? document.all[mbb] : document.getElementById(mbb);
this.mbbsrc.height = this.mbbsrc.offsetHeight;
this.mbbheight = this.cmode.clientHeight;
this.mbboffset = mbbGetOffsetY(mbb_arr[mbbpointer]);
var mbbbar = 'mbb_clear['+mbbpointer+'] = setInterval("mbbFloatInit(mbb_arr['+mbbpointer+'])",1);';
mbbbar = mbbbar;
eval(mbbbar);
}
function mbbGetOffsetY(mbb) {
var mtaTotOffset = parseInt(mbb.mbbsrc.offsetTop);
var parentOffset = mbb.mbbsrc.offsetParent;
while ( parentOffset != null ) {
mbbTotOffset += parentOffset.offsetTop;
parentOffset = parentOffset.offsetParent;
}
return mbbTotOffset;
}
function mbbFloatInit(mbb) {
mbb.pagetop = mbb.cmode.scrollTop;
mbb.mbbsrc.style.top = mbb.pagetop - mbb.mbboffset + "px";
}
function closeTopAds() {
document.getElementById("mbb_bar").style.visibility = "hidden";
}
//]]>
</script>
Bước 4: Tìm tới <body> và dán code dưới đây ngay dưới nó
<div id='mbb_bar'>
<font style='color:#FFFC00;'/>
<strong>
<font color='#84DC04'>
  <a href='http://seophongvu.com' target='_blank'>Cong ty SEO</a>
</font>
</strong>
Phong Vũ cung cấp <a href='http://www.8dichvuseo.com' target='_blank'>Dich vu SEO</a> - Á đù <a href='http://www.itviet360.com/p/dich-vu-seo-web-gia-re-giai-phap-tot.html' target='_blank'>Dich vu SEO Website</a> Liên kết...
Bước 5: Các bạn lưu mẫu lại và xem kết quả.
Chuyên mục: , , , ,

0 nhận xét:

Đăng một bình luận