Cara membuat Fungsi Scroll pada menu/arsip blog
nahh,, sekarang saya akan sharing tentang Cara membuat Fungsi Scroll pada menu/arsip blog, hasil dari Cara membuat Fungsi Scroll pada menu/arsip blog hasilnya seperti yang ada di bagian samping atas blog saya,, begitu simpel kan,, daripada membuat arsip yang PANJAAAAANG banget apalagi yang arsipblog'y sudah banyak sampai menjulang kebawah,, (hehe,, lebay yah),, risih juga dilihat'y oleh pengunjung,, daripada kita panjang2 membuatnya lebih baik y simpel-simpel aja,, hehe...
untuk membuatnya silahkan ikuti langkah-langkah berikut :
untuk membuatnya silahkan ikuti langkah-langkah berikut :
Pertama Kita harus membuat dulu Arsip Blog
• Masuk ke blogger
• Klik Tata Letak
• Klik Elemen Halaman
• Tambahkan sebuah elemen halaman => Tambah elemen Arsip Blog
• Tapi Anda harus pilih gaya Hierarki
Pada Menu Diatas Itu belum terdapat fungsi scroll, untuk
membuatnya memiliki fungsi scroll ikuti langkah-langkahnya lagi !
• Setelah itu, klik Edit Html
• Beri tanda centang pada tulisan Expand Widget Template
• Lalu Anda cari kode seperti ini
<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 + "_ArchiveList"'>
<b:if
cond='data:style == "HIERARCHY"'>
<b:include
data='data' name='interval'/>
</b:if>
<b:if
cond='data:style == "FLAT"'>
<b:include
data='data' name='flat'/>
</b:if>
<b:if
cond='data:style == "MENU"'>
<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 + "_ArchiveMenu"'>
<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='"archivedate " + 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 == "expanded"'>
<a class='toggle'
expr:href='data:widget.actionUrl + "&action=toggle" +
"&dir=close&toggle=" + data:interval.toggleId
+ "&toggleopen=" + data:toggleopen'>
<span class='zippy
toggle-open'>▼ </span>
</a>
<b:else/>
<a class='toggle'
expr:href='data:widget.actionUrl + "&action=toggle" +
"&dir=open&toggle=" + data:interval.toggleId
+ "&toggleopen=" + data:toggleopen'>
<span
class='zippy'>
<b:if
cond='data:blog.languageDirection == "rtl"'>
◄
<b:else/>
►
</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 warna merah dan hijau adalah kode yang ditambahkan kedalam
script tersebut
Kode warna hijau yang dicetak tebal adalah tinggi dari elemen tadi,
silahkan kawan ganti agar sesuai dengan blog kawan
Lalu jangan lupa untuk menyimpannya => Klik Simpan
=========================================
=========================================
SELESAI,, mudah kan,, semoga artikel ini bermanfaat bagi agan2 semuanya.......
Langganan:
Posting Komentar (Atom)
Share your views...
0 Respones to "Cara membuat Fungsi Scroll pada menu/arsip blog"
Posting Komentar