Tuesday, November 22, 2011

Tutorial Letak Tweet Button Di Setiap Post


Okey, sekarang ni kita try lak Tutorial ni yang mana Tweet Button boleh diletak di setiap entri atau post yang anda buat. Kalau anda ikut langkah demi langkah InsyaAllah akan menjadi. Jom kita mula:-

(1) Pergi ke Dashboard > Design > Edit HTML

(2) Sila Back Up template anda

(3) Klik Expand Widget

(4) Kemudia tekan (Ctrl + F)

(5) Dan taip atau copy code ini :- <data:post.body/>

(6) Copy code di bawah dan letakkan di bawah kod di atas.

<!-- Twitter tweet button Start -->
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<div style='text-align:left;padding:5px 5px 5px 0;'>
<a class='twitter-share-button' data-count='vertical' expr:data-text='data:post.title' expr:data-url='data:post.url' data-via='@syzulaikha' data-related='' href='http://twitter.com/share'>Tweet</a>
<script src='http://platform.twitter.com/widgets.js' type='text/javascript'></script>
</div>
</b:if>
<!-- Twitter tweet button End -->

(6) Untuk Button Configuration
Pilih butang yang disukai dan ikuti langkah-langkah untuk menukar sesetengah coding di bawah:-

Button typeAttributeValue
               Twitter tweet with counterdata-countvertical
          tweet counter on sidehorizontal
              tweet stand alonenone
Follow recommendation 1
data-viaYour Twitter username 
Follow recommendation 2
data-relatedSecond Twitter username

(7) Ketika Preview anda boleh melihat Tweet Button anda di sebelah kiri. Anda boleh menukar kedudukan Tweet Button mengikut kesukaan anda.

(8) Untuk kedudukan sebelah kanan, tukar 'text-align:left kepada 'text-align:right

(9) Untuk kod static di page anda boleh buang kod yang berwarna merah di line 2 dan 11

(10) Untuk butang tweet yang hanya dipaparkan di page entry, gantikan kod di line 2 (warna merah), dengan kod <b:if cond='data:blog.pageType == &quot;item&quot;'> dan delete kod expr:data-text='data:post.title' di line 4.

Preview dulu hasil kerja anda.

Sekiranya sudah ok anda boleh Save

Selamat Mencuba (",)

5 comments:

  1. wah teror ..cam mana buat code tu nampak ye ?

    ReplyDelete
  2. thks akk, kena copy kat Compose, klu letak kat HTML mmg akan hilang. Pening gak nak buat. Try and error byk kali hehe

    ReplyDelete

LinkWithin

Related Posts Plugin for WordPress, Blogger...