Cara Memasang Share Button Keren di Blog


Cara Memasang Share Button Keren di Blog


Cara Memasang Share Button Keren di Blog - Tombol share dibawah postingan blog sangat penting dipasang untuk membagikan artikel yang di posting ke berbagai social networking, semakin banyak yang orang datang ke halaman blog anda dan dishare maka makin banyak juga peluang web anda menjadi rami pengunjung.

Selain itu memasang share button di blog juga bisa meningkatkan kualitas seo blog, walaupun sudah banyak sekali yang share artikel tentang membuat atau memasang tombol share pada blog, namun disini saya juga ingin berbagi yang tak kalah keren dengan mastah lain tentang membuat tombol share dibawah postingan.

Tombol share blog biasanya berisikan tombol sosial networking seperti facebook, twitter, google plus, digg dan masih banyak lagi yang lainnya. Nah, bagi sahabat yang ingin memasangnya juga pada blog, silahkan anda ikuti tutorial berikut ini.

Cara Membuat Tombol Share Button dibawah Postingan Blog :


1. Silahkan anda login ke blogger anda, kemudian silahkan anda masuk kebagian Template dan Edit HTML

2. Silahkan copykan kode berikut ini diatas kode ]]</b:skin> atau </style>

.share-buttons-box {height: 67px;background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5YwDj1JiBq3mOZmFLC_PR_iQRAnjjRGluxwmOhFuO9Vayii2WfQ46U09VcNHnsqnmtS9Kt5ffWIfu0ZJwknM4gt13tUDifmSaHQO1RSkpOby_4r7N4jaoLrIe9cLktM54msr6rTtgUZ1a/s1600/share.png) no-repeat 330px 10px;margin:20px 0 15px;overflow:hidden;}
.share-buttons{margin:0 0;height:67px;float:left}
.share-buttons .share{float:left;margin-right:10px;display:inline-block}
3. Silahkan anda cari lagi kode <data:post.body/> dan pastekan kode berikut ini tepat dibawah kode tersebut :

<div class='share-buttons-box'>
        <div class='share-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>
4. Save template dan lihat hasilnya...
5. Selesai...

Tombol share button ini  saya terinspirasi dari template evo magz mas sugeng yang keren dan ganteng sekali. Karena templatenya banyak yang keren widgetnya seperti cara membuat popular post keren dan masih banyak lagi tutorial blog keren disini.

Silahkan pasang sekarang juga Share Button Keren di Blog anda, jika terdapat error kode diatas silahkan berkomentar dibawah ini secepat mungkin akan diperbaiki oleh admin blog mahrus-net.

14 Responses to "Cara Memasang Share Button Keren di Blog"

  1. pakai javascript juga ya mas... makasih ne mas, share button cocok buat blog saya yang satu lagi...

    BalasHapus
  2. sekarang mulai trend pasang tombol share via whatsapp, kompas dah pake bro.

    BalasHapus
  3. Jadinya kenapa ya mas kok vertical... gak horisontal

    BalasHapus
  4. pas banget lagi dibutuhkan. artikel bermanfaat

    BalasHapus
  5. untuk pasang share whatapp caranya gmn ya? aku coba kok gk bisa!!apa ngaruh sama templetnya ya???makasih

    BalasHapus
  6. membantu sangat. matur nuwun sangat mas bro

    BalasHapus
  7. jadi juga dahh, thanks bro

    BalasHapus
  8. terus untuk menghilangkan tulisan share tu gmn?

    BalasHapus

Jangan cuma dibaca aja, tinggalin komentar juga ya...