Horisontal Floating Automatic Hidden Social Sharing Bar adalah salah satu widget yang posisinya akan melayang dan berada pada bagian atas blog/situs Anda. Horisontal Floating Automatic Hidden Social Sharing Bar ini akan muncul ketika Anda atau pengunjung sedikit saja menggulirkan ke bagian bawah halaman blog/situs Anda. Widget ini akan lansung tersembunyi jika Anda berada pada bagian paling atas blog/situs Anda, dan widget ini akan menghilang bila Anda menekan tombol close (x).

Horisontal Floating Automatic Hidden Social Sharing Bar ini adalah widget yang sempurna dan tidak menghabiskan tempat. Pada widget ini saya telah melakukan perubahan agar tampilannya lebih sempurna seperti saya menambahkan icon google + ,pinterest dan logo/gambar. Untuk lebih singkatnya silahkan Anda lihat di blog yang tidak pernah saya urus lagi dengan cara menekan tombol di bawah ini, dan gulirkan sedikit saja ke bawah maka Horisontal Floating Automatic Hidden Social Sharing Bar ini akan muncul.



Cara memasang Horisontal Floating Automatic Hidden Social Sharing Bar di blogger


Untuk memasang Horisontal Floating Automatic Hidden Social Sharing Bar pada blog/situs Anda juga cukup mudah silahkan Anda ikuti langkah-langkah berikut untuk mulai memasangnya pada blog/situs Anda.

1. Login ke akun blogger Anda.

2. Pada Dasbor klick Template ➨ Edit HTML

3. Centang Expand Template Widget ➨ Backup dulu templatenya untuk mengantisipasi bila terjadi kesalahan.

4. Selanjutnya dalam Edit HTML Anda cari kode </head> Jika kesulitan mencarinya coba lihat Cara Cepat Mencari Kode HTML.

5. Bila sudah ketemu tepat di atas kode tersebut letakkan kode berikut.



<script type='text/javascript'>var switchTo5x=true;</script>
<script src='https://otowebsite-blogspot.googlecode.com/svn/trunk/share_buttons.js' type='text/javascript'/>
<script src='https://otowebsite-blogspot.googlecode.com/svn/trunk/share_loader.js' type='text/javascript'/>


6. Sekarang cari kode  ]]></b:skin> atau <style> dan letakkan kode CSS berikut tepat di atasnya.



<style type="text/css">
.stpulldown-gradient
{
background: #E1E1E1;
background: -moz-linear-gradient(top, #E1E1E1 0%, #A7A7A7 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#E1E1E1), color-stop(100%,#A7A7A7)); /* webkit */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#E1E1E1', endColorstr='#A7A7A7',GradientType=0 ); /* ie */
background: -o-linear-gradient(top, #E1E1E1 0%,#A7A7A7 100%); /* opera */
color: #636363;
}
#stpulldown .stpulldown-logo
{
height: 40px;
width: 300px;
margin-left: 20px;
margin-top: 5px;
background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6JwIcw-p3MlUsRuN_1BNAry0pC7bD7pYa2w8RPb1zJwjkyUhlFFdWNdwoQG9mVDDixxhIusR3zes4uL10Rmec-lpThwt_Ri1fqaOZh-utm3YPXPQBt3KeVJuNnhEt15ffQHaK4iotDQ/s1600/blackOW.png") no-repeat;
}
</style>

Ganti yang bewarna biru dengan Url logo/gambar Anda, Max ukurannya 300 x 40 px.

7. Langkah selanjutnya, cari kode </body> dan letakkan kode berikut ini tepat di atasnya.



<script>
var options={ "publisher": "d4be5209-8eb5-4854-8391-917faf746b47", "scrollpx": 50, "ad": { "visible": false}, "chicklets": { "items": ["facebook", "twitter", "googleplus", "linkedin", "pinterest", "sharethis"]}};
var st_pulldown_widget = new sharethis.widgets.pulldownbar(options);
</script>


8. Simpan template.

Sekarang Anda bisa lihat sendiri hasilnya.

Saya rasa cukup untuk kali ini, mudah-mudahab Anda suka dengan widget ini!

Silahkan tinggalkan tanggapan atau komentar Anda tentang postingan atau article di atas.

Posting Komentar Blogger Disqus

Catatan:
Untuk menyisipkan kode, gunakan tag <i rel="code">KODE ANDA...</i>
Kode yang panjang bisa menggunakan tag <i rel="pre">KODE PANJANG ANDA...</i>
Untuk menyisipkan gambar, gunakan tag <i rel="image">URL GAMBAR...</i>
Untuk menyisipkan judul, gunakan tag <b rel="h3">JUDUL ANDA DI SINI...</b>
Untuk menciptakan efek tebal gunakan tag <b>TEKS ANDA DI SINI...</b>
Untuk menciptakan efek huruf miring gunakan tag <i>TEKS ANDA DI SINI...</i>

Penting:
Jika Anda mengajukan pertanyaan klik 'Subscribe by email' link di bawah form komentar untuk mengetahui komentar balasan.

Khusus untuk membalas komentar disarankan menggunakan tombol balas/reply di samping komentar terkait dibandingkan menggunakan formulir komentar di bawah agar komunikasi lebih terstruktur.

Dilarang Meninggalkan Link Aktif, Link Aktif Terpaksa Akan Saya Hapus Dari Komentar.

NB: Jika ingin menuliskan kode pada komentar harap gunakan Tool untuk mengkonversi kode tersebut agar kode bisa muncul dan jelas atau gunakan tool dibawah "Konversi Kode di Sini!".

Konversi Kode di Sini! Daftar Member Aktif

 
Top