Cara Membuat Floating Share Button Pada Blogger

Cara Membuat Floating Share Button Pada Blogger


Pelajar Design - Pada kesempatan ini saya akan membagikan Cara Membuat Floating Share Button Pada Blogger. Tombol Share sangatlah penting bagi sebuah website, karena berhubungan dengan kepopuleran sebuah Website Atau Blog itu sendiri. Semakin banyak orang yang share artikel dari Website Atau Blog maka semakin banyak juga pengunjung yang mendatangi Website Atau Blog kita.

Lalu kenapa Melayang / Floating ?

Apabila tombol share tersebut Melayang Atau Floating maka pengunjung tidak usah mencari dimana letak Tombol Share tersebut

Cara Membuat Floating Share Button Pada Blogger

1. Masuk ke Blogger.com.
2. Pilih menu Layout / Tata Letak > Tambahkan Gadget.

Menambahkan Gadget

3. Gunakan HTML/JavaScript.


Menambahkan HTML/JavaScript

4. Lalu pastekan kode dibawah ini pada Content.

Memasukkan Kode Floating Share Button

<div class="a2a_kit a2a_kit_size_32 a2a_floating_style a2a_vertical_style" style="left:0px; top:150px;">
    <a class="a2a_button_facebook"></a>
    <a class="a2a_button_twitter"></a>
    <a class="a2a_button_google_plus"></a>
    <a class="a2a_button_pinterest"></a>
    <a class="a2a_dd" href="https://www.pelajardzgn.my.id/share"></a>
</div>

<script async src="https://static.addtoany.com/menu/page.js"></script>

5. Simpan.

Sesuaikan posisi dengan mengatur kode style="left:0px; top:150px;

Tombol Share ini juga muncul pada tampilan Mobile. Jika menurut kalian Tombol Share ini menghalangi pembaca atau pengunjung. anda bisa menyembunyikan ditambilan Mobile nya. Anda hanya tinggal menambahkan kode dibawah ini tepat DIATAS kode ]]></b:skin>.

@media screen and (max-width: 980px) {
    .a2a_floating_style.a2a_vertical_style { display: none; }
}

Jika penempatan kode sesuai tutorial diatas maka hasilnya akan seperti berikut


Bagaimana artikel tentang Cara Membuat Floating Share Button Pada Blogger? Mudah bukan. Apabila kalian memiliki pertanyaan seputar blogger silahkan komen dibawah ya. 

You may like these posts