Langsung ke konten utama

Cara Memasang Sosial Share Button Dengan Counter Dibawah Postingan

Membuat Share Button dengan Counter - Tombol membuatkan atau share button ialah widget yang mempunyai kegunaan untuk memudahkan dalam membuatkan artikel. Share button ini biasanya terhubung dengan media sosial yang dipakai untuk media dalam membagikan artikel.

Share button yang bagikan ini bisa tampil di semua device,alias responsive. Sehingga anda tidak perlu mencari tutorial menciptakan share button lain khusus untuk mobile. Bukan hanya responsive ,share button ini juga dilengkapi dengan counter/penghitung. Counter ini akan menghitung berapa kali artikel yang sudah di share jadi anda bisa tahu jumlah share yang ada.

Berikut penampakan share button yang akan saya bagikan.👇👇👇

Tombol membuatkan atau share button ialah widget yang mempunyai kegunaan untuk memudahkan dalam Cara Memasang Sosial Share Button Dengan Counter Dibawah Postingan

Bagaimana? Tertarik untuk menciptakan share buttonnya,langsung saja berikut langkah-langkah :

Membuat Share Button dengan Counter

1. Buka  blogger ,Template ➞ Edit HTML

Baca juga : Cara Membuat Share Button Sederhana dan Ringan [Seo Friendly]

2. Salin isyarat berikut kemudian letakkan diatas isyarat </body>

<script src="http://share.donreach.com/buttons.js"></script>

3. Salin isyarat berikut dan letakkan dimana share button ingin ditampilkan. Biasanya ditampilkan dibawah artikel jadi letakkan isyarat <data:post.body/>

Karena kode  <data:post.body/> bisa anda temukan lebih dari satu ditemplate blog,oleh alasannya yaitu ialah itu maka silakan pilih isyarat <data:post.body/> yang paling final anda temukan atau coba cocokan satu per satu. 

<div class="don-share" data-bubbles="right" data-limit="3">   <div class="don-share-total"></div>   <div class="don-share-facebook"></div>   <div class="don-share-twitter"></div>   <div class="don-share-google"></div>   <div class="don-share-linkedin"></div>   <div class="don-share-pinterest"></div>   <div class="don-share-tumblr"></div>   <div class="don-share-stumbleupon"></div>   <div class="don-share-reddit"></div>   <div class="don-share-buffer"></div>   <div class="don-share-xing"></div>   <div class="don-share-pocket"></div> </div> <script type="text/javascript">    (function() {     var dr = document.createElement('script');     dr.type = 'text/javascript'; dr.async = true;     dr.src = '//share.donreach.com/buttons.js';     (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dr);   })(); </script>

Lalu simpan template.

Selesai share button sudah dipasang di blog sobat. Ganti isyarat yang berwarna merah dengan jumlah sosial media yang ingin anda tampilkan. Itulah tutorial cara menciptakan share button responsive dengan counter,semoga bermanfaat.

Sumber http://www.tips-trick.com
Label:

Komentar

Posting Komentar

Postingan populer dari blog ini

Teknik Mengolah Kata Kunci, Cara Sederhana Riset Keyword Tanpa Tools

Pada postingan kali ini saya mau bagikan lagi sebuah teknik mengolah kata kunci. Agar isi dalam artikel ini praktis dipahami jadi saya menggunakan sedikit ulasan bergambar semoga nantinya praktis dipahami. Teknik ini yaitu salah satu teknik seo yang sering digunakan oleh para internet marketing untuk mampu menggaet calon pelanggannya secara tertarget. Dan percaya saja bahwa ini kali pertama anda menemukan satu dari sekian banyaknya teknik seo yang ada yang mampu membantu anda menerima visitor yang banyak. Kabar baiknya, walaupun ini yaitu seni administrasi seo marketing tapi mampu juga diaplikasikan untuk jenis website artikel. Bahkan hal ini akan sangat bagus.. Ribuan pengunjung organik google dalam 1 bulan bukan duduk duduk masalah lagi untuk mampu didapatkan secara mudah. Oleh alasannya yaitu itu simak baik-baik, baca poin per poin semoga wawasan anda mampu ditambahkan secara menyeluruh. Berikut yang akan kita pelajari... Survey Google Auto Complete Google Sugge...
Posting Komentar
Baca selengkapnya

Cara Upload File, HTML, CSS, Javascript Di Google Drive

D ari info beberapa sumber yang saya baca, bahwa Google Code ada kemungkinan tahun depan sudah tidak mampu dipakai alasannya yakni Google akan menutupnya. Nah sebagai penggantinya Google telah menyiapkan daerah gres untuk menghosting file menyerupai file dokumen, HTML, CSS, maupun JavaScript yaitu Google Drive. Untuk itu kini saya mulai mengalihkan file JavaScript dan HTML blog Kompi Ajaib dari Google Code ke Google Drive dan ternyata sangat mudah dan script berjalan sempurna. Sekarang saya akan menguraikan cara upload file HTML, CSS, atau Javascript di Google Drive. Bagi yang tertarik untuk mencobanya silahkan ikuti langkah-langkahnya di bawah ini: 1. Silahkan masuk ke Google Drive dengan link berikut https://drive.google.com/ dan login dengan akun Google Anda. 2. Kemudian klik tanda upload untuk mulai mengupload file dari komputer Anda, menyerupai pada gambar di bawah ini. 3. Silahkan pilih file yang ingin Anda upload kemudian akan muncul kotak upload, bi...
Posting Komentar
Baca selengkapnya

Vertical Dropdown Menu

Selain untuk mempercantik tampilan dan menciptakan halaman menjadi ringkas, V ertikal Dropdown menu juga bisa membuat Kategori di dalam Kategori . Nah lo.......... Apa c bahwasanya Vertikal Dropdown menu, Langsung liat aja dibawah ini : Udah tak coba di blogku yang pake template klasik, Pengin membuatnya ???? Oke Deh.... Langsung aja ikuti cara berikut : 1. Login ke blog anda 2. Masuk ke Template 3. Cari arahan : </style> </head> 4. Copy kan arahan berikut : <!--%%%%%%%%%%%% MyCSSMenu Styles [Keep in head for full validation!] %%%%%%%%%%%--> <style type="text/css"> /*!!!!!!!!!!! MyCSSMenu Core CSS [Do Not Modify!] !!!!!!!!!!!!!*/ .qmmc .qmdivider{display:block;font-size:1px;border-width:0px;border-style:solid;position:relative;z-index:1;}.qmmc .qmdividery{float:left;width:0px;}.qmmc .qmtitle{display:block;cursor:default;white-space:nowrap;position:relative;z-index:1;}.qmclear {font-size:1px;height:0px;width:0px;clear:left;line-height:0px;display:blo...
Posting Komentar
Baca selengkapnya