Ada sebagian teman-teman yang mengeluh saat menambah postingan di blog karena pada arsip blog-nya jadi panjang turun kebawah. Namun sebenarnya bisa aja tampilan tersebut diganti dengan melalui pengaturan blog itu sendiri seperti membuat tampilan menu dengan bentuk dropdown ataupun dengan tampilan flat.
Namun bagaimana kalau kita tetap menggunakan pilihan menu Hierarchy namun tidak kepanjangan? Salah satu caranya yaitu dengan membuat widget arsip blog tersebut dengan fungsi scrol. Langsung aja ddeh ke TKP :
• Log In ke blogger
• Klik Tata Letak
• Klik Elemen Halaman
• Tambahkan sebuah elemen halaman=> Tambah elemen Arsip Blog
• Tapi Anda harus pilih gaya Hierarki
• Setelah itu, klik Edit Html
• Beri tanda centang pada tulisan Expand Widget Template
• Lalu Anda cari kode seperti ini
Kemudian tambahkan code ini <div style='overflow:auto; width:ancho; height:100px;'> persis dibawah code <div class='widget-content'> jadi hasilnya akan berbentuk seperti ini
Setelah itu cari code ini tidak jauh kog dari code diatas
Dan terakhir tinggal menutup code tersebut dengan perintah </div> jadi hasilnya akan seperti ini
Dan bentuk script keseluruhan akan seperti ini
<div style='overflow:auto; width:ancho; height:100px;'>
100 px adalah tinggi dari bidang tersebut jadi tinggal rubah nilainya sampai anda sudah merasa cocok dengan template anda.
Terakhir simpan template anda dan selamat sekarang anda sudah mempunyai widget arsib blog yang mempunyai fungsi scrol .
Namun bagaimana kalau kita tetap menggunakan pilihan menu Hierarchy namun tidak kepanjangan? Salah satu caranya yaitu dengan membuat widget arsip blog tersebut dengan fungsi scrol. Langsung aja ddeh ke TKP :
• Klik Tata Letak
• Klik Elemen Halaman
• Tambahkan sebuah elemen halaman=> Tambah elemen Arsip Blog
• Tapi Anda harus pilih gaya Hierarki
• Setelah itu, klik Edit Html
• Beri tanda centang pada tulisan Expand Widget Template
• Lalu Anda cari kode seperti ini
<b:widget id='BlogArchive2' locked='false' title='Arsip Blog' type='BlogArchive'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
Kemudian tambahkan code ini <div style='overflow:auto; width:ancho; height:100px;'> persis dibawah code <div class='widget-content'> jadi hasilnya akan berbentuk seperti ini
<b:widget id='BlogArchive2' locked='false' title='Arsip Blog' type='BlogArchive'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<div style='overflow:auto; width:ancho; height:100px;'> <b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
Setelah itu cari code ini tidak jauh kog dari code diatas
<b:if cond='data:style == "MENU"'>
<b:include data='data' name='menu'/>
</b:if>
</div>
</div>
<b:include data='data' name='menu'/>
</b:if>
</div>
</div>
Dan terakhir tinggal menutup code tersebut dengan perintah </div> jadi hasilnya akan seperti ini
<b:if cond='data:style == "MENU"'>
<b:include data='data' name='menu'/>
</b:if>
</div>
</div></div>
<b:include data='data' name='menu'/>
</b:if>
</div>
</div></div>
Dan bentuk script keseluruhan akan seperti ini
<b:widget id='BlogArchive2' locked='false' title='Arsip Blog' type='BlogArchive'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<div style='overflow:auto; width:ancho; height:100px;'>
<div id='ArchiveList'>
<div expr:id='data:widget.instanceId + "_ArchiveList"'>
<b:if cond='data:style == "HIERARCHY"'>
<b:include data='data' name='interval'/>
</b:if>
<b:if cond='data:style == "FLAT"'>
<b:include data='data' name='flat'/>
</b:if>
<b:if cond='data:style == "MENU"'>
<b:include data='data' name='menu'/>
</b:if>
</div>
</div></div>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<div style='overflow:auto; width:ancho; height:100px;'>
<div id='ArchiveList'>
<div expr:id='data:widget.instanceId + "_ArchiveList"'>
<b:if cond='data:style == "HIERARCHY"'>
<b:include data='data' name='interval'/>
</b:if>
<b:if cond='data:style == "FLAT"'>
<b:include data='data' name='flat'/>
</b:if>
<b:if cond='data:style == "MENU"'>
<b:include data='data' name='menu'/>
</b:if>
</div>
</div></div>
<div style='overflow:auto; width:ancho; height:100px;'>
100 px adalah tinggi dari bidang tersebut jadi tinggal rubah nilainya sampai anda sudah merasa cocok dengan template anda.
Terakhir simpan template anda dan selamat sekarang anda sudah mempunyai widget arsib blog yang mempunyai fungsi scrol .
Sumber Inspirasi : IAB
Tidak ada komentar:
Posting Komentar