Share Counters + Share Buttons Widget – Horizontal Tall (zSCbutton)

 

Berikut ini adalah tombol share (Facebook Like, Twitter Tweet, Google Plus One, dan Lintas Berita) berupa bentuk HORIZONTAL TALL (horizontal dengan tombol share kotak).

Untuk daftar lengkapnya, silahkan buka halaman utama tombol zSCbutton Share Counters + Share Buttons Widget, yang meliputi bentuk / tipe Horisontal Wide, Horizontal Tall, dan Vertical.

*

Kode HTML / Script

Silahkan pasang kode HTML ini di halaman web:

<!-- zSCbutton Horizontal Tall BEGIN -->
<div id="zscbhortdiv" style="margin:10px 0; text-align:center;">
   <div id="zscbhortcntr"><ul id="zscbhort" style="list-style-type:none;">
      <li id="zscbhortfb"><script type="text/javascript">(function() { var zlt=unescape('%3C'); var zgt=unescape('%3E'); var zq=unescape('%22'); var zloc=encodeURI(document.location.href); document.write(zlt+'iframe src='+zq+'http://www.facebook.com/plugins/like.php?href='+zloc+'&amp;send=false&amp;layout=box_count&amp;width=45&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;font&amp;height=60'+zq+' scrolling='+zq+'no'+zq+' frameborder='+zq+'0'+zq+' style='+zq+'border:none; overflow:hidden; width:45px; height:60px;'+zq+' allowTransparency='+zq+'true'+zq+''+zgt+''+zlt+'/iframe'+zgt); }) ();</script></li>
      <li id="zscbhorttw"><a href="http://twitter.com/share" class="twitter-share-button" rel="nofollow" data-count="vertical">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script><a id="zscbhortc" href="http://inimu.com/widget/zscbutton/" title="Share Counter Buttons">i</a></li>
      <li id="zscbhortgg"><g:plusone size="tall"></g:plusone><script type="text/javascript">(function() { var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true; po.src = 'https://apis.google.com/js/plusone.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s); })();</script></li>
      <li id="zscbhortlb"><script type="text/javascript">lb_skin = 'mode2';</script><script src="http://www.lintasberita.com/widget_vote/lintasberita.js" type="text/javascript"></script></li>
   </ul><script type="text/javascript" src="http://zscbutton.googlecode.com/svn/trunk/js/zscbutton-hor-tall.js"></script></div>
</div>
<!-- zSCbutton Horizontal Tall END -->

*

Widget Demo

Silahkan klik semua tombol share berikut ini untuk mencobanya. :)

  • i

*

Cara Pemasangan Kode Widget Share

Tidak ada konfigurasi yang harus dilakukan, pasang saja (copy-paste) kode tersebut pada template blog/website.

Khusus untuk blog yang menggunakan platform Blogger/Blogspot dan juga WordPress.ORG (self-hosted), berikut ini adalah cara pemasangannya.

.

1. Pasang di template Blogspot/Blogger

Silahkan login, masuk ke tab Design/Layout, lalu klik Edit HTML, centang pilihan Expand Widget Templates. Cari kode <data:post.body/> di kotak editor HTML, lalu di atas atau di bawah kode data:post.body itu pasang kode tombol share (zSCbutton) di antara kode b:if condition seperti ini:

<b: if cond='data:blog.pageType != &quot;index&quot;'>
 <b:if cond='data:blog.pageType != &quot;archive&quot;'>
  MASUKKAN KODE TOMBOL SHARE DI SINI
 </b:if>
</b:if>

Catatan: mungkin kode data:post.body itu format/penamaannya tidak persis sama pada setiap template.

.

2. Pasang di template WordPress.ORG (self hosted)

Silahkan login, masuk ke Appearance, lalu klik Editor (Themes editor). Silahkan buka template Single Post (single.php) atau Page Template (page.php). Cari kode <?php the_content(); ?>, lalu di atas atau di bawah kode the_content() itu tambahkan kode tombol share.

Catatan: mungkin kode the_content() itu format/penamaannya tidak persis sama pada setiap theme.

.

  • i
 Posted by at 20:14

  2 Responses to “Share Counters + Share Buttons Widget – Horizontal Tall (zSCbutton)”

  1. Tombol like Lintas Berita nya ga muncul gan…

Leave a Reply to adsdas Cancel reply

(required)

(required)


two + 4 =

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

zStickyBar Widget by inimu.com