Sunday, 3 June 2012

Create Multi Level Drop Down Menu In Blogger




This is our 5th drop down menu,after sharing two versions of drop down menus here we are sharing another cool drop down menu designed by dynamicdrive and bloggerized mybloggertricks.This is a multi level drop down menu so that it will help you a ot to organize your categories and some important links,also it will help your readers to easily navigate through your blog.The HTML structure of this menu is so easy as you have to use only <ul> and <li> tags,but you have to add a different ul id for a new drop down,that is the little negative point of this menu.Just follow below steps carefully,you will easily add this menu to your blog.Now lets see how to add it to blogger blog,First take a demo of the menu.




Live Menu Demo


How To Add Multi Level Drop Down Menu To Blogger


  1. Go to Blogger Dashboard > Layout
  2. Click on Add a Gadget (below header)
  3. Select HTML/JavaScript
  4. Paste below code inside it,


<script src='http://helperblogger.ucoz.com/code/dd-level-menu.js'
type='text/javascript'></script>
<style>
/* ######### Drop Down Menu Bu HelperBlogger.com ######### */    
/* ######### Matt Black Strip Main Menu Bar CSS ######### */
.ddsubmenustyle, .ddsubmenustyle div {
        /*topmost and sub DIVs, respectively*/
    font: normal 13px Verdana;
    margin: 0;
    padding: 0;
    position: absolute;
    left: 0;
    top: 0;
    list-style-type: none;
    background: white;
    border: 1px solid black;
    border-bottom-width: 0;
    visibility: hidden;
    z-index: 100;
}

.ddsubmenustyle ul {
    margin: 0;
    padding: 0;
    position: absolute;
    left: 0;
    top: 0;
    list-style-type: none;
    border: 0px none;
}

.ddsubmenustyle li a {
    display: block;
    width: 170px;
        /*width of menu (not including side paddings)*/
    color: black;
    background-color: lightyellow;
    text-decoration: none;
    padding: 4px 5px;
    border-bottom: 1px solid black;
}

* html .ddsubmenustyle li {
        /*IE6 CSS hack*/
    display: inline-block;
    width: 170px;
        /*width of menu (include side paddings of LI A*/
}

.ddsubmenustyle li a:hover {
    background-color: black;
    color: white;
}

.downarrowpointer {
        /*CSS for "down" arrow image added to top menu items*/
    padding-left: 4px;
    border: 0;
}

.rightarrowpointer {
        /*CSS for "right" arrow image added to drop down menu items*/
    position: absolute;
    padding-top: 3px;
    left: 100px;
    border: 0;
}

.ddiframeshim {
    position: absolute;
    z-index: 500;
    background: transparent;
    border-width: 0;
    width: 0;
    height: 0;
    display: block;
}
    /* ######### Black Strip Main Menu Bar CSS ######### */
.mattblackmenu ul {
    margin: 0;
    padding: 0;
    font: bold 12px Verdana;
    list-style-type: none;
    border-bottom: 1px solid gray;
    background: #414141;
    overflow: hidden;
    width: 100%;
}

.mattblackmenu li {
    display: inline;
    margin: 0;
}

.mattblackmenu li a {
    float: left;
    display: block;
    text-decoration: none;
    margin: 0;
    padding: 6px 8px;
        /*padding inside each tab*/
    border-right: 1px solid white;
        /*right divider between tabs*/
    color: white;
    background: #414141;
}

.mattblackmenu li a:visited {
    color: white;
}

.mattblackmenu li a:hover {
    background: black;
        /*background of tabs for hover state */
}

.mattblackmenu a.selected {
    background: black;
        /*background of tab with "selected" class assigned to its LI */
}
</style>
<div id="ddtopmenubar" class="mattblackmenu">
    <ul>
        <li>
            <a href="#">LINK1</a>
        </li>
        <li>
            <a href="#" rel="ddsubmenu1">LINK2</a>
        </li>
        <li>
            <a href="#" rel="ddsubmenu2">LINK3</a>
        </li>
        <li>
            <a href="#">Link4</a>
        </li>
        <li>
            <a href="#" rel="ddsubmenu3">LINK5</a>
        </li>
    </ul>
