[Update] Cara Buat Tombol Share di Blog ala Evo Magz

Cara membuat dan memasang tombol share sosial media di Blog Seperti Evo Magz - Memasang tombol share sosial media di Blog merupakan salah satu cara yang dapat meningkatkan jumlah pengunjung di blog, Sebagai contoh bila ada pengunjung yang mengunjungi salah satu artikel blog anda dan pengunjung tersebut membagikan/menshare artikel tersebut, maka otomatis salah satu artikel yang di share tadi jika menarik perhatian orang lain akan di Klik/dikunjungi. Itulah manfaat memasang tombol share di Blog, Oleh karena itu kali ini saya akan membagikan Cara membuat atau memasang Tombol share di bawah postingan blog.

Bukan hanya Tombol share biasa, yang saya share ini adalah Tombol Share media sosial karya Mas Sugeng yang di pasang di template Evo Magz (template Blog terbaik buatan mas sugeng)


Tertarik memasang Tombol share media sosial seperti diatas, Jangan khawatir jika tidak sesuai dengan template yang anda gunakan, ditutorial ini akan saya jelaskan cara menyesuaikannya. Ok langsung aja.

Cara Membuat Tombol Share media sosial Seperti Evo Magz.


  • Pertama silahkan masuk ke Akun Blogger anda dan plih Template - Edit HTML
  • Setelah itu cari kode ]]</b:skin> atau </style> (Untuk mempercepat pencarian silahkan, CTRL+F pada keyboard)
  • Jika sudah ketemu silahkan copy code CSS dibawah ini dan paste di atasnya
/* Social Share Buttons ala Evo Magz*/
.social-buttons-box {
height: 67px;
background: url(http://3.bp.blogspot.com/-moj4-jk-UB0/U1qCkCPaGQI/AAAAAAAADTY/tixmak8NHV8/s1600/share.png) no-repeat 330px 0px;
margin:20px 0 15px;
overflow:hidden;
}
.social-buttons {
margin:0 0;
height:67px;
float:left;
}
.social-buttons .share {
float:left;
margin-right:10px;
display:inline-block;
}
.share-btn {
margin:15px 0 25px;
height:20px;
overflow:hidden;
}
  • Kemudian cari Code <data:post.body/> (Biasannya kode tersebut ada lebih dari satu, Silahkan anda pilih code yang terakhir atau bisa anda sesuaikan sendiri nantinnya)
  • Dan Copy code CSS di bawah ini, kemudian paste tepat dibawah code <data:post.body/> 
<div class='social-buttons-box'>
<div class='social-buttons'>
<div class='share gplus'><div class='g-plusone' data-size='tall' expr:data-href='data:post.url'/></div>
<div class='share like'><div class='fb-like' data-action='like' data-layout='box_count' data-share='false' data-show-faces='false' expr:data-href='data:post.url'/></div>
<div class='share fbshare'><div class='fb-share-button' data-type='box_count' expr:data-href='data:post.url'/></div>
<div class='share tweet'><a class='twitter-share-button' data-count='vertical' data-lang='en' data-size='normal' expr:data-url='data:post.url' href='https://twitter.com/share'>Tweet</a></div>
<div class='share linkedin'><script src='//platform.linkedin.com/in.js' type='text/javascript'>
lang: en_US </script><script data-counter='top' expr:data-url='data:post.url' type='IN/Share'/></div>
</div>
</div>
<!-- <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?&#39;http&#39;:&#39;https&#39;;if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+&#39;
://platform.twitter.com/widgets.js&#39;;fjs.parentNode.insertBefore(js,fjs);}}(document, &#39;script&#39;, &#39;twitter-wjs&#39;);</script>-->
  • Terakhir Simpan Template
Keterangan : Silahkan ganti warna Biru diatas dengan URL Gambar lain, jika gambar sharenya terlalu besar atau jika anda tidak menyukainnya, dan Ganti warna Merah untuk menyesuaikan gambar pada postingan


Demikian artikel tentang cara membuat Tomboh share media sosial ala Evo Magz, Jika anda kesulitan bisa anda tannyakan di kommentar. Semoga berhasil dan Terima kasih!

Related Post :

6 Komentar untuk "[Update] Cara Buat Tombol Share di Blog ala Evo Magz"

gagal diterapkan gan, kok tidak muncul di blog anae.

Gagalnya gimana mas ahmad, silahkan diteliti kembali pemasangannya, mungkin aja ada yang salah

Assalamualaikum mas Pur, salam kenal.

Pas nemu artikel ini, sdg cari solusi problem tombol counter di blog saya.
Sebelumnya bekerja dg baik, namun skrg bermasalah, counter G+ dan Tweeter TIDAK BEKERJA, TIDAK UPDATE tombol counternya. Mohon solusi.

Terimakasih mas Pur, ini link blog saya :

http://mysweetladyluck.blogspot.com/2016/04/lukis-gelas-kaca-hobbyku-menghasilkan.html?showComment=1459848989116#

Solusinya coba hapus dan ganti Script tombol share counternya dengan yang lebih baru. Mungkin saja yang lama scriptnya ada yang kehapus.

Ini sih jadi solusi terakhir bila agan sudah tidak dapat membetulkannya

Min kalo cara memperbaiki tombol next & previous template evo magz gimana min? Tombol next sama previous page template evo magz saya kadang suka disitu" aja asal di tekan ga pindah page.

Maksudnya gimana ya gan saya sedikit ngak ngerti, tapi Sudah saya cek ke blog agan ngak ada masalah tuh pada tombol next & prev bawaan template evo magz. Namun jika agan pasang tombol next & prev dari blog lain silahkan tanyakan saja disana.

# Silahkan berkommentar besuai Topik.
# Disini anda boleh menyisipkan Link di Commentar
# Tetapi akan saya moderasi atau Review terlebih dahulu
# Dan Jangan sampai kommentar anda mengandung SPAM.

# Terima Kasih