Friday, May 17, 2013

Cara Membuat Scroll Pada Arcive Blog

Rate this posting:
{[['']]}



Cara Membuat Scroll Pada Arcive Blog
ini tergolong cara untuk mempercantik blog, pada umumnya arsip blog itu puanjang buanget. hehehe namun bisa dipendekkan tanpa merubah subtansinya. Cara Membuat Scroll Pada Arcive Blog sobat akan lihat hasilnya betapa menarik dan ringkas menggunakan efek scroll.

Berikut caranya....
Cara Ke-1
1. Login ke Blogger.
2. Di halaman Dasbor, kita pilih Rancangan Blogger.
3. Kemudian pilih Edit HTML
4. Beri tanda centang pada Expand Template Widget
5. Kemudian sobat Cari kode berikut <div id='ArchiveList'> atau ArchiveList agar lebih mudah gunakan ctrl+F. 
6. Jika sudah ketemu Selanjutnya tambahkan kode yang berwarna merah seperti di bawah ini:

<div class='widget-content'>

<div style="border: 1px solid rgb(204, 204, 204); padding: 5px; overflow: auto; width: 100%; height: 200px; background-color: #FFFFFF;">
<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>
am scroll ....

Keterangan
:
  • Untuk menemukan kode <div id='ArchiveList'> atau ArchiveList maka teman-teman harus memasang Blog Archive nya terlebih dahulu dengan cara : klik Design/Rancangan >> Page Element >> Add a Gadget >> Blog Archive >> Save. Jika teman-teman sudah memasang Blog Archive nya maka langsung saja mencari kodenya tadi.
  • Harap disesuaikan saja kodenya, karena tidak semua templates sama,
  • 200px : Adalah Untuk merubah tinggi kolom scrollnya, silahkan ganti pada kode height:
  • Jika sudah klik Save templates dan lihat hasilnya. 

Cara Ke-2

1. Login ke akun blogspot,
2. Klik Design/Rancangan >> Edit HTML >> Centang Expand Widget Templates,
3. Cari kode berikut :


    <b:widget id='BlogArchive2' locked='false' title='Arsip Blog' type='BlogArchive'>

4. Lalu Terapkan Seperti di bawah 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:ancho; height:200px;'>
    <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>


5. Kode warna Biru dan Merah adalah kode yang ditambahkan kedalam script tersebut.
 200px adalah tingginya, dan kalian  bisa ubah seseuai ke inginann kalian..

sekian semoga bermanfaat :)

Description: Cara Membuat Scroll Pada Arcive Blog Rating: 5 Reviewer: Ega Bagus Permadi ItemReviewed: Cara Membuat Scroll Pada Arcive Blog
Kamu sedang membaca artikel tentang Cara Membuat Scroll Pada Arcive Blog Silahkan baca artikel Eghooy Main Blog Tentang Yang lainnya. Kamu boleh menyebar Luaskan atau MengCopy-Paste Artikel ini, Tapi jangan lupa untuk meletakkan Link Cara Membuat Scroll Pada Arcive Blog Sebagai sumbernya


Artikel Terkait:

Reactions:

0 comments:

Post a Comment

Berkomentarlah Yang Bijak salam Eghooy Main Blog