With Dropdown Menu, we can save space in our blog because of its small size could save the link and text a lot. Can be filled with the archive, blogroll, etc..
For the first time, I will explain you to make the basic dropdown menu. Here are the steps:
1. Login to your Blogger account.
2. Select Layout > Page Elements > Add Page Elements > HTML / JavaScript
3. Enter the following script into the content box:
<select onChange="document.location.href=this.options[this.selectedIndex].value;">
<option value="0" selected>Arsip Blog</option>
<option value="Links 1">Text 1</option>
<option value="Links 2">Text 2</option>
</select>
Red text is a link, replace it with your link.
Blue text is the text that is displayed. You must also change.
Example:
<select onChange="document.location.href=this.options[this.selectedIndex].value;">
<option value="0" selected>Arsip Blog</option>
<option value="http://tips-blogger-zacky.blogspot.com/2009/11/tentang-blogger.html">Tentang Blogger</option>
<option value="http://tips-blogger-zacky.blogspot.com/2009/11/cara-memback-up-template-blogger.html">Cara Memback-up Template Blogger</option>
<option value="http://tips-blogger-zacky.blogspot.com/2009/11/cara-melindungi-blog-dari-penjiplakan.html">Cara Melindungi Blog Dari Penjiplakan</option>
</select>
Result:
To add more menus, add <option value="Links 2">Text 2</option> code before the </select> code.
The links in the dropdown menu above, if the click will open a link on the same page. This is suitable for Archives and links related to the blog.
There is one more type of link that if clicked it will open a new window without closing your blog. Which is suitable untu Friend Blogroll or links. There is code that must be replaced:
<select onChange="document.location.href=this.options[this.selectedIndex].value;">
with this one:
<select onchange="javascript:window.open(this.options[this.selectedIndex].value);">
How? Easy? Good luck ...
Don't forget to leave a comment ...
Comments :
Post a Comment