Membuat Scroll Pada Archive Blog | Dhita Prianthara Blog Membuat Scroll Pada Archive Blog | Dhita Prianthara Blog| software | games | download | PS1 | Free

23 March 2011

Membuat Scroll Pada Archive Blog

Kali ini saya akan berbagi tips dan trick kepada sobat blogger semua tentang bagaimana cara membuat scroll pada archive blog kita. Hal tersebut dapat kita gunakan untuk mengatasi terlalu banyaknya posting yang kita buat sehingga blog kita menjadi bertambah panjang ke bawah. Kita dapat mengatasi hal tersebut dengan membuat scroll pada archive blog kita. Gak usah panjang lebar lagi yach penjelasannya,,langsung ajja ke tutorialnya,,,,!!!

  1. Masuk dulu ke Acount Blogger atau Dashboard
  2. Pilih Layout , lalu klik Edit HTML
  3. Centang dulu  Expand Widget Templates
  4. Cari kode yang seperti ini : <div id='ArchiveList'>  atau kata Archive.
  5. Untuk memudahkan mencarinya , pakai saja Ctrl +F , terus ketik kata yang dicari dikotak yang disediakan, lalu klik next. 
  6. Kalau sudah,  tambahkan kode warna merah itu sebagai scollnya
  7. Lengkapnya kode tersebut seperti dibawah ini :

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


  8. Angka 200px adalah tinggi kotak scroll itu, silahkan disesuaikan.
  9. Mungkin saja diblog sobat kodenya beda,,  Oleh karena itu carilah yang mirip dan perlu dicoba, terus jangan lupa templatenya dibackup dulu.
  10. Kalau sudah jangan lupa save template .
  11. Selesai. 

Hasil akhirnya adalah seperti ini :


clip_image002




Artikel Terkait:

0 comments:

Post a Comment

Silahkan beri komentar sobat di bawah ini!
Komentar sobat akan sangat bermanfaat bagi kemajuan blog ini! :D Jangan lupa follow blog ini juga ;)
Mohon untuk tidak menggunakan nama ANONIM!
No SPAM !!!

Template by : dhitaprianthara Copyright@2012