Cara membuat Box Roll pada label

Hmmm... apa kabar readers, hari ini zahra mau buat tutor Cara membuat Box Roll di label kita. Sekilas tampilannya klik disini atau seperti gambar di samping. :)

Jadi, gimana caranya?

• Seperti biasa kita harus Log In dulu -> Dasbor -> Rancangan -> Edit Html
• Centang pada Expand Template Widget. Lalu cari kode berikut. (agar lebih mudah tekan ctrl+F secara bersamaan)

<b:widget id='Label7' locked='false' title='NAMA LABEL ANDA' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>

<div expr:class='"widget-content " + data:display + "-label-widget-content"'>

<b:if cond='data:display == "list"'>
<ul>

• Ganti kode yang berwarna merah diatas dengan kode berikut

<div expr:class='"widget-content " + data:display + "-label-widget-content"' style='overflow:auto; height:200px'>

•  Jadi akan tampak kode keseluruhan seperti dibawah ini

<b:widget id='Label7' locked='false' title='NAMA LABEL ANDA' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>

<div expr:class='"widget-content " + data:display + "-label-widget-content"' style='overflow:auto; height:200px'>

<b:if cond='data:display == "list"'>
<ul>

NB: 200px adalah panjang kotak box. Kita dapet mengubahnya sesuka hati kita. 

Kalau kita punya label yang lebih dari satu, maka kita harus mengubah semuanya. Ah gampang tinggal copy-paste ini. hehee

Dan faktanya, diantar deretan coding diatas kita hanya perlu menyisipkan code html sederhana ini  style='overflow:auto; height:200px'>. Hahaa, tapi kayak yang ribet ya liatnya.

Gimana? Apa cukup dimengerti? Silahkan dicoba.. :)



Write By: ZahRaa @ Blog's Tutorial