Cara Membuat Arsip dengan Fungsi Scroll di Blog

Alhamdulilah masih sehat dan diberi kekuatan untuk menjalankan puasa di hari ke 17 ini. tutorial blog kali ini adalah membuat arsip dengan fungsi scroll. seperti pada blog saya. lihat dibagian kanan blog pada kolom arsip. dengan memasang fungsi scrooll pada arsip blog menjadikan pengunjung dengan mudah dan selain itu tampilan blog kita menjadi goodlooking, juga tidak makan banyak tempat di blog kita. langkah - langkah pemasangannya sangat mudah.

Berikut Langkah - Langkahnya :

Jika anda belum memasang arsip di blognya, silahkan pasang dulu arsipnya caranya sebagai berikut 

• log in ke akun blogger
• klik tata letak ➨ elemen laman ➨ tambahkan arsip blog
• klik simpan

Arsip tersebut belum fungsi scroll, jika ingin membuatnya menjadi fungsi scroll berikut tricknya

• Log in ke akun blogger sobat
• Selanjutnya Klik Rancangan ➨ Edit HTML. Jangan lupa untuk selalu memback up template anda takut   terjadi kesalahan CentangExpand Template Widget ➨ Download Template. 
• Selanjutnya cari kode
  
  
  <b:widget id='BlogArchive2' locked='false' title='Arsip Blog' type='BlogArchive'>
  
  Anda akan menemukan kode lengkapnya 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 + &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>
• Kode hijau dan merah adalah kode yang harus anda tambahkan pada script tadi. kode warna hijau merupakan tinggi silahkan anda sesuaikan.
• Simpan template

..: Semoga Bermanfaat :..