Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #8235

    I disabled woocommerce as it’s not needed yet and probably not for a few years. In the mean time, I’d like to create a top level navigation menu in that area with the built in WP menu management. I checked on themeforest before buying and never received a response. Any word on how to make this happen?

    Thanks for the great theme, it has so many uses.

    #60761

    Hey,

    you can create the sub menu by using the menu manager (Appearance > Menu). Assign the sub menu to the right theme location. Then add following code to css/custom.css:

    /************************************************************************
    SUB Navigation
    *************************************************************************/
    /*first level*/
    .sub_menu {
    position: relative;
    z-index: 130;
    font-size: 11px;
    float: left;
    line-height: 41px;
    height: 40px;
    }

    .sub_menu>ul{
    position: relative;
    top:14px;
    left:-10px;
    }

    .boxed .sub_menu>ul{left:-10px;}

    .sub_menu li{
    float:left;
    position: relative;
    padding:0 10px;
    border-right-style: solid;
    border-right-width: 1px;
    line-height: 10px;
    }

    .sub_menu>ul>li:last-child, .sub_menu>div>ul>li:last-child{
    border:none;
    padding-right: 0;
    }

    /*second level*/
    #top .sub_menu li ul{
    display: none;
    position: absolute;
    width:170px;
    padding:10px 0 0 0;
    z-index: 101;
    -moz-box-shadow: 0 8px 15px rgba(0,0,0,0.1);
    -webkit-box-shadow: 0 8px 15px rgba(0,0,0,0.1);
    box-shadow: 0 8px 15px rgba(0,0,0,0.1);
    left:0;
    border:none;
    margin: 0;
    font-size: 11px;
    }

    .sub_menu li:hover>ul{
    display:block;
    }

    .sub_menu>ul>li:hover>a{
    text-decoration: none;
    }

    .sub_menu li li{
    float:none;
    line-height: 20px;
    border:none;
    padding:0;
    margin:0;
    border-top-style: solid;
    border-top-width: 1px;
    }

    #top .sub_menu li li a{
    display:block;
    text-decoration: none;
    padding:7px 9px;
    border-top: none;
    }

    #top .sub_menu li li a:hover{
    text-decoration: none;
    }

    /*third level and deeper*/
    .sub_menu li li ul{
    top:-1px;
    left:169px;
    background: none;
    padding: 0;
    }

    #60762

    Thanks Dude.

    #60763

    Glad that I could help you :)

Viewing 4 posts - 1 through 4 (of 4 total)

The topic ‘Ecommerce Menu’ is closed to new replies.