Hướng dẫn thêm info bar vào blog wordpress

Đôi khi bạn cần đặt một thông báo nhỏ nào đó lên blog của mình mà không muốn làm họ khó chịu, không muốn đặt một popup hoặc phải đặt một đoạn js nặng nề lên trang của mình. đó là lúc bạn cần hướng dẫn sau đây.

1) mở file style.css của theme mà bạn đang sử dụng, thêm vào dòng sau

/* infoBar Mod */
#info {
width: 99.9%;z-index:1000;
font-family: Verdana, Arial, Helvetica, sans-serif;font-size:15px;
font-weight: normal;
position:fixed;
left:0;top:0;
cursor:pointer;
}
#infobar{
opacity:0.8;
display: block;
width:100%;
background: #737CA1 fixed .3em .3em;padding: .01em .3em .01em .3em;border-bottom: .16em outset;border-color: #488AC7;
position:fixed;
left:0;top:0;
cursor:pointer;
}#infobar a, #infobar a:link, #infobar a:visited, #infobar a:active {
clear: both;
color: #FDEEF4;
text-decoration: none;
text-shadow: 0 0 0.2em #87F, 0 0 0.2em #87F, 0 0 0.2em #87F;
}
#infobar:hover {
opacity:1;
}
/*END infoBar Mod */

Bước trên này là chúng ta đã đặt những thuộc tính css cho khung hiển thị của chúng ta lên đầu trang và mờ đi, khi đưa chuột vào thì mới hiên rõ lên, hiệu ứng đẹp và tinh tế.

2) mở file footer.php và thêm vào trên </body> dòng sau đây

<div id=’info’>
<div align=’center’ id=’infobar’>
<!–Code của bạn ở đây –>
</div>
</div>

Bước trên này là để bạn thêm đoạn code vào cuối trang để load sau cùng.