Kali inii saya mau berbagi informasi mengenai cara mengedit top menu
pada template blog kita. seperti menu home,pages,
comment,posts,coments,,,,, sampai skarang sepertinyaa belum ada cara
supaya dapat mengedit secara mudah dan praktis, jadi harus ngoprek html
gtoo,,,tapi no problem koq,,pasti teman teman bisa deh,,,,,,
... untuk itu,tak
usah lama lama lagi, langsung kita peajari cara mengedit bagian top menu
pada blogger kita harus dan ada sedikit mengubah kode script html
template blognya... jadii ingat sugeesti saya untuk memperthatikan dengan seksama,,,,okeeee
>> 1st example,Check it Out Guys
1. Login ke Blogger > Rancangan > Edit HTML > Edit Template ( don't forget centang expand template widget )... Kemudian Copy-Paste dahulu semua kode HTML template widget blog kamu ke dalam wordpad atau notepad, lalu simpat... untuk jaga-jaga gitu...
2. Tekan Control+F lalu cari kode " <div id='menu'>
" ...kalau di kode html saya mungkin ada beberapa script html yang
berbeda dengan blog kalian, jadi kalau yang menggunakan fasilitas
template otomatis yang baru, bisa di "find" kata kunci seperti home dan
lainnya,,,lalu chek bagian tersebut
3. Nanti akan terlihat kode sesudah " <div id='menu'> " yang seperti contoh dibawah ini...
<div id='menu'>
<ul>
<li><a Title='Home' expr:href='data:blog.homepageUrl'>Home</a></li>
<li><div class='gap'/></li>
<li><a href='http://id-id.facebook.com/people/Andi-Wong/1222512287'>About</a></li>
<li><div class='gap'/></li>
<li><a expr:href='data:blog.homepageUrl + "feeds/posts/default"'>Posts RSS</a></li>
<li><div class='gap'/></li>
<li><a expr:href='data:blog.homepageUrl + "feeds/comments/default"'>Comments RSS</a></li>
<li><div class='gap'/></li>
<li><a href='http://www.blogger.com/'>Login</a></li>
</ul>
</div>
</div>
<ul>
<li><a Title='Home' expr:href='data:blog.homepageUrl'>Home</a></li>
<li><div class='gap'/></li>
<li><a href='http://id-id.facebook.com/people/Andi-Wong/1222512287'>About</a></li>
<li><div class='gap'/></li>
<li><a expr:href='data:blog.homepageUrl + "feeds/posts/default"'>Posts RSS</a></li>
<li><div class='gap'/></li>
<li><a expr:href='data:blog.homepageUrl + "feeds/comments/default"'>Comments RSS</a></li>
<li><div class='gap'/></li>
<li><a href='http://www.blogger.com/'>Login</a></li>
</ul>
</div>
</div>
Keterangan :
> Ubahlah nama menu yang saya kasih warna ungu, sesuai keinginan
> URL yang saya warnai biru juga diubah sesuai dengan nama menu yang kamu tentukan sendiri...4. Finally simpan template kamu lalu lihat blog yang sudah di update dengan refresh, atau klik ''lihat blog''
...Jika kalian mau menambah lagi menu blog,tinggal copy-paste kode html top menu-nya contoh dibawah ini :
<div id='menu'>
<ul>
<li><a Title='Home' expr:href='data:blog.homepageUrl'>Home</a></li>
<li><div class='gap'/></li>
<li><a href='http://id-id.facebook.com/people/Andi-Wong/1222512287'>About</a></li>
<li><div class='gap'/></li>
<li><a href='menambah menu di tengah'>Tambah Menu di tengah</a></li>
<li><div class='gap'/></li>
<li><a
expr:href='data:blog.homepageUrl +
"feeds/posts/default"'>Posts
RSS</a></li>
<li><div class='gap'/></li>
<li><a expr:href='data:blog.homepageUrl +
"feeds/comments/default"'>Comments
RSS</a></li>
<li><div class='gap'/></li>
<li><a href='http://www.blogger.com/'>Login</a></li>
<li><a href='menambah menu dibawah'>Tambah Menu dibawah</a></li>
</ul>
</div>
atau bisa seperti dibawah ini>>>>>>
>>2nd example
1. Jika kode html top menu di 1st example berbeda dengan kode top menu di template kamu.. coba yang ini..
2. Tekan Control+F lalu cari kode " <div class='Menu'> " ...
2. Tekan Control+F lalu cari kode " <div class='Menu'> " ...
3. Nanti akan terlihat kode sesudah " <div class='Menu'> " yang seperti contoh dibawah ini...
<div class='Menu'>
<ul>
<li><a href='/'><span>Home</span></a></li>
<li><a href='#' title='About'><span>About</span></a>
</li>
<li><a href='#' title='Contact'><span>Contact</span></a>
</li>
<li><a href='#' title='Extras'><span>Extras</span></a>
</li>
</ul>
</div>
<ul>
<li><a href='/'><span>Home</span></a></li>
<li><a href='#' title='About'><span>About</span></a>
</li>
<li><a href='#' title='Contact'><span>Contact</span></a>
</li>
<li><a href='#' title='Extras'><span>Extras</span></a>
</li>
</ul>
</div>
> Ubahlah nama menu yang saya warnai ungu seperti contoh diatas...
> URL yang saya warnai biru juga diubah sesuai dengan nama menu yang kamu tentukan...5. Jika selesai kemudian Simpan template & refresh blog kamu...
...Dan jika ingin menambah lagi menu blog tinggal copy-paste kode html top menu-nya saja seperti contoh dibawah ini :
<div class='Menu'>
<ul>
<li><a href='/'><span>Home</span></a></li>
<li><a href='#' title='About'><span>About</span></a>
</li>
<li><a href='menambah menu di tengah' title='#'><span>Tambah Menu di tengah</span></a>
<li><a href='#' title='Contact'><span>Contact</span></a>
</li>
<li><a href='#' title='Extras'><span>Extras</span></a>
</li>
<li><a href='menambah menu dibawah' title='Extras'><span>Tambah Menu dibawah</span></a>
</ul>
</div>
<ul>
<li><a href='/'><span>Home</span></a></li>
<li><a href='#' title='About'><span>About</span></a>
</li>
<li><a href='menambah menu di tengah' title='#'><span>Tambah Menu di tengah</span></a>
</li>
<li><a href='#' title='Contact'><span>Contact</span></a>
</li>
<li><a href='#' title='Extras'><span>Extras</span></a>
</li>
<li><a href='menambah menu dibawah' title='Extras'><span>Tambah Menu dibawah</span></a>
</li>
</ul>
</div>
Semoga berhasil kawan,,,,jngan lupa tinggalkan komentar yaaa,,,,, Merci Beaucoup
sumber : http://tipstrik-tutorial.blogspot.com/p/cara-mengedit-bagian-top-menu-pada.html
0 komentar:
Posting Komentar