Saturday, February 7, 2015

Beautiful Menu Box For Blogger Blog

Menu Bar Blogger
Live Demo 
How To Make Beautiful Menu Box For Blogger
Today I show you how to install beautiful menu bar box in your blogger blog. You can easily change the color, font size, and you place this widget anywhere you want in your blog. This widget use lite "HTML/JavaScript" if you use this to your blog, they have never affected your blog/website speed. So install and enjoy this cool widget. Lets see how to install this widget to your blogger blog.

Just take few step to install this
1: Go to blogger and open, Design >>> and then click Edit HTML.  
2: Now Press Ctrl+F after search bar is open
3: Now Search This ]]></b:skin> Tag
4: Copy below code before  ]]></b:skin> 
///////****** MyBloggerTools.com******//////{ list-style:none; margin:0px; padding:0px;}#menu4 { width: 200px; border-style: solid solid none solid; border-color: #ffffff; border-size: 5px; border-width: 0px; } #menu4 li a {   height: 32px;   voice-family: "\"}\"";    voice-family: inherit;   height: 24px; text-decoration: none; } #menu4 li a:link, #menu4 li a:visited { color: #ffffff; display: block; background: url(http://2.bp.blogspot.com/-zNHIImS_Kjw/VNaH7SZWMyI/AAAAAAAAA10/8mPH4ZZ9MSE/s1600/MyBloggerToolsMenuBlue.gif); padding: 7px 0px 0px 30px; } #menu4 li a:hover { color: #fff; background: url(http://2.bp.blogspot.com/-zNHIImS_Kjw/VNaH7SZWMyI/AAAAAAAAA10/8mPH4ZZ9MSE/s1600/MyBloggerToolsMenuBlue.gif) 0 -32px; padding: 7px 0 0 30px; } #menu4 li a:active { color: #fff; background: url(http://2.bp.blogspot.com/-zNHIImS_Kjw/VNaH7SZWMyI/AAAAAAAAA10/8mPH4ZZ9MSE/s1600/MyBloggerToolsMenuBlue.gif) 0 -64px; padding: 7px 0 0 30px; } ///////****** MyBloggerTools.com******//////
5: and save these settings 
6: now go to Design >>> and click Page Element
7: and click Add Gadget, then select "HTML/JavaScript". 
8: Copy below code and paste to "HTML/JavaScript" Gadget & save settings
<div id="menu4"> <ul>   <li><a href="http://www.mybloggertools.com/" title="Home">Home</a></li>   <li><a href="http://www.mybloggertools.com/" title="About Me">About Me</a></li>   <li><a href="http://www.mybloggertools.com/" title="My Blogger Tools">My Blogger Tools</a></li>   <li><a href="http://www.mybloggertools.com/" title="Blogger SEO">Blogger SEO</a></li>   <li><a href="http://www.mybloggertools.com/" title="Contact Us">Contact Us</a></li>    </ul></div>
9: your new widget is installed successfully. 
10: now Green URL,s change to your related URL, s. 
11: Change White Color World as your Title name as you like to write. 
12: save all settings and your new Beautiful Widget are Done. :)

I hop this widget are helpful to you. If you have any question about this post, don't hesitate to contact us. Because I am always waiting for your good reply anxiously. You leave your comments in, below this post comments area.

Previous Post
Next Post

0 comments: