Berita Terkini:
Home » , , , » Cara Memasang Tombol Like, Twitter, Google + (Sosial Bookmark) di Artikel Blog

Cara Memasang Tombol Like, Twitter, Google + (Sosial Bookmark) di Artikel Blog

Written By Ferlyando Sandala on Selasa, 26 Februari 2013 | 04.53

Cara Memasang Tombol Like, Twitter, Google + - Memasang tombol sosial bookmark di dalam artikel memiliki keuntungan tersendiri untuk kemajuan blog kita, salah stunya adalah meningkatkan page view untuk artikel tersebut. Bagaimana Cara Memasang Tombol Like, Twitter, Google + di artikel blog? Lihat gambar berikut ini
Cara Memasang Tombol Like, Twitter, Google +

Untuk memasang tombol like, twitter, google + seperti gambar diatas, silahkan ikuti panduanya berikut ini;
  1. Masuk ke akun blogger anda.
  2. Pilih dan klik Template >> Edit Html >> Lanjutkan >> centang Expand Template Widget >> tekan Ctrl + F di keyboard.
  3. Cari kode <data:post.body/> memalui form pencarian yang ada di kiri bawah.
  4. Salin kode berikut di bawah <data:post.body/>. Jika ada 2 kode <data:post.body/>, pilih yang kedua.

    <b:if cond='data:blog.pageType != &quot;item&quot;'>
    <b:if cond='data:post.isFirstPost'>
    <!-- Facebook -->
    <div id='fb-root'/>
    <script>(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 = &quot;http://connect.facebook.net/en_US/all.js#xfbml=1&quot;;
    fjs.parentNode.insertBefore(js, fjs);
    }(document, &#39;script&#39;, &#39;facebook-jssdk&#39;));

    </script>
    <!-- Google +1 -->
    <script type='text/javascript'>
    (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>

    <!-- Twitter -->
    <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>
    </b:if>
    <!-- Scripts End -->
    <!-- Horizontal social buttons Start -->

    <b:if cond='data:blog.pageType != &quot;static_page&quot;'>
    <div class='horizontal-social-buttons' style='padding:5px 0 5px;'>
    <!-- Twitter -->
    <div style='float:left;'>
    <a class='twitter-share-button' data-count='horizontal' data-lang='en' data-related='' data-via='' expr:data-text='data:post.title' expr:data-url='data:post.url' 

    href='https://twitter.com/share'>Tweet</a>
    </div>
    <!-- Google +1 -->

    <div style='float:left;'>
    <g:plusone annotation='bubble' expr:href='data:post.url' size='medium'/>
    </div>
    <!-- Facebook Like+Send -->
    <div style='float:left;'>
    <fb:like colorscheme='light' expr:href='data:post.url' font='' layout='button_count' send='true' show_faces='false'/>
    </div>
    </div>
    </b:if>
    </b:if>
    <div style='clear: both;'/>
  5. Jika sudah menyalin kode diatas, jangan di Simpan dulu tapi Pratinjau terlebih dahulu, apakah ada yang error atau tidak jika tidak ada yang error, silahkan Simpan.
  6. Klik Simpan
Hasil penerapan dari artikel Panduan Cara Memasang Tombol Like, Twitter, Google + yang saya pasang didalam artikel blog ini
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</script>
<span class='rmlink' style='float:left'> <a expr:href='data:post.url' rel='nofollow'/></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>
</b:if> 
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>

<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + &quot;#more&quot;'><data:post.jumpText/></a> 
</div>
</b:if>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:if cond='data:post.isFirstPost'>
<!-- Facebook -->
<div id='fb-root'/>
<script>(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 = &quot;http://connect.facebook.net/en_US/all.js#xfbml=1&quot;;
fjs.parentNode.insertBefore(js, fjs);
}(document, &#39;script&#39;, &#39;facebook-jssdk&#39;));
</script>
<!-- Google +1 -->
<script type='text/javascript'>
--------
--------
--------
</b:if>

Oya, coba anda kembali keatas dan lihatlah gambar, selain menampilkan tombol like, twitter dan google +, juga ada tombol bintang rating review yang sangat cantik :) Apakah anda mau memasangnya juga? Silahkan berkomentar

Selamat menerapkan artikel ini, Cara Memasang Tombol Like, Twitter, Google +
Share this article :

+ komentar + 2 komentar

Posting Komentar