kukuhcdh

Cara Membuat Tweet Button

Pada kesempatan kali ini, saya ingin mengajak anda untuk memasang tombol Tweet By Twitter. Lihat pada gambar berikut

Anda bisa membuatnya dengan mengunjungi Tweet Button
Untuk membuatnya, pertama login ke blog anda --> Rancangan --> Edit HTML klik Expand Template Widget untuk memberi tanda centang
Cari kode
<data:post.body/>
Anda akan menemukan 2 <data:post.body/> jika anda menggunakan Read More Otomatis. Letakkan kode berikut pada <data:post.body/> yang kedua.

Untuk Vertikal Count

<b:if cond="data:blog.pageType == &quot;item&quot;">
</b:if>
<div style="float: right; margin-left: 10px;">
<a class="twitter-share-button" data-count="vertical" data-via="TWITTER-USERNAME" href="http://twitter.com/share">Tweet</a>
<script src="http://platform.twitter.com/widgets.js" type="text/javascript">
</script></div>

Untuk Compact Button


<b:if cond="data:blog.pageType == &quot;item&quot;">
</b:if>
<div style="float: right; margin-left: 10px;">
<a class="twitter-share-button" data-count="horizontal" data-via="TWITTER-USERNAME" href="http://twitter.com/share">Tweet</a>
<script src="http://platform.twitter.com/widgets.js" type="text/javascript">
</script></div>

Dan Untuk Button No Count

<b:if cond="data:blog.pageType == &quot;item&quot;">
</b:if>
<div style="float: right; margin-left: 10px;">
<a class="twitter-share-button" data-count="none" data-via="TWITTER-USERNAME" href="http://twitter.com/share">Tweet</a>
<script src="http://platform.twitter.com/widgets.js" type="text/javascript">
</script></div>

*Edit yang bewarna biru sesuai kemauan anda jika anda mengerti kode tersebut.
*Sedangkan kode yang bewarna merah tersebut adalah model model dari tweet button tersebut.

Sebagai contoh

<div class='post-body entry-content'>
<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>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style='float:right; margin-left:10px;'>
<a class='twitter-share-button' data-count='none' data-via='kukuhcdh' href='http://twitter.com/share'>Tweet</a>
<script src='http://platform.twitter.com/widgets.js' type='text/javascript'/>
</div>
</b:if>
Kode tersebut adalah kode Tweet No Count yang terletak dibawah
Yang bewarna tebal kuning adalah Username Twitter saya (sekalian di follow bisa, hehe)
Yang bewarna ungu adalah <data:post.body/> yang pertama.
Yang bewarna hijau adalah  <data:post.body/> yang kedua tempat anda meletakkan kode tersebut.

Anda juga bisa menentukan diatas atau dibawah letak Tweet Button anda dengan meletakkan kode yang bewarna orange diatas kode <data:post.body/> yang kedua, sehingga menjadi seperti ini

<div class='post-body entry-content'>
<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>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'> 
<b:if cond='data:blog.pageType == &quot;item&quot;'> 
<div style='float:right; margin-left:10px;'> 
<a class='twitter-share-button' data-count='none' data-via='kukuhcdh' href='http://twitter.com/share'>Tweet</a>
<script src='http://platform.twitter.com/widgets.js' type='text/javascript'/>
 </div> 
</b:if>
 <data:post.body/>

Sebagai contoh lihat gambar berikut
Sekian, Semoga membantu.Dan selamat mencoba



Artikel Terkait:

2 Comments:

Unknown | 27 October, 2010 13:38 | [Reply]

Thanks buat informasinya...
Jadi tambahan ilmu..
Biar gak ketinggalan kabar silahkan ke sini..
Kabar Terbaru
Untuk Informasi Lowongan Kerja terbaru silahkan ke sini..
Info Lowongan Kerja Terbaru
Bagi yang doyan Jalan2 kalian bisa liat informasinya di siini!!!!
Bukit Lawang Centre
MAu liat foto terbaru tentang kabar terbaru indonesia silahkan ke sini...
Kabar Foto
nah... buat yang nyari2 article silahkan ke sini...
Kumpulan Artikel

Kukuh Cakra D | 29 October, 2010 20:31 | [Reply]

@John pinem sama sama gan

Post a Comment | Classic Comment's Form