</div>
<script type="text/javascript">
    ddlevelsmenu.setup("ddtopmenubar", "topbar") //ddlevelsmenu.setup("mainmenuid", "topbar|sidebar")
</script>
<ul class='ddsubmenustyle' id='ddsubmenu1'>
    <li>
        <a href='#'>LINK2 ITEM 1</a>
    </li>
    <li>
        <a href='#'>LINK2 ITEM 2</a>
        <ul>
            <li>
                <a href='#'>LINK2 ITEM 2.1</a>
            </li>
            <li>
                <a href='#'>LINK2 ITEM 2.2</a>
            </li>
        </ul>
    </li>
    <li>
        <a href='#'>LINK2 ITEM 3</a>
        <ul>
            <li>
                <a href='#'>LINK2 ITEM 3.1</a>
            </li>
        </ul>
    </li>
    <li>
        <a href='#'>LINK2 ITEM 4</a>
    </li>
</ul>
<ul class='ddsubmenustyle' id='ddsubmenu2'>
    <li>
        <a href='#'>LINK3 ITEM 1</a>
    </li>
    <li>
        <a href='#'>LINK3 ITEM 2</a>
    </li>
    <li>
        <a href='#'>LINK3 ITEM 3</a>
        <ul>
            <li>
                <a href='#'>LINK3 ITEM 3.1</a>
            </li>
            <li>
                <a href='#'>LINK3 ITEM 3.2</a>
            </li>
            <li>
                <a href='#'>LINK3 ITEM 3.3</a>
            </li>
            <li>
                <a href='#'>LINK3 ITEM 3.4</a>
            </li>
        </ul>
    </li>
    <li>
        <a href='#'>LINK3 ITEM 4</a>
    </li>
    <li>
        <a href='#'>LINK3 ITEM 5</a>
        <ul>
            <li>
                <a href='#'>LINK3 ITEM 5.1</a>
            </li>
            <li>
                <a href='#'>LINK3 ITEM 5.2</a>
                <ul>
                    <li>
                        <a href='#'>LINK3 ITEM 5.2 1</a>
                    </li>
                    <li>
                        <a href='#'>LINK3 ITEM 5.2 2</a>
                    </li>
                    <li>
                        <a href='#'>LINK3 ITEM 5.2 3</a>
                    </li>
                </ul>
            </li>
        </ul>
    </li>
    <li>
        <a href='#'>LINK3 ITEM 6</a>
    </li>
</ul>
<ul class='ddsubmenustyle' id='ddsubmenu3'>
    <li>
        <a href='#'>LINK5 ITEM 1</a>
    </li>
    <li>
        <a href='#'>LINK5 ITEM 2</a>
    </li>
    <li>
        <a href='#'>LINK5 ITEM 3</a>
    </li>
    <li>
        <a href='#'>LINK5 ITEM 4</a>
    </li>
    <li>
        <a href='#'>LINK5 ITEM 5</a>
    </li>
</ul>


How to Customize It?

  • Here normal ul and li rules are applied
  • To change background simply change background: #414141;
  • Replace every # with your own link
  • To create a drop down menu inside a Main Menu link simple add to it a rel attribute like rel="ddsubmenu1 Change the drop down number accordingly.

Use HTML Editor?


I highly recommend you to use the HTML Editor as you can edit and see live demo of your menu in HTML Editor.

Further Help?


Many newbies bloggers gets the problem while adding links and texts.If you are getting the same problem then simply provide a tree menu of your menu,I will build the HTML part for you.Also feel free to ask your any little query...


