Postingan kali ini, saya akan membahas tentang cara membuat arsip dan label blog yang model scroll, seperti yang sedang saya gunakan diblog . Btw, tau scroll kan? Coba tarik halaman blog ini keatas dan
kebawah, nah naek turun kan? Itulah yang dinamakan model scroll. Fungsi Arsip dan Label dibuat scroll tentu adalah menghemat tempat Blog Anda seperti blog ini. Jika tidak diakali dengan menggunakan scroll tentu akan membuat label atau arsip akan memanjang terus menerus sehingga membuat halaman blog menjadi tidak karuan. Contoh model archive dan label yang memakai scroll adalah blog ini
Untuk membuatnya kita hanya menambahkan script berikut : kebawah, nah naek turun kan? Itulah yang dinamakan model scroll. Fungsi Arsip dan Label dibuat scroll tentu adalah menghemat tempat Blog Anda seperti blog ini. Jika tidak diakali dengan menggunakan scroll tentu akan membuat label atau arsip akan memanjang terus menerus sehingga membuat halaman blog menjadi tidak karuan. Contoh model archive dan label yang memakai scroll adalah blog ini
Dan, untuk letaknya akan saya beberkan satu persatu :
Arsip Model Scroll :
1. Login > Layout > Elemen Halaman
2. Buat widget Arsip dengan nama Arsip Blog
3. Pilih model yang Hirearchy
4. Masuk ke Edit HTML > centang kotak Expand Template Widget
5. Carilah 'Arsip Blog'. Selengkapnya begini:
<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 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:include name='quickedit'/>
5. Dan untuk warna biru, itu adalah tinggi label scrollnya. Jika kurang pas dengan templatenya, gantilah sesuai selera Anda.
<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:include name='quickedit'/>
6. Sebelumnya tidak ada kode biru di template Anda. Tambahkan kode itu untuk mengaktifkan scrolling-nya
7. Dan untuk warna hijau, itu adalah tinggi arsip scrollnya. Jika kurang pas dengan templatenya, gantilah sesuai selera Anda.
8. Langkah terakhir, tentu adalah Simpan Template
Label Model Scroll :
1. Saya anggap anda telah memakai widget ini, dan langsung aja menuju Edit HTML
2. Klik Expand Widget Template
3. Carilah dengan kata kunci Label. Selengkapnya begini :
<b:widget id='Label1' locked='false' title='Label' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<b:loop values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url == data:label.url'>
<data:label.name/>
<b:else/>
<a expr:href='data:label.url'><data:label.name/></a>
</b:if>
(<data:label.count/>)
</li>
</b:loop>
</ul>
</div>
</b:includable>
</b:widget>
<b:widget id='Label1' locked='false' title='Label' type='Label'>
<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;'>
<ul><b:loop values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url == data:label.url'>
<data:label.name/>
<b:else/>
<a expr:href='data:label.url'><data:label.name/></a>
</b:if>
(<data:label.count/>)
</li>
</b:loop>
</ul>
</div>
<b:include name='quickedit'/></div>
</b:includable>
</b:widget>
6. Simpan Template.
Oke selesai, moga bermanfaat buat sobat-sobat semua...
Komentar
Posting Komentar