Home » » » » » » » Membuat Stickybar Dengan Tombol Sosial Di Blogger

Membuat Stickybar Dengan Tombol Sosial Di Blogger


Pada postingan kali ini kita akan membuat bar melayang simple atau Stickybar di blogger dengan media sosial facebook dan Google+ yang akan tampil disemua halaman blog. Stickybar sangat simple dan mudah untuk Anda edit dan juga bagus untuk Anda yang ingin menambah sebuah pesan singkat berupa iklan atau link rujukan. Selain itu stickybar ini dilengkapi dengan tombol follow atau like untuk facebook dan google plus.
 

Artikel yang terkait :
Cara Membuat Horizontal Floating Share Sosial di Blogger
 

Untuk menambahkan Stickybar di blog Anda ikuti langkah-langkah di bawah ini.
  • Login ke Blogger Anda
  • Klik Template - Pilih Edit HTML
  • Cari kode di bawah ini, gunakan Ctrl+F untuk mencari :

]]>

  • Selanjutnya tambahkan kode CSS di bawah ini tepat di atasnya :

#satudelapan_bar{ background:#a7a7ab url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmfrOqV_iBrAtV4RJW9jkvC5mkF0-lea99rYVUha8WuuNBPfbBSPLr08Bdu6Om-Pu2ch606LsAPn3jIqo18z-6oF7Aa7AIdZc9KuvqIOWbQwnQsNDD1R-u9yEdPyYreNeB8Xgv8pV0VhQ/s1600/stickybar-satudelapan.png') repeat-x;
width:100%;
margin:0 auto;
text-align:center;
padding:3px 0 0 0;
border-bottom: 1px solid #888888;
-moz-box-shadow: #666666 0px 1px 3px;
-webkit-box-shadow: #666666 0px 1px 3px;
box-shadow: #666666 0px 1px 3px;
z-index: 999;
height: 28px; position:fixed;
line-height: 1.85em;
vertical-align: baseline;
letter-spacing: 1px;
color:#fff;
font-size:12px;
font-weight:bold;
font-family: arial,"Helvetica",sans-serif;
}
#satudelapan_bar a{
text-decoration:underline;
color:#E2E504;
}
#satudelapan_bar a:hover{
text-decoration:none;
}
#satudelapan_bar p {margin:0; list-style:none;}
#satudelapan_bar img {vertical-align: middle;
margin-right: 6px}

  • Berikutnya cari kode dan tambahkan kode javascript dibwah ini tepat dibawahnya : 



  • Setelah itu cari tag dan tambahkan kode HTML dibawah ini tepat di bawahnya :

www.satu-delapan.blogspot.com

Liked us?