Cara Memasang Scroll Otomatis Pada Widget Arsip Blog

Cara Memasang Scroll Otomatis Pada Widget Arsip Blog | Setelah tadi Revans posting tentang komik Kungfu Boy, sekarang Revans akan mencoba untuk share tutorial blog yang kali ini yaitu Cara Memasang Scroll Otomatis Pada Widget Arsip Blog. Mungkin bagi sebagian Sobat Revans memasang scroll otomatis pada widget yang ada pada blog bukan sesuatu hal yang asing lagi.

Dengan menambahkan fitur scroll ini kita dapat menghemat penggunaan ruang/halaman yang ada pada sebuah blog. Scroll tersebut tidak hanya dapat digunakan pada widget arsip blog saja, tapi bisa juga digunakan untuk widget lainnya seperti label, recent koment, recent post berdasarkan label, bahkan sampai pada desain blockquote yang ada pada halaman posting.

Oke Sobat, kita mulai saja ke tutorial Cara Memasang Scroll Otomatis Pada Widget Arsip Blognya.

Pertama yang harus Sobat lakukan adalah mengaktifkan widget Arsip Blog dan kemudian silahkan sobat buka "Edit HTML" dan cari kata "BlogArchive" pada template Sobat tersebut (gunakan CTRL + F).

Setelah ketemu, sisipkan kode yang saya tulis dengan huruf kapital semua di bawah ini pada rangkaian kode widget arsip blog pada template Sobat tersebut seperti yang terlihat di bawah ini. Ganti huruf kapital tersebut dengan huruf kecil semua.

<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:200PX;'>

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

<b:include name='quickedit'/>

</div>

</b:includable>

<b:includable id='flat' var='data'>

<ul>

<b:loop values='data:data' var='i'>

<li class='archivedate'>

<a expr:href='data:i.url'><data:i.name/></a> (<data:i.post-count/>)

</li>

</b:loop>

</ul>

</b:includable>

<b:includable id='menu' var='data'>

<select expr:id='data:widget.instanceId + &quot;_ArchiveMenu&quot;'>

<option value=''><data:title/></option>

<b:loop values='data:data' var='i'>

<option expr:value='data:i.url'><data:i.name/> (<data:i.post-count/>)</option>

</b:loop>

</select>

</b:includable>

<b:includable id='interval' var='intervalData'>

<b:loop values='data:intervalData' var='i'>

<ul>

<li expr:class='&quot;archivedate &quot; + data:i.expclass'>

<b:include data='i' name='toggle'/>

<a class='post-count-link' expr:href='data:i.url'><data:i.name/></a>

<span class='post-count' dir='ltr'>(<data:i.post-count/>)</span>

<b:if cond='data:i.data'>

<b:include data='i.data' name='interval'/>

</b:if>

<b:if cond='data:i.posts'>

<b:include data='i.posts' name='posts'/>

</b:if>

</li>

</ul>

</b:loop>

</b:includable>

<b:includable id='toggle' var='interval'>

<b:if cond='data:interval.toggleId'>

<b:if cond='data:interval.expclass == &quot;expanded&quot;'>

<a class='toggle' expr:href='data:widget.actionUrl + &quot;&amp;action=toggle&quot; + &quot;&amp;dir=close&amp;toggle=&quot; + data:interval.toggleId + &quot;&amp;toggleopen=&quot; + data:toggleopen'>

<span class='zippy toggle-open'>&#9660; </span>

</a>

<b:else/>

<a class='toggle' expr:href='data:widget.actionUrl + &quot;&amp;action=toggle&quot; + &quot;&amp;dir=open&amp;toggle=&quot; + data:interval.toggleId + &quot;&amp;toggleopen=&quot; + data:toggleopen'>

<span class='zippy'>

<b:if cond='data:blog.languageDirection == &quot;rtl&quot;'>

&#9668;

<b:else/>

&#9658;

</b:if>

</span>

</a>

</b:if>

</b:if>

</b:includable>

<b:includable id='posts' var='posts'>

<ul class='posts'>

<b:loop values='data:posts' var='i'>

<li><a expr:href='data:i.url'><data:i.title/></a></li>

</b:loop>

</ul>

</b:includable>

</b:widget&gt

Untuk mengatur tinggi scroll silahkan Sobat sesuaikan dengan mengatur angka 200px di atas. Setelah dirasa pas, silahkan Sobat simpan hasil editan tadi dan silahkan di lihat hasilnya.

Bagaimana Sobat, cukup mudahkan cara memasang scroll otomatis pada widget arsip blog tersebut.

Selamat mencoba Sobat.. :D