130 Comments : Read Them Below Or Add One

  1. HOW CAN I ADD MY MENU NAME AND ALL DOES MENU UNDER THE DROP DOWN MENU

    ReplyDelete
    Replies
    1. Hey sorry :) I tried but I can't understand what are you asking about :) Will you pls. explain it in brief so that I can work and fix your problem soon :)

      Delete
    2. Yeah i want add like you Taiwoemmy but don't know how to do

      Delete
    3. Rahul Ippar : ex i want put labels Game in to the manu drop....but i don't know how to do

      Delete
  2. Hi Rahul can you add a mega drop down menu also which has columns and rows

    ReplyDelete
    Replies
    1. Ok I will post a tutorial about mega drop down menu soon :)

      Delete
  3. Thank you Rahul so much for this amazing information. I have been looking for this for a long time.

    Can you also post more designs of drop down menu bars? That would be nice.

    Thanks

    ReplyDelete
  4. how to add content into dropdownlist hyperlinks in blogger. Thanks in Advance.

    ReplyDelete
  5. Hi,
    How can I remove the red arrows?
    Thanks,
    tabak

    ReplyDelete
    Replies
    1. To remove this red arrow you have to edit the script (http://code.helperblogger.com/dd-level-menu.js)

      First go to the script
      Remove the below image URLS

      http://1.bp.blogspot.com/-8CsFG7HWkos/T8o5nSpSnWI/AAAAAAAAB3I/7A4hohJANEM/s1600/helperblogger.com-arrow-down.gif

      http://3.bp.blogspot.com/-NjdLcKUwgLA/T8o5oRsLskI/AAAAAAAAB3Q/CY1mCsobpdA/s1600/helperblogger.com-arrow-right.gif

      Now upload the script and replace my script URL with yours.To host your edited javascript you can use yourjavascript.com

      Delete
    2. Thanks Rahul.
      But I have an other problem: I'd like change the main menu selected backgroundcolor from gray to black. How can I get it?
      Regards,
      tabak

      Delete
  6. Ok find below code in your menu,

    background: #414141;

    and replace #414141 with your own hex color code,to choose your own color you can use our Hex Color Code Generator Tool

    ReplyDelete
  7. Of course early I changed it, but the main menubar selection is more gray:
    http://dragonfisher.blogspot.hu/
    This is a test blog, links to another blog! I would like to change gray to black.

    ReplyDelete
    Replies
    1. There are two #414141; change them both also they both should be same.

      Delete
  8. Ok. This will be the final version, if you're interested check out the blog. I delete it a few days. Thanks. tabak

    ReplyDelete
    Replies
    1. You have created beautiful menu,just watched it :)

      Delete
  9. Created for you, not me. :)

    ReplyDelete
    Replies
    1. I know that :) but really you have used beautiful background for menu....

      Delete
  10. How do I change the color of the submenus background?

    ReplyDelete
    Replies
    1. If you want to change background color of submenu in normal mode then find below code and replace lightyellow with your own color code.

      and if you want to change background color on hover then find below code -

      .ddsubmenustyle li a:hover {
      background-color: black;

      and replace black with your own code.

      Delete
  11. This was very helpful. It took me a while to finish doing it on my blog but I think did a good job. Super thanks! :D

    ReplyDelete
  12. Tahnsk for the reply! For some reason when I adjusted the code in HTML Editor you suggested it all looked exactly how I wanted. But when I copied and pasted the code onto my blog, it looked all like a vertical list with bullet points and no colors! Please what am I doing wrong?

    ReplyDelete
  13. HOW TO ADD 3- 4 LINKS IN ONE TAB OR LEVEL.pLZ CHECK OUT MY SITE
    http://moviesagahd.blogspot.in
    AND TELL

    ReplyDelete
    Replies
    1. To add links to any tab or level use this code,

      <ul>
      <li>
      <a href='#'>LINK5 ITEM 1</a>
      </li>
      <li>
      <a href='#'>LINK5 ITEM 2</a>
      </li>
      <li>
      <a href='#'>LINK5 ITEM 3</a>
      </li>
      <li>
      <a href='#'>LINK5 ITEM 4</a>
      </li>
      </ul>

      replace <b>#</b> with link and replace <b>LINK ITEM</b> with a link name.

      Delete
  14. i didnt get anything i'd try so many time but i am unable to post and see the posts in that submenu

    ReplyDelete
    Replies
    1. Send me a copy of your template.

      rahul@helperblogger.com

      Delete
  15. This template is really great; I love how simple and easy it is to customize. However, I'm having a problem with the sub menus.

    For some reason, I can't delete the submenus under Link2 without also deleting the submenus under Link3, Link4, etc. I don't need any submenus under Link2, but I do need them for the following menus. How do I fix this?

    ReplyDelete
  16. Hi, this widget is exactly what I needed. Thanks for sharing! When I add it to my blog, it looks just fine, but when I try to edit with my own links, blogger won’t allow me to save the changes. Do you have an idea of what is going wrong and how I can solve the issue? Thanks in advance.

    ReplyDelete
  17. @All - If you cant add this menu to your blog perfectly then send me a copy of your template in .xml format,with full details of customizations.

    rahul@helperblogger.com

    ReplyDelete
  18. Nice article!Very cool!That's is exactly what I have been looking for so far...
    Thanks a lot

    ReplyDelete
  19. Ok, I am completely clueless... after I paste this how do I actually put posts under the tabs and how do I rename the tabs? I apparently am completely illerate and really need you to draw this out for me! I have looked all over the internet and havent gotten any answers! Plese help me!

    ReplyDelete
    Replies
    1. Can u send me a structure of your menu so that I can make a code for it.

      Delete
  20. THANK YOU THANK YOU THANK YOU!!! Awesome tutorial, my blog is now rocking it's new dropdown menu! THANK YOU! Check it out if you would like - handiworkforelijah.blogspot.com

    ReplyDelete
  21. Is excellent piece! I am thinking is it possible to have drop down menu on Picture link! Thank you ! By using your code, it helps to save much of my time!

    ReplyDelete
  22. I have tried this code, but not all the buttons are working. Can you pls check. http://colorandspices.blogspot.com/
    And I want to remove those red trianlges, how to do that? And what I should do change the color of the buttons? they are always blue. Thank u.

    ReplyDelete
  23. This comment has been removed by the author.

    ReplyDelete
  24. Having difficulties fixing that.


    http://kanyinulia.blogspot.com/

    ReplyDelete
  25. i am giving u 200/100 marks thanks

    ReplyDelete
  26. Very useful Dude here is my site i already put your tutorials code..
    Funny Pinoy Picture,Pinoy Meme,Pinoy Pick-Up Lines

    ReplyDelete
  27. Hi, how can I manage the width of the boxes of the menù?
    where I have to chage parameters?

    ReplyDelete
    Replies
    1. I'm wondering the same thing. An answer would be greatly appreciated!

      Delete
    2. I just discovered a way to do this!

      Go to the Blogger Dashboard > Template > Customize > Advances > Add CSS

      Then type in the box:

      .tabs-inner {
      text-align: center;
      }

      .tabs-inner .widget li a{
      width: 130px
      }

      The width is what I used, but obviously you'll have to adjust it to your blog. ;)

      Hope this helps!

      Delete
    3. 10x Janina... it is useful me too

      Delete
  28. Is this possible to do in the new dynamic views in blogger??

    ReplyDelete
  29. Hi,
    I'm wondering, how to change the small red arrow, how to change it ?
    Thanks in advance. :)

    Also Very much thnx for the post.

    ReplyDelete
  30. This comment has been removed by the author.

    ReplyDelete
  31. HI THIS IS WORKING ONLY WITH OUT LINKS,ITS NOT DISPLAYED PROPERLY

    plz solve my problem as soon
    my blog is
    www.harishkumarreddyc.blogspot.com

    plz send to my mail:harishkumarreddy12@gmail.com

    ReplyDelete
  32. hey bro.this is for old blog interferance .but how can we do this for oru new blog...

    ReplyDelete
  33. thanks loading plz tells me how open link?

    ReplyDelete
  34. It does not work properly in IE. How to settle it?

    ReplyDelete
  35. Rahul,
    I absolutely love your tutorial, very easy to understand. I was even able to do some customizing. But I am having a problem building the tree menu. Could you please help. Here is the tree menu that I am trying to build:
    Link 1

    Link 2
    Link 2.1
    Link 2.1 (1)
    Link 2.1 (2)
    Link 2.2
    Link 2.3
    Link 2.3 (1)
    Link 2.3 (2)
    Link 2.3 (3)
    Link 2.4
    Link 2.5
    Link 2.6
    Link 2.6 (1)
    Link 2.6 (2)

    Link 3
    Link 3.1
    Link 3.1 (1)
    Link 3.1 (2)
    Link 3.2
    Link 3.3
    Link 3.3 (1)
    Link 3.3 (2)
    Link 3.3 (3)
    Link 3.4
    Link 3.5
    Link 3.6
    Link 3.6 (1)
    Link 3.6 (2)

    Link 4
    Link 4.1
    Link 4.1 (1)
    Link 4.1 (2)
    Link 4.2
    Link 4.3
    Link 4.3 (1)
    Link 4.3 (2)
    Link 4.3 (3)
    Link 4.4
    Link 4.5
    Link 4.6
    Link 4.6 (1)
    Link 4.6 (2)
    Link 4.7

    Link 5
    Link 5.1
    Link 5.1 (1)
    Link 5.1 (2)
    Link 5.2
    Link 5.3
    Link 5.3 (1)
    Link 5.3 (2)
    Link 5.3 (3)
    Link 5.4
    Link 5.5
    Link 5.6
    Link 5.6 (1)
    Link 5.6 (2)

    Link 6
    Link 6.1
    Link 6.1 (1)
    Link 6.1 (2)
    Link 6.2
    Link 6.3
    Link 6.3 (1)
    Link 6.3 (2)
    Link 6.3 (3)
    Link 6.4
    Link 6.5
    Link 6.6
    Link 6.6 (1)
    Link 6.6 (2)

    Link 7
    Link 7.1
    Link 7.1 (1)
    Link 7.1 (2)
    Link 7.2
    Link 7.3
    Link 7.3 (1)
    Link 7.3 (2)
    Link 7.3 (3)
    Link 7.4
    Link 7.5
    Link 7.6
    Link 7.6 (1)
    Link 7.6 (2)

    Link 8
    Link 8.1
    Link 8.1 (1)
    Link 8.1 (2)
    Link 8.2
    Link 8.3
    Link 8.3 (1)
    Link 8.3 (2)
    Link 8.3 (3)
    Link 8.4
    Link 8.5
    Link 8.6
    Link 8.6 (1)
    Link 8.6 (2)

    Link 9
    Link 9.1
    Link 9.1 (1)
    Link 9.1 (2)
    Link 9.2
    Link 9.3
    Link 9.3 (1)
    Link 9.3 (2)
    Link 9.3 (3)
    Link 9.4
    Link 9.5
    Link 9.6
    Link 9.6 (1)
    Link 9.6 (2)

    Link 10

    THANK YOU so much

    ReplyDelete
  36. is there anyway to align everything in the centre?

    ReplyDelete
  37. I tried changing the submenu color but when I put in the hex code it doesn't work. But I don't see a color I like in the javascript color code.
    Also, how can I make the entire menu wider? i want to fit all the tabs in one row.

    ReplyDelete
  38. This is great! THANK YOU! I have one question, I have ten categories but the menu bar is only long enough to show 5 on one line so it breaks the menu bar into two lines. I just want one long menu line - can you help me do that?

    ReplyDelete
  39. Nevermind, I found out how to fix my problem,, thank you so much!

    ReplyDelete
  40. Hey Thanks so much for this! I set it up but how do I add content to it? I wanted the menu to categorize my blogs like recipes n stuff so i'm wondering if I can add several posts to one link? Please help me out!! Thanks!

    ReplyDelete
  41. Is there a way to center the whole thing?

    ReplyDelete
  42. hi dear admin can you talk me plzzzz my email >>>notuse121@ymail.com
    i need your sujjestion plzzzz i leave in bangladesh from dhaka tnxx to advance help me

    ReplyDelete
  43. hello sir plzzzzz help me today i submit your template <<>> http://pchelplinebds.blogspot.com/ all is ok but google earning not show my blogger home plzzz can you explain me how to solved plzz & i also try to in (edit html)then go this address see this (http://pchelplinebds.blogspot.com/b/app-preview?token=XbRDizoBAAA.6Ih2uQHGGrwwQINefCcU7A.dM6eazI3pG3N91ETbHmoGQ) what's problem can i remove your Nice template to blogger plzzzz share me early tnxxxx

    ReplyDelete
  44. Thanks a lot ! This is what I exactly wanted but,pls tell me how do i add contents to the link.I have no idea about Html and CSS.

    ReplyDelete
  45. hello rahul i like to ask some question so can you please give your email address

    ReplyDelete
  46. hello dear
    i have a question
    pls tell in this # how can we replace " # " , with a link

    http://mobilemovii.blogspot.com/2012/11/alan-wakes-american-nightmare-pc-game.html

    ReplyDelete
  47. hello Rahul, can i can red arrows? in a previous comment you have mentioned about editing it,

    "To remove this red arrow you have to edit the script (http://code.helperblogger.com/dd-level-menu.js)

    First go to the script
    Remove the below image URLS

    http://1.bp.blogspot.com/-8CsFG7HWkos/T8o5nSpSnWI/AAAAAAAAB3I/7A4hohJANEM/s1600/helperblogger.com-arrow-down.gif

    http://3.bp.blogspot.com/-NjdLcKUwgLA/T8o5oRsLskI/AAAAAAAAB3Q/CY1mCsobpdA/s1600/helperblogger.com-arrow-right.gif

    Now upload the script and replace my script URL with yours.To host your edited javascript you can use yourjavascript.com"

    i didn't get it :/ kindly help.

    ReplyDelete
  48. Hey there!

    I really hope you can help me. I've FINALLY got a drop down menu to look ok on a blog I'm working on, however as soon as I move my mouse from the parent page (About) to select a sub page, the drop down menu disappears. Any idea what's going wrong? (Newbie here).

    http://swirlstwirlsblog.blogspot.com.au/

    ReplyDelete
  49. thanks i try this to my blog http://islamicquotations.blogspot.com/

    ReplyDelete
  50. This comment has been removed by the author.

    ReplyDelete
  51. Hello Rahul,
    You made a nice gadget, just wath I need.
    I programed (fill in) in HTML script of the puldown menu for my weblog, I'm proud on that.
    http://jlwebzeilen.blogspot.nl/. In Google chrome the menu works very good. But in MS explorer 8 it isn't stabel.
    Sometimes appeares grey field by puldown and also in de left upper corner of the blog. Also two red arrows appeir in de upper row. The mouseover doesn't work stabel.
    Do you have a solution? If you want the script and screenshot how can I send it to you?
    Thanks for the answere. John Langeveld. Holland.

    ReplyDelete
  52. hay have u made this site on blooger . if yes than plz tell me how to change my blog http://javacourseblog.blogspot.com/ into such custom domain? shall i need to change my all pages redirection plz plz tell me .

    ReplyDelete
    Replies
    1. Hello Alice,

      I just used the new Look sjabloom of Google Blogger.
      It is possible to choose for several colors for frames en fonts.
      As background I used my own made picture and that's is all. The background image I made in MS publiser and saved it as JPEG 1438x1205

      Only the pulldown menu of Rahul was missing when it works oke in MSIE 8.0 then I'm complete happy.
      But I saw on your blog that your an expert in Java. Cann't you make this script by yourself?

      Delete
  53. excellent post,i really liked your post,thank you for sharing this excellent post,you may also like my blog | Search Engine Optimization | Seo Ebook | Blogger Widget | Blogger Template |

    ReplyDelete
  54. very nice post i like it sir g
    http://knowledge4urlife.blogspot.com/

    ReplyDelete
  55. thanx...it works
    softwaresuneeds.blogspot.in

    ReplyDelete
  56. Just added this application, it works very well..look at my site: http://philippineproperties101.blogspot.com/ . Thank you helperblogger!

    ReplyDelete
  57. This is a great tool especially for newbies like myself. Having two issues. When I replace '#' with link it doesn't work. Also, sub sub menu disappears when I mouse over. Thanks for the help and again, Thanks for the assistance.

    ReplyDelete
  58. Disregard the link not working, I figured it out. Have to replace the entire "#", not just the #.

    ReplyDelete
  59. Good Post Thnax
    Get Free Download Softwares with key
    LQPonline. blogspot.com provides free downloads for Windows ,WORLD Best Site for,Solve your Computer Problems, Download Free Register Software & Games, Make Money Online, Learn Complete Computer Softwares and Computer Tips in Urdu Language with Video.
    LQponline.blogspot.com I like
    Free Download EA Sports Cricket 2012 Full Version For Pc
    ea sports fifa 2012 free download full version for pc
    ea sports fifa 2012 free download
    speedupmypc 2013 serial number
    download avg internet security 2013 full version

    ReplyDelete
  60. Nicely done - thanks so much! I tried other dynamic menus for blogger in the past and none of them integrated this nicely and was this easy to set up. You can see it working here: http://www.disgracesonthemenu.com/

    ReplyDelete
  61. bro rahul.. tis my blog..http://othmanakassim.blogspot.com/

    how can i add multilevel at my css..-.-'
    help pls..
    i wan do at oum (lvl 1)>facetoface(lvl 2)>then dalam pembikinan(lvl 3)..
    i wan put dalam pembikinan under facetoface....plss help me..

    ReplyDelete
  62. awesome one...
    thanks
    using it here : http://www.andro-park.org

    ReplyDelete
  63. Hello Friend,

    Just followed your instructions and applied it on my Blog and working smoothly. Thank you so much...
    Blog link: http://teach2mee.blogspot.in/

    Could you tell me how to change the tab menus and submenus color as like 3D?

    How to arrange the tab menus width parallel (same in size). Because, it expands based on the entered text (menu name). You can see my Blog for reference.

    ReplyDelete
  64. Good article, permission learn bro and good luck and keep the spirit always make useful posts

    ReplyDelete
  65. my tree menue
    1.Home
    2. 40 Ahadith
    3. Downloads Books
    i. Urdu Books
    ii. English Books
    iii. Arabic Books
    4. About Me

    ReplyDelete
  66. my friend thanx a lot:

    2 questions... What is happening in my case in Contact us..

    Can i post this article in Greek in my post?

    ReplyDelete
  67. Got a problem. I'm using a blogger Picture Window template. Installed the menu and it works great in Chrome. Doesn't work properly in IE8 - phantom menu in upper left corner of window, sometimes the menus pull down and sometines not, names change color to white on the menu bar, etc. Any suggestions?

    ReplyDelete
  68. This comment has been removed by the author.

    ReplyDelete
  69. Thanks you very much Rahul, it's working for me.

    http://perlexamples.blogspot.com/

    ReplyDelete
  70. How do I add it to blogger if there is no option under the header to add a gadget? I already have pages there with all my content I do not want to lose. It took me a long time to add all the info there already. Please email me at jalapenogal77@gmail.com. Thank you :)

    ReplyDelete
  71. dropdown menus not showing on my blog.
    plzz tell me what i do next?

    ReplyDelete
  72. Thank you for this! I was able to get everything looking how it should. When I hover over the menus, I am able to click on submenus but not the sub-sub menus. Can you please help?

    freebies4meandu.blogspot.com

    ReplyDelete
  73. Hello everyone,

    This is an amazing add for my new blog, I really enjoy it and thank you for providing the html code. I noticed though that it's not working correctly on Google chrome:
    http://preludiance.blogspot.nl/
    I saw three other blogs (from the replies here) and I was almost thought that I had done something wrong with the code, but I saw another -so far- blog that has the same problem as mine:
    http://teach2mee.blogspot.in/

    Could anyone shed some light here please :(

    ReplyDelete
  74. House of Quality Wallpapers We provide you a high and standard wallpapers for desktop and high quality backgrounds. just download and make a fun....
    http://awsum-wallpapers.blogspot.com/

    ReplyDelete
  75. Bro i like your post and i also used your drop down menu....
    but i want remove "Red Arrows" in tabs...
    How is it?

    ReplyDelete
  76. This comment has been removed by the author.

    ReplyDelete
  77. great post thanks.
    you may also like earn-onlinesteps.blogger.in

    ReplyDelete
  78. Thank you very much ! This helped a lot.

    ReplyDelete
  79. Thanks it i have used in my two blogs . First is
    Website Development

    ReplyDelete
  80. Thank you for this helpful post bro! Indeed it's very interesting. :)
    Bloggerjin

    ReplyDelete
  81. How to fix menu on top when scrolling down

    ReplyDelete
  82. How do you make it so that the drop down menu drops downwards instead of the menu's appearing above the initial menu when you hover over it?

    ReplyDelete
  83. I am trying to fix the navigation menu to the top so it always stays visible.
    .mattblackmenu{
    float:left;
    position:fixed;
    top:0%;
    left:0%;
    z-index:99;
    }
    I tried with the above code but the submenu doesn't show up when the page is scrolled.
    Please help.
    Thank you for the navigation menu.

    ReplyDelete
  84. How do I center navigation menu?

    ReplyDelete
  85. thanks a lot bro...its working

    ReplyDelete
  86. Hello ! This gadget works very well, I just did not manage to change the color of the text and to remove the red arrows. Can anyone help me?

    http://ultimateTDV.blogspot.com

    ReplyDelete
  87. Useful Tips. I will try it on my blogger, And i face nay problem will like to contact to you. Till then keep posting more about the blogger and its benefits.good job you doing here.
    internet marketing expert

    ReplyDelete
  88. rahul, are you locked copy from your site or something? i can't copy the code, dude! when i copy it give me this code: LINK1 LINK2 LINK3 Link4 LINK5
    - See more at: http://www.helperblogger.com/2012/06/create-multi-level-drop-down-menu-in.html#sthash.tmEIvmx4.dpuf

    ReplyDelete
    Replies
    1. Solution: Use another browser, e.g. IE instead of Chrome! Then copying works! I had the same problem and solved it that way!

      Delete
  89. I have been trying to add more to Phuket Tab but can't figure out how to add another Link. Everything works fine until I try to add more links. Please help.

    http://travelthailandandbeyond.blogspot.com

    ReplyDelete
  90. Can you please tell me how can i add different categories in drop down menu. I also want to add web development services topic related blogs for our visitors. And after that each blog shows in particular category. Please send me some programming code which i insert in Blogspot to make our blog more user friendly and interesting.

    ReplyDelete
  91. This comment has been removed by the author.

    ReplyDelete
  92. This comment has been removed by the author.

    ReplyDelete
  93. Obviously great post it is bit complicated to editing in blogger templates
    for newbies but you make it easy for everyone by explaining keep it up!

    ReplyDelete
  94. Nice Drop down menu. Thanks For Sharing...

    ReplyDelete
  95. Great Blog. I am also searching for these kinds of blog. I also use drop down menu in my blogger. Thanks for sharing the very informative blog. New York web designer are also providing such kind of services in drop down menu for blogger.

    ReplyDelete
  96. Hei buddy,,,,,,, u r great,,,,,,,thankx

    ReplyDelete
  97. instead of doing lots of coding there is a simple one where you can create your own dropdown menu for your websites or for blogger blog.. more about creating a dropdown menu you can view in my website: www.informodex.in

    ReplyDelete
  98. Nice post I will try to add this code in my blog http://submitmysites.blogspot.com/ .

    ReplyDelete

If you want to be informed about any replies then click on "Subscribe by email" (present below of comment box).PLEASE DO NOT SPAM