How to add drop down menu in blog?

Drop down menu can help to organize an categorize link.such menu helps clean up design in any website.If your site contain a large amount of information,it is  demanded to add drop down menu.

Here i will show you a precise way to create drop down menu. A thing you need to do is follow my instruction.

Step 1:login to your blogger account.

step 2:click to layout, go to cross column and click edit

step 3:write the following code below

<ul id="devg">
  <li><a href="#">menu1</a></li>
  <li><a href="#">menu2</a></li>
  <li>
    menu3
    <ul>
      <li><a href="#">menu3 part</a></li>
      <li><a href="#">menu3 part</a></li>
      <li><a href="#">menu3 part</a></li>
    </ul>
  </li>

   
 <li><a href="#">menu4</a></li>
  <li><a href="#">menu5</a></li>
</ul>
and save it.

Now lets do next important steps,

Step 5:Go to layout, click template designer  on right  top.

Step 6: Cliick to advance , scroll down and click to Add Css .

Step 7:Write the following code in rectangular box,

/* DROPDOWN MENU BY howiset.blogspot.com */
.tabs-inner .widget ul#devg {
  text-align: left;
  display: inline;
  margin: 0;
  padding: 15px 4px 17px 0;
  list-style: none;
  border:none;
}
.tabs-inner .widget ul#devg li {
  font-size: 12px/18px;
  font-family: sans-serif; /* Font for the menu */
  display: inline-block;
  margin-right: -4px;
  position: relative;
  padding: 15px 20px;
  background: #fff; /* background colour of the main menu */
  float:none;
  cursor: pointer;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
}
.tabs-inner .widget ul#devg li a {
padding:0;
font-family: sans-serif; /* Font for the menu links */
border:0;
}
.tabs-inner .widget ul#devg li:hover {
  background: #555; /* background colour when you roll over a menu title */
  color: #fff; /* font colour when you roll over a menu title */
}
.tabs-inner .widget ul#devg li:hover a {
  background: transparent;
  color: #fff; /* font colour when you roll over a menu title link */
}
.tabs-inner .widget ul#devg li ul {
  z-index:1000;
  border:none;
  padding: 0;
  position: absolute;
  top: 45px;
  left: 30px;
  float:none;
  width: 150px;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  display: none;
  opacity: 0;
  visibility: hidden;
  -webkit-transiton: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  -ms-transition: opacity 0.2s;
  -o-transition: opacity 0.2s;
  -transition: opacity 0.2s;
}
.tabs-inner .widget ul#devg li ul li {
  background: #555; /* background colour of the sub menu items */
  display: block;
  color: #fff; /* font colour of the sub menu items */
  text-shadow: 0 -1px 0 #000;
}
ul#devg li ul li a{
  color:#fff  /* link colour of the sub menu items */
}
.tabs-inner .widget ul#devg li ul li:hover {
  background: #666; /* background colour when you roll over sub menu items */
}
.tabs-inner .widget ul#devg li:hover ul {
  display: block;
  opacity: 1;
  visibility: visible;
}

and click Apply to Blog .

Finally to feel the change made click to view blog.


Stay happy with www.howiset.blogspot.com

How to generate sitemap for blog? Why to generate site?Is it is usefull to blogger? How to generate sitemap for blog?

 1. What is sitemap?
- Sitemap is the list of accessible pages in your website.

2.Why to generate site?Is it is usefull to blogger?
Generating the sitemap is very usefull to bloger.
sitemap helps search engines likegoogle,yahoo,bing etc to crawl easily in your pages of blog.Easy crawling helps to better index of your post, whenever you made it.Thus it is beneficial to the blogger.



How to generate sitemap for blog?

1.click here and open the sitemap generator

2.type the full URL of your Blogger including with http:// in given rectangular box

3. click to the generate sitemap button and this tool will generate necessary text for your sitemap.

4.copy the generated text display in your clipboard

5.login to you blog,click to the setting button

6.click Search preferences, enable the Custom robots.txt option and paste text here,save the change made.

paste code here

certainly, change made will automatically find your XML sitemap files

How to creat navigation menu in blog?

how to create navigation menu in blog?
follow the following steps:-

1.login to your blogger account.

2.go to the layout menu in the side bar

3.scroll below and click to the ADD a Gadget option.

4.a new tab will be opened,scroll down and click the "+"
sign option side to the HTML/JAVASCRIPT.

5.and content box paste the following code:-

<ul class="basictab">
<li class="selected"><a href="#">Home</a></li>
<li><a href="#">javascript</a></li>
<li><a href="#">computer network</a></li>
<li><a href="#">see user view</a></li>
<li><a href="#">extra</a></li>
<li><a href="#">privacy policies</a></li>
<li><a href="#">help</a></li>
</ul>

6.and save it.

7.you can preview it and finally click save arrangement option in previously opened or original tab.

8.now view the blog,you can find what you want in your blog.




Stay happy with www.howiset.blogspot.com