Selamat Datang Di Blog Bisnis Online Terpercaya www.maslukis.com


Jumat, 04 November 2016

Cara Membuat Scroll pada Widget Arsip Blog


Setelah kita menambahkan widget arsip blog, maka secara default ketika kita mengkliknya kan membuat tampilan arsip memanjang ke bawah. Apabila anda memiliki jumlah postingan yang banyak atau sudah bertahun-tahun blogging maka akan membuat tampilan widget arsip blog menjadi sangat panjang ke bawah. Hal tersebut sering sekali membuat tampilan blog anda menjadi tidak rapi dan berubah-ubah panjangnya. Terlebih apabila sidebar ataupun footer tempat dimana anda meletakkan widget arsip blog tersebut berisi banyak widget lainnya maka akan memakan banyak tempat di blog bahkan melebihi tampilan artikel blog itu sendiri.

Ada cara untuk mengatasi permasalahan tersebut, dengan membuat widget menjadi lebih ringkas dengan menambahkan scroll pada widget tersebut. Penggunaan scroll tersebut akan membuat widget menampilkan scroll ketika panjang widget melebihi batas yang ditentukan. Adanya widget dengan scroll tersebut tidak akan menambah panjang tampilan blog karena secara otomotis menampilkan scroll tersendiri bagi widget tersebut. Hal ini akan membuat tampilan blog menjadi lebih rapi, menarik dan ringkas sehingga akan lebih memudahkan pengguna atau pengunjung blog anda. Terkait tips ini, saya akan membagikan cara tentang membuat scroll pada widget arsip blog. Tetapi sebelumnya silahkan lihat penampilan widget arsip blog yang telah ditambahkan scroll berikut ini:

Widget arsip blog dengan scroll - ardhinw

Anda juga bisa melihatnya secara langsung pada widget arsip blog di blog ini.

Selanjutnya setelah sedikit penjelasan saya akan memberitahukan caranya. Cara membuat scroll pada arsip blog adalah sebagai berikut:

1. Masuk terlebih dahulu ke akun bloggermu.
2. Dari halaman dasbor pilih Template.
3. Kemudian klik Edit HTML.
4. Kemudian cari kode " <div id='ArchiveList'> " (tanpa tanda petik). Gunakan CTRL+F untuk memudahkan pencarianmu.
5. Kemudian terapkan seperti ini dengan menambahkan kode berwarna biru di bawah ini:

<div style='overflow:auto; width:ancho; height:400px;'>
<div id='ArchiveList'>
<div expr:id='data:widget.instanceId + &quot;_ArchiveList&quot;'>
<b:if cond='data:style == &quot;HIERARCHY&quot;'>
<b:include data='data' name='interval'/>
</b:if>
<b:if cond='data:style == &quot;FLAT&quot;'>
<b:include data='data' name='flat'/>
</b:if>
<b:if cond='data:style == &quot;MENU&quot;'>
<b:include data='data' name='menu'/>
</b:if>
</div>
</div>
<b:include name='quickedit'/>
</div>
</div>
</b:includable>


Letakkan <div style='overflow:auto; width:ancho; height:400px;'> tepat di atas <div id='ArchiveList'>Untuk mengatur tinggi widget dapat mengubah height:400px sesuai dengan keinginan anda, usahakan jangan terlalu pendek saran saya yaitu 300 px - 400px. Kemudian jangan lupa juga menambahkan </div> sesudah <b:include name='quickedit'/>.

6. Selanjutnya sebelum disimpan anda tinjau dahulu untuk melihat perubahan yang terjadi, jika sudah yakin, simpan template anda.
7. Selesai dan lihat tampilan widget barumu.

Tambahan Tips:
Cara membuat scroll di atas sebenarnya dapat juga diterapkan pada widget lain seperti widget populer pos, komentar, pos terbaru dan sebagainya. Caranya pun sama dengan menambahkan kode berwarna biru di atas pada posisi yang ditentukan, yaitu di atas widget id atau widget class. Pada widget pos populer contohnya yaitu:

<div style='overflow:auto; width:ancho; height:400px;'>
<div class='widget-content popular-posts'>
.................................................................................................
.................................................................................................
<b:include name='quickedit'/>
</div>
</div>
</b:includable>

Untuk lebih detailnya akan dibahas pada pos artikel selanjutnya. Jadi bersabar ya!
Mungkin cukup sekian dulu penjelasan membuat scroll pada widget arsip blog, semoga berhasil.


Baca Juga:

Comments
0 Comments

0 komentar:

Posting Komentar

 
Copyright © 2018. Info Hari Ini . All Rights Reserved
Jl. Delta Raya Utara Kav. 49 - 51 Deltasari Baru, Sidoarjo, Jawa Timur, Indonesia 61256
PT. Bimasakti Multi Sinergi