Cara Memasang Kode Scroll Kolom Widget Blogspot

Cara Memasang Kode Scroll Kolom Widget Blogspot ini juga merupakan artikel request dari mas Krisnanda Pria L yang telah berkomentar Disini ini yg sy cri terìmakasih.. inf0nya sangat bermanfaat.. request : cara membuat scr0ll pada widget.. sehingga saya membuat artikel ini, Cara Memasang Kode Scroll Kolom Widget Blogspot

Berikut gambar hasil dari saya menerapkan cara memasang kode scroll kolom widget blogspot yang saya terapkan di blog saya yang lain

Berikut Cara Memasang Kode Scroll Kolom Widget Blogspot

1. Masuk ke akun blogger sobat
2. Klik menu Template >> Edit Html >> tekan Ctrl+F pada keyboard sobat
3. Cari kode widget yang ingin sobat pasang scroll, misalnya widget atau kolom arsip blog berikut ini
   <b:includable id='main'>
   <b:if cond='data:title'>
   <h2><data:title/></h2>
   </b:if>
   <div class='widget-content'>
   <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:includable>
   </b:widget>
   </b:section>
   </div>
4. Tambahkan kode berikut diantara <div class='widget-content'> dan </b:includable> pada kode arsip diatas.
   <div style="overflow:auto; width:auto; height:250px; padding:2px;border:1px ridge #DCDCDC;">
   </div>
   
   Sehingga hasilnya seperti berikut ini
   <b:includable id='main'>
   <b:if cond='data:title'>
   <h2><data:title/></h2>
   </b:if>
   <div class='widget-content'>
   <div style="overflow:auto; width:auto; height:250px; padding:2px;border:1px ridge #DCDCDC;">
   <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>
   </div>
   </b:includable>
   </b:widget>
   </b:section>
   </div>
5. Silahkan preview terlebih dahulu untuk melihat hasilnya. Jika tidak error, simpan template

Atau Cara Memasang Kode Scroll Kolom Widget Blogspot secara keseluruhan adalah sebagai berikut

Jika sobat memasang artikel atau link secara manual ke dalam kolom widget maka cari kode yang mirip dengan kode berikut ini
<b:widget id='HTML1' locked='false' title='' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h3 class='title'><data:title/></h3>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
</b:includable>
</b:widget>

Dan pasang kode berikut diantara <data:content/>
<div style="overflow:auto; width:auto; height:250px; padding:2px;border:1px ridge #DCDCDC;">
</div>

Sehingga hasilnya seperti berikut
<b:widget id='HTML1' locked='false' title='' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h3 class='title'><data:title/></h3>
</b:if>
<div class='widget-content'>
<div style="overflow:auto; width:auto; height:250px; padding:2px;border:1px ridge #DCDCDC;">
<data:content/>
</div>
</div>
</b:includable>
</b:widget>

Jadi kunci cara memasang kode scroll kolom widget blogspot ini adalah terletak pada <div class='widget-content'> dan hampir semua template blog memiliki kode <div class='widget-content'> ini

Silahkan sobat gunakan cara memasang kode scroll kolom widget blogspot diatas untuk menambahkan scrolling pada kolom widget blog sobat. Jika ada kesalahan dalam memasang kode diatas, mari kita diskusikan bersama dengan meninggalkan komentar di artikel ini, cara memasang kode scroll kolom widget blogspot