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 HTML3. 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.