Sabtu, 12 Januari 2013

Jimmy Sun

Jimmy Sun

Link to Jimmy Sun

Menambahkan Tombol Like & Reblog di Tumblr

Posted: 11 Jan 2013 06:18 PM PST

Suka ngeblog di Tumblr? :) Yang suka blogging di sana pasti sudah tahu kan tentang fasilitas Like & Reblog-nya? Nah, biasanya kalau mau nge-like atau nge-reblog satu posting, kita harus masuk dulu ke postingan itu (single post) baru di kanan atas klik like / reblog. Agak repot juga kan? Bagaimana caranya supaya bisa nge-like dan reblog langsung dari halaman utama blog tumblr? Begini langkah-langkahnya:

  1. Login ke Tumblr.
  2. Buka blog Tumblr Anda.
  3. Klik Customize di kanan atas.
    customize tumblr
  4. Klik Edit HTML
    edit html tumblr
  5. Masukkan kode2 di bawah ini. Saya tidak menuliskan kodenya di sini karena tampilannya agak kacau, jadi saya gunakan pastebin.

Kode-kode yang harus dimasukkan ada beberapa, tergantung keinginan Anda:

1. Hanya menampilkan tombol default berbentuk hati

Masukkan kode yang ada di sini: http://pastebin.com/tuH8upgJ tepat sebelum </head>.

Lalu, di antara kode {block:Posts}{/block:Posts}, paste kode berikut ini dimana Anda ingin tombol Like-nya diletakkan:

<div class="my-like" data-reblog="{ReblogURL}" data-id="{PostID}" title="Like"></div>

2. Hanya menampilkan tulisan Like

Masukkan kode yang ada di sini: http://pastebin.com/Xbvziy9u tepat sebelum </head>.

Lalu, di antara kode {block:Posts}{/block:Posts}, paste kode berikut ini dimana Anda ingin tombol Like-nya diletakkan:

<div class="my-like" data-reblog="{ReblogURL}" data-id="{PostID}" title="Like">like</div>

Anda dapat mengganti kata “like” tepat sebelum </div> di atas sesuai keinginan Anda.

3. Menampilkan tulisan Like dan tombol default berbentuk hati sekaligus

Masukkan kode yang ada di sini: http://pastebin.com/vN5UwpkY tepat sebelum </head>.

Lalu, di antara kode {block:Posts}{/block:Posts}, paste kode berikut ini dimana Anda ingin tombol Like-nya diletakkan:

<div class="my-text-like" data-reblog="{ReblogURL}" data-id="{PostID}" title="Like">Like</div>
<div class="my-like" data-reblog="{ReblogURL}" data-id="{PostID}" title="Like"></div>

Menambahkan Tombol Reblog

Untuk menambahkan tombol reblog sangat mudah, tinggal paste kode di bawah ini dimana Anda ingin meletakkan tombolnya, tapi tetap harus diantara {block:Posts}{/block:Posts}:

<a href="{ReblogURL}">Reblog</a>

atau kalau ingin menampilkan button reblog:

<a href="{ReblogURL}"><img src="http://assets.tumblr.com/images/iframe_reblog_alpha.png" /></a>

Hasilnya akan seperti ini:
menambahkan tombol like dan reblog di tumblr

Untuk contoh live preview, silakan lihat di sini: Jimmy Sun on Tumblr :thumb1:

Selamat mencoba!

Credit: Tumblr Like Button

Menambahkan Tombol Like & Reblog di Tumblr

Tidak ada komentar: