Notification Bar Transparan

Kadang bar pemberitahuan atau notification bar dianggap penting dipasang pada suatu situs atau blog. Hal ini bermnfaan untuk menempatkan link atau sekedar mengisi suatu pesan penti kepada pengunjung. Kali ini saya akan terangkan cara pasang notification bar di blog. Notification bar ini berwarna transparan yang ditempatkan di bagian bawah blog dan disertai button penutupnya sehingga tidak mengganggu pengunjung ketika berselancar di blog anda. Sekarang mari kita bahas cara pasang notification bar transparan. Ikuti langkah berikut.

Log in ke blog
Klik Rancangan
Klik Edit HTML
Centang Expand Template Widget
Masukkan kode berikut di atas kode </body>

<!-- Notification code start -->
<style type='text/css'>
#ut-sticky{background:url(&#39; https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgc34qf_e19D3figJbPejHUgeVB_LUz6dKU16bBLfr2cHmXiLZZxIuqNRXNVWN-_uVaOOtEkCQ7PO4_DmtL-oizdy0XqNdkrwoNTl3Iamh51Am1XyY_Lxchd5PazQTP4NvRrDB0Ko4yRyWX/s1600/ut-bg.png&#39; ) repeat; color:#fff; text-align:center; margin:0 auto; border-top:1px solid #fff; height:28px; font-size:13px; position:fixed; bottom:0; z-index:999; width:95%; border-top-left-radius:15px; border-top-right-radius:15px; display:block; font-weight:bold; font-family:arial,&quot; Helvetica&quot; ; font-color:#fff}
#ut-sticky:hover{background:#333}
#ut-sticky p{line-height:5px; font-size:13px; text-align:center; width:95%; float:left}
#ut-sticky p a{text-decoration:underline; color:#FF3}
.ut-cross{display:block; position:relative; right:15px; float:right}
.ut-cross a{font-size:18px; font-weight:bold; font-family:&quot; Arial&quot; ; color:#F00; line-height:30px}
</style>
<div id='ut-sticky'>
<p>Pasang Bar Pemberitahuan di Blog <a href='http://blogonol.blogspot.com' target='_blank'>Transparent Notification Bar</a></p>
<div class='ut-cross'><a href='javascript:hide_cross();'>X</a></div>
</div>
<script language='JavaScript'>
function hide_cross() {
crosstbox = document.getElementById(&quot;ut-sticky&quot;);
crosstbox.style.visibility = &#39;hidden&#39;;
}
</script>
<!-- End of Notification code, info - http://blogonol.blogspot.com -->

Ganti tulisan dan kode warna merah dengan link atau pesan anda
Selanjutnya Klik Simpan Template dan lihat hasilnya
Selamat mencoba dan sukses selalu

"keep spirits and do the best"