<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Free Blog Themes, Blog Tutorials, Blog Templates, Blogger Tips, Blog Resources &#187; drop down Menu</title>
	<atom:link href="http://www.blogbunker.com/tag/drop-down-menu/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.blogbunker.com</link>
	<description>Free blogger templates, blogger tutorials, blogger tips, blogger guildes, blogger widgets, free wordpress plugins, free wordpress theme, blogger resources</description>
	<lastBuildDate>Sun, 22 Jan 2012 06:20:08 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
		<item>
		<title>How To Make a drop down Menu</title>
		<link>http://www.blogbunker.com/blogger-tutorials/how-to-make-a-drop-down-menu/</link>
		<comments>http://www.blogbunker.com/blogger-tutorials/how-to-make-a-drop-down-menu/#comments</comments>
		<pubDate>Mon, 22 Feb 2010 14:56:23 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Blogger Tutorials]]></category>
		<category><![CDATA[drop down Menu]]></category>

		<guid isPermaLink="false">http://www.blogbunker.com/?p=238</guid>
		<description><![CDATA[<a href="http://www.blogbunker.com/blogger-tutorials/how-to-make-a-drop-down-menu/"><img align="left" hspace="5" width="100" src="http://bp2.blogger.com/_c-XFk4OciTE/R0kwHJY7TwI/AAAAAAAAAQM/qIdxn7IGrbw/s400/front-panel.jpg" class="alignleft wp-post-image tfe" alt="layout" title="" /></a>Do you ever seen the menu such as below? please click at the menu to see the effect of this menu : - Blog Tutorial - Start to blogging Blog setting Backup template backup widget The name of this menu is drop down menu. To make the dropdown menu, you only make the code be [...]]]></description>
			<content:encoded><![CDATA[<p>Do you ever seen the menu such as below? please click at the menu to see the effect of this menu :</p>
<form>
<select name="menu" size="1">
<option>- Blog Tutorial -</option>
<p> <!-- change the links with your own --><br />
<option value="http://rohman-freeblogtemplate.blogspot.com/2007/11/strart-to-blogging.html">Start to blogging</option>
<option value="http://rohman-freeblogtemplate.blogspot.com/2007/11/how-to-settings-your-blog.html">Blog setting</option>
<option value="http://rohman-freeblogtemplate.blogspot.com/2007/11/how-to-backup-template.html">Backup template</option>
<option value="http://rohman-freeblogtemplate.blogspot.com/2007/12/how-to-backup-your-widgets_19.html">backup widget</option>
</select>
</form>
<p>The name of this menu is <strong>drop down menu</strong>.</p>
<div>To make the dropdown menu, you only make the code be like this :</p>
<div><code> &lt;form&gt;&lt;select name="menu" onchange="window.open(this.options[this.selectedIndex].value,'_blank')"size=1 name=menu&gt;&lt;option value=0 selected&gt; Your text  title here! &lt;/option&gt;</p>
<p>&lt;option value=" your address link here "&gt; the text here will be display &lt;/option&gt; &lt;/select&gt;&lt;/form&gt; </code></div>
<p>For example, the code such as the following :</p>
<div><code> </code>&lt;form&gt;&lt;select name=&#8221;menu&#8221; onchange=&#8221;window.open(this.options[this.selectedIndex].value,&#8217;_blank&#8217;)&#8221;size=1 name=menu&gt;</p>
<p>&lt;option&gt;- Blog Tutorial &#8211; &lt;/option&gt;</p>
<p>&lt;!&#8211; change the links with your own &#8211;&gt;</p>
<p>&lt;option value=&#8221;http://rohman-freeblogtemplate.blogspot.com/2007/11/strart-to-blogging.html&#8221;&gt;Start to blogging&lt;/option&gt;</p>
<p>&lt;option value=&#8221;http://rohman-freeblogtemplate.blogspot.com/2007/11/how-to-settings-your-blog.html&#8221;&gt;Blog setting&lt;/option&gt;</p>
<p>&lt;option value=&#8221;http://rohman-freeblogtemplate.blogspot.com/2007/11/how-to-backup-template.html&#8221;&gt;Backup template&lt;/option&gt;</p>
<p>&lt;option value=&#8221;http://rohman-freeblogtemplate.blogspot.com/2007/12/how-to-backup-your-widgets_19.html&#8221;&gt;backup widget&lt;/option&gt;</p>
<p>&lt;/select&gt;&lt;/form&gt;</p>
</div>
<p>This is the result :<br />
<form>
<select name="menu" size="1">
<option>- Blog Tutorial &#8211; </option>
<p> <!-- change the links with your own --><br />
<option value="http://rohman-freeblogtemplate.blogspot.com/2007/11/strart-to-blogging.html">Start to blogging</option>
<option value="http://rohman-freeblogtemplate.blogspot.com/2007/11/how-to-settings-your-blog.html">Blog setting</option>
<option value="http://rohman-freeblogtemplate.blogspot.com/2007/11/how-to-backup-template.html">Backup template</option>
<option value="http://rohman-freeblogtemplate.blogspot.com/2007/12/how-to-backup-your-widgets_19.html">backup widget</option>
</select>
</form>
<p> You can make the drop down menu more than one, just make the code more than one, so very simple.</p>
<p>Now, how to add this code to your blog. This is the step :</p>
<ol>
<li>Login to <strong>blogger</strong> with your ID</li>
<li>After entering the dasboard page , click <strong>Layout</strong>. Please saw the picture :</li>
<p><img id="BLOGGER_PHOTO_ID_5136689749330448130" src="http://bp2.blogger.com/_c-XFk4OciTE/R0kwHJY7TwI/AAAAAAAAAQM/qIdxn7IGrbw/s400/front-panel.jpg" border="0" alt="layout" /></p>
<li>Click at <strong>Page Elements</strong> tab. See the picture below :</li>
<p><img id="BLOGGER_PHOTO_ID_5137573441433192530" src="http://bp0.blogger.com/_uJHKCfdb2J0/R0xT0zAbSFI/AAAAAAAAABY/by3674mO23Y/s400/Page-elements.jpg" border="0" alt="page element" /></p>
<li>Click at <strong>Add a Gadget</strong>.</li>
<li>After emerging pop up window , Klik <strong>add to blog</strong> button for the things HTML/JavaScript. See the picture following :</li>
<p><img id="BLOGGER_PHOTO_ID_5137573437138225186" src="http://bp3.blogger.com/_uJHKCfdb2J0/R0xT0jAbSCI/AAAAAAAAABA/DfRdzsPLsz0/s400/Java.jpg" border="0" alt="javascript" /></p>
<li>Copy and paste the code below into available column :</li>
<div>
<form>
<div>
<input onclick="javascript:this.form.txt.focus();this.form.txt.select();" type="button" value="Select All" /></div>
<p><textarea cols="55" rows="100" name="txt">&lt;form&gt;&lt;select name=&#8221;menu&#8221; onchange=&#8221;window.open(this.options[this.selectedIndex].value,&#8217;_blank&#8217;)&#8221;size=1 name=menu&gt; &lt;option&gt;- Blog Tutorial &#8211; &lt;/option&gt; &lt;!&#8211; change the links with your own &#8211;&gt; &lt;option value=&#8221;http://rohman-freeblogtemplate.blogspot.com/2007/11/strart-to-blogging.html&#8221;&gt;Start to blogging&lt;/option&gt; &lt;option value=&#8221;http://rohman-freeblogtemplate.blogspot.com/2007/11/how-to-settings-your-blog.html&#8221;&gt;Blog setting&lt;/option&gt; &lt;option value=&#8221;http://rohman-freeblogtemplate.blogspot.com/2007/11/how-to-backup-template.html&#8221;&gt;Backup template&lt;/option&gt; &lt;option value=&#8221;http://rohman-freeblogtemplate.blogspot.com/2007/12/how-to-backup-your-widgets_19.html&#8221;&gt;backup widget&lt;/option&gt; &lt;/select&gt;&lt;/form&gt; </textarea></p>
</form>
</div>
<li>Click   <img id="BLOGGER_PHOTO_ID_5137573995483973746" src="http://bp1.blogger.com/_uJHKCfdb2J0/R0xUVDAbSHI/AAAAAAAAABo/yznWVB-GVmo/s400/save-changes_03.jpg" border="0" alt="save changes" /></li>
<li>Finish. Please see the result.</li>
</ol>
<p>OK brother, now you have a <strong>drop down menu</strong> at your blog. Or maybe you still confused with the step above? don&#8217;t worry i have an easy way to do it, just click the button below, log in to your blog and the widget will add to your blog <strong>automatically</strong>:</p>
<div>
<form>
<select name="menu" size="1">
<option>- Blog Tutorial &#8211; </option>
<p> <!-- change the links with your own --><br />
<option value="http://rohman-freeblogtemplate.blogspot.com/2007/11/strart-to-blogging.html">Start to blogging</option>
<option value="http://rohman-freeblogtemplate.blogspot.com/2007/11/how-to-settings-your-blog.html">Blog setting</option>
<option value="http://rohman-freeblogtemplate.blogspot.com/2007/11/how-to-backup-template.html">Backup template</option>
<option value="http://rohman-freeblogtemplate.blogspot.com/2007/12/how-to-backup-your-widgets_19.html">backup widget</option>
</select>
</form>
</div>
<p>Add a dropdown in the sidebar of your blog.</p>
<form action="http://beta.blogger.com/add-widget" method="post">
<input name="widget.title" type="hidden" value="My menu" /> <textarea name="widget.content">&lt;form&gt;&lt;select name=&#8221;menu&#8221; onchange=&#8221;window.open(this.options[this.selectedIndex].value,&#8217;_blank&#8217;)&#8221;size=1 name=menu&gt; &lt;option&gt;- Blog Tutorial &#8211; &lt;/option&gt; &lt;!&#8211; change the links with your own &#8211;&gt; &lt;option value=&#8221;http://rohman-freeblogtemplate.blogspot.com/2007/11/strart-to-blogging.html&#8221;&gt;Start to blogging&lt;/option&gt; &lt;option value=&#8221;http://rohman-freeblogtemplate.blogspot.com/2007/11/how-to-settings-your-blog.html&#8221;&gt;Blog setting&lt;/option&gt; &lt;option value=&#8221;http://rohman-freeblogtemplate.blogspot.com/2007/11/how-to-backup-template.html&#8221;&gt;Backup template&lt;/option&gt; &lt;option value=&#8221;http://rohman-freeblogtemplate.blogspot.com/2007/12/how-to-backup-your-widgets_19.html&#8221;&gt;backup widget&lt;/option&gt; &lt;/select&gt;&lt;/form&gt; </textarea><br />
<input name="go" type="submit" value="Add To My Blog" /> </form>
<p>Have a nice day My friends. See you at my next post</p></div>
<p>Source:blogspottutorial.com</p>
]]></content:encoded>
			<wfw:commentRss>http://www.blogbunker.com/blogger-tutorials/how-to-make-a-drop-down-menu/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

