CARA MEMASANG KOLOM ATAU KOTAK LABEL ( KATEGORI DLL )

Cara memasang kolom atau kotak label ( kategori dll )

Agar blog kita lebih nyaman untuk dikunjungi oleh orang banyak dan juga lebih menarik untuk dilihat,maka salah satunya adalah dengan cara membuat kolom atau kotak label ( kategori dll ) agar tidak memanjang kebawah,yaitu dengan menjadikan kolom atau kotak  label ( kategori dll )  supaya pendek .

Pertama anda buat dulu Widget label ( kategorinya dll )  dan kemudian baru anda masuk ke menu template blog anda dengan cara :

1.    Masuk ke menu settingan blog anda

2.   Klik template blog , lalu klik edit html

3.   Cari kode <div expr:class='&quot;widget-content &quot; + data:display + &quot;-label-widget-content&quot;'>

4.   Untuk memper mudah pencarian klik ctrl + f atau f3 , lalu tulis atau copy paste <div expr:class='&quot;widget-content &quot; + data:display + &quot;-label-widget-content&quot;'> kedalam kotak pencarian

5.   Jika sudah ketemu, Simpan kode di bawah ini tepat di bawah kode <div expr:class='&quot;widget-content &quot; + data:display + &quot;-label-widget-content&quot;'>

<div style='border: 1px solid rgb(204, 204, 204); padding: 5px; overflow: auto; width: 100%; height: 250px; background-color: #FF0080;'>

6.   Sehingga menjadi kode seperti di bawah ini

 <b:section-contents id='sidebar-left-1'>

  <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='border: 1px solid rgb(204, 204, 204); padding: 5px; overflow: auto; width: 100%; height: 250px; background-color: #FF0080;'>

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

Dan beri kode penutupnya yaitu kode </div> pada baris yang ke 2 , sehingga kode </div> nya menjadi 2 baris di atas kode </b:includable>

7.   Kemudian klik simpan template

Catatan yang perlu di perhatikan pada kode dibawah ini adalah :

<div style='border: 1px solid rgb(204, 204, 204); padding: 5px; overflow: auto; width: 100%; height: 250px; background-color: #FF0080;'>

1.    Kode height: 250px adalah untuk membuat tingginya kotak atau kolom label ( kategori dll )
 .

2.   Kode FF0080 adalah untuk membuat warna kotak atau kolom label ( kategori dll )
 .

3.   Silahkan anda download kode warna di link di bawah ini .

DOWNLOAD DISINI

http://ngeblog07.blogspot.com/2013/04/kumpulan-kode-warna-html-lengkap.html

HASIL SEPERTI GAMBAR INI

                                                       PENULIS ( DESAINS ) TGK. ABANG