shad0w-share

Tutorial yang mau saya bahas kali ini adalah membuat scroll pada label. Bagi yang labelnya banyak pasti ribet kalau labelnya memanjang sampe ke bawah gitu. Mangkanya ditambahin scroll biar lebih hemat tempat dan pastinya bikin loading blog cepet. Kalau pingin liat contohnya seperti ini :



Caranya simpel aja kok.
1. Pertama mulai dengan Login ke blogger.com
2. Masuk ke Rancangan dilanjutkan ke Edit HTML
3. Kemudian cari kode dibawah ini :

<b:widget id="Label1" locked="false" title="Labels" type="Label">
<b:includable id="main">
<b:if cond="data:title">
<h2><data:title></data:title></h2>
</b:if>
<div class="widget-content">
<ul>
<b:loop values="data:labels" var="label">
<li>
<b:if cond="data:blog.url == data:label.url">
<span dir="data:blog.languageDirection">
<data:label.name>
</data:label.name></span>
<b:else>
<a dir="data:blog.languageDirection" href="data:label.url">
<data:label.name>
</data:label.name></a>
</b:else>
<span dir="ltr">(<data:label.count>)</data:label.count></span>
</b:if></li>
</b:loop>
</ul>
<b:include name="quickedit">
</b:include></div>

Kalo udah tambahin kode seperti di bawah ini :

<div style="overflow: auto; height: 300px;">

dan

</div>

Masukan kode berwarna merah dalam format seperti ini

<b:widget id="Label1" locked="false" title="Labels" type="Label">
<b:includable id="main">
<b:if cond="data:title">
<h2><data:title></data:title></h2>
</b:if>
<div class="widget-content">
<div style="overflow: auto; height: 300px;">
<ul>
<b:loop values="data:labels" var="label">
<li>
<b:if cond="data:blog.url == data:label.url">
<span dir="data:blog.languageDirection">
<data:label.name>
</data:label.name></span>
<b:else>
<a dir="data:blog.languageDirection" href="data:label.url">
<data:label.name>
</data:label.name></a>
</b:else>
<span dir="ltr">(<data:label.count>)</data:label.count></span>
</b:if></li>
</b:loop>
</ul>
<b:include name="quickedit">
</b:include></div> </div>

Yang berwarna merah adalah kode scrollnya. Sedangkan yang berwarna biru adalah kode untuk button. Kode berwarna biru bisa diganti menjadi <ol> dan diakhiri dengan </ol> untuk diganti menjadi angka.

Selamat mencoba semoga berhasil dan dapat bermanfaat.



KOMENTAR ANDA SANGAT BERMANFAAT BAGI PERKEMBANGAN BLOG INI

Description: Cara Membuat Scroll Pada Label
Rating: 4.5
Reviewer: Unknown
ItemReviewed: Cara Membuat Scroll Pada Label