Warung Bebas

Selasa, 27 Desember 2011

Cara Menampilkan Share Button

Cara Menampilkan Share Button | Tutorial Blog

Bagi sobat blogger yang sudah pernah atau sering gonta ganti template yang diambil dari penyedia template mungkin tidak bisa memakai fitur Share Button. karena kode Share botton pada design template tersebut mungkin fiturnya tidak ada, jadi Share botton-nya tidak muncul.
Berikut Cara Memunculkan Share Button di Blogger :
  • Masuk ke blogger, klik Design > Page Element
    Cara Menampilkan Share Button
  • Kemudian klik Edit pada Blog Posts
    Cara Menampilkan Share Button
  • Beri centang pada Show Share Buttons
    Cara Menampilkan Share Button
  • Klik Save dan cek apakah muncul tombol sharenya
    Cara Menampilkan Share Button
  • Jika masih belum muncul silahkan ke tab menu Edit HTML
    Cara Menampilkan Share Button
  • Beri centang pada Expand Widget Templates.
    Cara Menampilkan Share Button
  • Cari kode <b:includable id='backlinks' var='post'>.
  • Letakkan kode berikut diatas kode <b:includable id='backlinks' var='post'>.
    <b:includable id='shareButtons' var='post'>
      <b:if cond='data:top.showEmailButton'><a class='goog-inline-block share-button sb-email' expr:href='data:post.sharePostUrl + &quot;&amp;target=email&quot;' expr:title='data:top.emailThisMsg' target='_blank'>
          <span class='share-button-link-text'><data:top.emailThisMsg/></span>
      </a></b:if><b:if cond='data:top.showBlogThisButton'><a class='goog-inline-block share-button sb-blog' expr:href='data:post.sharePostUrl + &quot;&amp;target=blog&quot;' expr:onclick='&quot;window.open(this.href, \&quot;_blank\&quot;, \&quot;height=270,width=475\&quot;); return false;&quot;' expr:title='data:top.blogThisMsg' target='_blank'>
          <span class='share-button-link-text'><data:top.blogThisMsg/></span>
      </a></b:if><b:if cond='data:top.showTwitterButton'><a class='goog-inline-block share-button sb-twitter' expr:href='data:post.sharePostUrl + &quot;&amp;target=twitter&quot;' expr:title='data:top.shareToTwitterMsg' target='_blank'>
          <span class='share-button-link-text'><data:top.shareToTwitterMsg/></span>
      </a></b:if><b:if cond='data:top.showFacebookButton'><a class='goog-inline-block share-button sb-facebook' expr:href='data:post.sharePostUrl + &quot;&amp;target=facebook&quot;' expr:onclick='&quot;window.open(this.href, \&quot;_blank\&quot;, \&quot;height=430,width=640\&quot;); return false;&quot;' expr:title='data:top.shareToFacebookMsg' target='_blank'>
          <span class='share-button-link-text'><data:top.shareToFacebookMsg/></span>
      </a></b:if><b:if cond='data:top.showOrkutButton'><a class='goog-inline-block share-button sb-orkut' expr:href='data:post.sharePostUrl + &quot;&amp;target=orkut&quot;' expr:title='data:top.shareToOrkutMsg' target='_blank'>
          <span class='share-button-link-text'><data:top.shareToOrkutMsg/></span>
      </a></b:if><b:if cond='data:top.showBuzzButton'><a class='goog-inline-block share-button sb-buzz' expr:href='data:post.sharePostUrl + &quot;&amp;target=buzz&quot;' expr:onclick='&quot;window.open(this.href, \&quot;_blank\&quot;, \&quot;height=415,width=690\&quot;); return false;&quot;' expr:title='data:top.shareToBuzzMsg' target='_blank'>
          <span class='share-button-link-text'><data:top.shareToBuzzMsg/></span>
      </a></b:if>
      <b:if cond='data:top.showDummy'>
        <div class='goog-inline-block dummy-container'><data:post.dummyTag/></div>
      </b:if>
    </b:includable>
  • Selanjutnya cari kode <div class='post-footer'> atau di posisi line 2, line 3,misalnya line 3 : <div class='post-footer-line post-footer-line-3'>.
  • Lalu letakkan kode berikut di bawah kode tersebut.
    <div class='post-share-buttons goog-inline-block'>
            <b:if cond='data:post.sharePostUrl'>
              <b:include data='post' name='shareButtons'/>
            </b:if>
          </div>
  • Klik Save Template dan lihat hasilnya.
    Cara Menampilkan Share Button
Selamat mencoba dan semoga bermanfaat...

0 komentar em “Cara Menampilkan Share Button”

Poskan Komentar

 

M-Kolom Tutorial | All Tutorial Copyright © 2012 Fast Loading -- Powered by Blogger