Saturday, April 10, 2010

Membuat Label Dengan Scroll

Ya kali ini Mas Wawan akan menjelaskan cara membuat kategori dengan scroll.
emang sih belum anyak orang menggunakan ini. tapi ndak ada salahnya kan, kalau aku coba.
beriekut adalah langkah-langkah membuatnya.

http://i40.tinypic.com/24fjhwz.jpg
Untuk membuatnya, silahkan ikuti dengan cermat langkah-langkahnya berikut ini :
  1. Login ke blogger dengan ID sobat tentunya.
  2. Buatlah Label dengan menambah Gadget pada sidebar, jangan lupa beri judul.
  3. Anggap saja sobat telah membuat judul labelnya dengan nama “Kategori”.
  4. Sekarang tuju ke Edit HTML.
  5. Klik Expand Template Widgets.
  6. Cari label yang sudah sobat buat tadi, dengan CTRL+F dan ketikkan “Kategori”, maka akan muncul kode HTML yang ribet, tapi jangan pusing melihat kode HTML tersebut.
  7. Perhatikan saja tulisan yang berwarna merah dibawah ini, kode itulah yang harus disisipkan kedalam label yang sudah sobat buat. 

<b:widget id='Label1' locked='false' title='Kategori' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div expr:class='&quot;widget-content &quot; + data:display + &quot;-label-widget-content&quot;'>
<div style='overflow:auto; width:ancho; height:250px;'>
<b:if cond='data:display == &quot;list&quot;'>
<ul>
<b:loop values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url == data:label.url'>
<span expr:dir='data:blog.languageDirection'><data:label.name/></span>
<b:else/>
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
</b:if>
<b:if cond='data:showFreqNumbers'>
<span dir='ltr'>(<data:label.count/>)</span>
</b:if>
</li>
</b:loop>
</ul>
<b:else/>
<b:loop values='data:labels' var='label'>
<span expr:class='&quot;label-size label-size-&quot; + data:label.cssSize'>
<b:if cond='data:blog.url == data:label.url'>
<span expr:dir='data:blog.languageDirection'><data:label.name/></span>
<b:else/>
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
</b:if>
<b:if cond='data:showFreqNumbers'>
<span class='label-count' dir='ltr'>(<data:label.count/>)</span>
</b:if>
</span>
</b:loop>
</b:if>
<b:include name='quickedit'/>
</div>
</div>
</b:includable>
</b:widget>

  1. Jangan lupa Simpan Template.
Setiap template mempunyai karakter yang berbeda, mungkin di blog sobat kode yang ada adala:


<div class='widget-content'>
bukan seperti yang ada di blog saya yaitu :

<div expr:class='&quot;widget-content &quot; + data:display + &quot;-label-widget-content&quot;'>   
yang penting letak kode tambahan yang disisipkan harus benar meletakkannya.

Untuk kode height:250px adalah tinggi label scroll, silahkan sobat ganti dengan angka yang lebih tinggi jika ingin tampilan menu label yang lebih tinggi.

Saya kira itu cukup sekian pelajaran blog kita kali ini, terima kasih. Applause

COMMENTS :




Don't Spam Here

7 komentar to “ Membuat Label Dengan Scroll ”

Kunjungan balik ...terima kasih atas kunjungannya ..terima kasih informasinya sangat bermanfaat

Tips Online said...
on 

Trims tambahan ilmunya. Sangat bermanfaat bagi yang tak menguasai HTML seperti saya.

Saya paling ribet kalau berurusan dengan blogspot. Mau pakai template aslinya, kok tak ada yang bagus. Mau edit sendiri, tak bisa HTML.

Siska Yuniati said...
on 

kunjungan sore..
nice info sob. sangat brguna

Kapten Teknologi said...
on 

Mantabs habis Gan, nih yang gua cari, langsung diaplikasikan Gan. Thank's buaaaaaaaaaangetz

Kapuk Online said...
on 

aq dah pasang tuch, setiap template kodenya beda2 euy

SEO AMATIR said...
on 

Terimakasih, saya dapat ilmu hari ini. Salam sukses

dimpun said...
on 

@dimpul: ya sama2 mas......

Mas Wawan said...
on 

Post a Comment

Bagi sobat-sobat silahkan comment disini, Insya Allah saya comment balik di blog anda dan Saya follow juga. Blog 7ASK adalah Blog Do Follow, Terimakasih atas kunjungan Anda..!

 

Copyright © 2008-2011 All Rights Reserved. Mobile View Powered by 7ASK / WAWAN ADIE and Distributed by Template

Facebook Twitter Mykaskus