Cara buat Tombol Berbagi dibawah Postingan Blog + Smile




Cara buat Tombol Berbagi dibawah Postingan Blog + Smile
Cara buat Tombol Berbagi dibawah Postingan Blog + Smile


Kembali lagi saya akan berbagi sedikit tentang cara buat tombol share di bawah postingan blog+ simile, tombol share ini keren dan terdapat gambar emoticon / simile di sebelah kanan yang disertai slogan bebagi gratis, yang membuat pengunjung tertarik untuk klik membagikan  Postingan kita, dampak postifnya yaitu jika yang di klik itu adalah google plus , maka nilai seo postingan blog kita akan mempunyai kelebihan di mata google.
Gambar diatas merupakan , tombol share yang akan kita buat nantinya 

Membuat Share Button Keren di Bawah Postingan 
Tombol widget yang di atas saya ambil dari mas sugeng, pasti anda sudah tau siapa mas sugeng itu.
Nah kalau masalh membuat tombol widget ini sangat lah mudah jika anda sudah mengerti coding, apabila anda masih newbie seperti saya ada baiknya sama-sama kita belajar dulu untuk meningkatkan ilmu anda mengenai dunia blogger, untuk lebih jelasnya anda bisa mengikuti cara-cara di bawah ini ya, pahami baik-baik cara meletakan code di bawah ini..yuk langsung saja di peraktekan.

LANGKAH-LANGKAHNYA:
  1. Silahkan anda login terlebih dahulu ke dasbhor blog anda
  2. Jika sudah maka anda pilih template => Edit Html
  3. Kemudian anda Copy dan Pastekan kode dibawah ini diatas kode ]]></b:skin> (untuk cara mudah pencarian tekan CTRL + F)
    /* social share buttons */
    .social-buttons-box {
    height: 67px;
    background: url(http://1.bp.blogspot.com/-OYT-JDviP2k/VHrWc3ofkiI/AAAAAAAAEJs/yyNAhuCUELA/s1600/rect3799.png) no-repeat 200px 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;
    }
  4. lalu di copy kan kode di bawh ini, dan di Pastekan di bawah kode <data:post.body/>atau bisa juga <div class='post-footer'>
    <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 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>
     </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>-->
     <div style='clear: both;'/>
  5. Dan jangan lupa anda pasang kan kode js pemanggil sosmed tadi , caranya anda cari kode </body> dan pastekan kode dibawah ini diats kode </body>
    <script>
      window.___gcfg = {lang: &#39;id&#39;};
    
      (function() {
        var po = document.createElement(&#39;script&#39;); po.type = &#39;text/javascript&#39;; po.async = true;
        po.src = &#39;https://apis.google.com/js/plusone.js&#39;;
        var s = document.getElementsByTagName(&#39;script&#39;)[0]; s.parentNode.insertBefore(po, s);
      })();
    </script>
    <script>
    !function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=&quot;//platform.twitter.com/widgets.js&quot;;fjs.parentNode.insertBefore(js,fjs);}}(document,&quot;script&quot;,&quot;twitter-wjs&quot;);
    </script><div id='fb-root'/>
    <script type='text/javascript'>
    //<![CDATA[
    (function(d, s, id) {
      var js, fjs = d.getElementsByTagName(s)[0];
      if (d.getElementById(id)) return;
      js = d.createElement(s); js.id = id;
      js.src = "//connect.facebook.net/id_ID/all.js#xfbml=1&version=v2.0";
      fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));
    //]]>
    </script>
  6. Sampai disini sudah selesai, jangan lupa anda Klik Save dan lihat hasilnya.
Bagimana mudah bukan cara membuatnya, sekarang tombol sahare kerennya sudah jadi di blog anda, apa bila anda mengalami kendala bole memberi komentar di blog jelek saya ini, jika ada yang kurang jelas mohon beri masukannya, demi kemajuan blog ini.
 Sekian penjelasan saya tentang cara membuat tombol share di bawah postingan blog, semoga bisa bermanfaat untuk anda. selamat mencoba dan berhasil..terimakasih.


Share Google URL Shortener: Get Short URLloading short url

Bila Anda merasa memang artikel-artikel di blog ini bisa bermanfaat, maka Anda bisa membantu memberikan donasi melalui Paypal Dana hasil dari donasi akan digunakan untuk memperpanjang domain mizipedia.com - Terima kasih.



Comment Policy Silahkan tuliskan komentar Anda yang sesuai dengan topik postingan halaman ini. Komentar yang berisi tautan tidak akan ditampilkan sebelum disetujui.

Blogger
Disqus
Pilih Sistem Komentar Yang Anda Sukai

No comments

Peraturan Berkomentar di mizipediacom
1. Berkomentarlah dengan Relevan dan Sopan
2. Jangan Spam
3. Tidak Porn dan Sara
4. Berkomentar dengan link tanpa relevan maka akan otomatis terhapus
5. Semua komentar pasti akan saya baca dan dibalas. Show Emoticon. Klik ==>


Join on this site

with Google Friend Connect