Tuesday, 26 March 2013

Cara Mudah Membuat Widget Label Berputar - Putar

Cara Mudah Membuat Widget Label Berputar - Putar di sidebar blog merupakan cara alternatif kita untuk mengedit supaya blog tambah cantik. Mendesain blog yang unik dan menarik akan disukai pengunjung. Apalagi dengan kehadiran widget label berputar putar diblog anda. Visitor pun dapat sekedar bermain main di blog. Tampilan dari Widget Label Berputar-putar
Cara Mudah Membuat Widget Label Berputar - Putar Jona Rendra

Serupa gambar diatas widget yang kali ini saya berikan untuk anda. Tampak semua label blog anda di sebuah kotak dengan tampilan 3D. Menarik sekali untuk dipasang bukan? Langsung saja saya berikan tutorialnya.

Cara Membuat Widget Label Berputar - Putar

1. Seperti biasa, login dulu ke http://www.blogger.com/ menggunakan akun anda
2. Setelah muncul dashboard blogger anda, cari menu Template
3. Klik Edit HTML dan cari kode <b:section class='sidebar' id='sidebar' preferred='yes'>
4. Copy kode HTML dibawah ini dan paste di bawah kode <b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='Label99' locked='false' title='Label Berputar Putar' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<script src='http://sites.google.com/site/bloggerustemplatus/code/swfobject.js' type='text/javascript'/>
<div id='flashcontent'><small>created by<a href='http://jonarendra.blogspot.com/'>Jona Rendra</a></small></div>
<script type='text/javascript'>
var so = new SWFObject(&quot;http://sites.google.com/site/bloggerustemplatus/code/tagcloud.swf&quot;, &quot;tagcloud&quot;, &quot;240&quot;, &quot;300&quot;, &quot;7&quot;, &quot;#3050a0&quot;);
// uncomment next line to enable transparency
//so.addParam(&quot;wmode&quot;, &quot;transparent&quot;);
so.addVariable(&quot;tcolor&quot;, &quot;0x333333&quot;);
so.addVariable(&quot;mode&quot;, &quot;tags&quot;);
so.addVariable(&quot;distr&quot;, &quot;true&quot;);
so.addVariable(&quot;tspeed&quot;, &quot;100&quot;);
so.addVariable(&quot;tagcloud&quot;, &quot;<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='12'><data:label.name/></a></b:loop></tags>&quot;);
so.addParam(&quot;allowScriptAccess&quot;, &quot;always&quot;);
so.write(&quot;flashcontent&quot;);
</script>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>sidebar' id='sidebar' preferred='yes'>

Keterangan :
  • Untuk kode lebar dan tinggi bisa anda ganti dengan kolom yang sesuai dengan widget anda. 240 itu tingginya, 300 itu lebarnya
  • Kode yang berwarna biru bisa anda ganti dengan HTML warna anda. Jika belum mendapatkan background warna yang cocok, cek kode warna disini.
6. Klik simpan template. Pengeditan HTML pun selesai, coba buka blog anda sekarang apakah sudah berhasil terpasang widgetnya.

Mudah kan? cara yang saya berikan, pada widget, label akan berputar semakin cepat jika kursor diarahkan di tepi atau pinggir widget. Lebih tepatnya di paling pojok dan lihatlah label anda berputar semakin cepat.

Bagaimana? apakah anda sudah berhasil memasang widget label berputar? Sekian dulu postingan Jona Rendra saya yang berjudul Cara Mudah Membuat Widget Label Berputar - Putar, semoga bermanfaat untuk anda dan jika ada pertanyaan silahkan poskan komentar

KATEGORI:
arrow_back
arrow_forward

9 komentar

wuih, keren widgetnya sob..
boleh dicoba?

saya pernah pakai script ini, tp kok selalu gagal ya..?

come back.

mungkin salah meletakkan kode HTML
coba perhatikan lagi

jangan di HTML/Javascript, pasangnya di edit html

Berkomentarlah dengan baik dan benar, dilarang SPAM!
Tata Tertib Berkomentar
EmoticonEmoticon