Question

Как создать собственные кнопки в меню?

 

Код меню:

 <nav class="clearfix">
 <!-- <sblock_nmenu> -->
<!-- <bc> -->$NMENU_1$<!-- </bc> -->
<!-- </sblock_nmenu> -->
 </nav>

Answer 1

Смотрим ваши стили с строки 119 по 230:

/*------*/

/* Menus */
nav {
 padding: 0;
 margin-bottom: 7px;
 text-align: center;
 background: #fff; /*Это текущий белый фон меню изменяйте на ваше фото кнопки*/
 }

nav ul.uMenuRoot {
 list-style: none outside none;
 margin: 0 auto;
 padding: 0;
 }
nav ul ul {
 background: none repeat scroll 0 0 #f5f5f5;
 left: -1px;
 opacity: 0;
 position: absolute;
 top: 100%;
 transition: all 0.2s ease-out 0.15s;
 visibility: hidden;
 white-space: nowrap;
 z-index: 1;
 text-align: left;
 }
 nav > ul > ul {border-left: 1px solid #00aeba;}
nav ul ul ul {
 left: 100%;
 padding-left: 1px;
 top: 0;
}
nav ul.uMenuRoot > li {
 list-style: none; 
 display: inline-block; 
 margin: 0; 
 padding: 0;
 position: relative;
 border-left: 1px solid #e3e3e3; /*это текущий разделитель между меню*/
 }
 nav ul.uMenuRoot > li:first-child {border: none;}
 nav ul.uMenuRoot > li:last-child {border-right: 1px solid #e3e3e3;}
 
nav ul.uMenuRoot > li.has-submenu:hover {border-left: 1px solid #00aeba;}
nav ul.uMenuRoot > li > ul {border-left: 1px solid #00aeba;}
nav li {
 float: left;
 list-style: none outside none !important;
 position: relative;
 
}

nav li.has-submenu > a:after {
 content: "+";
 display: block;
 position: absolute;
 right: 5px;
 top: 0;
 
}

nav li a:hover + ul {
 opacity: 1;
 visibility: visible;
}

nav li:hover > ul {
 opacity: 1;
 visibility: visible;
}
nav li li {float: none;}

nav li li a {padding: 0 20px; display: block; line-height: 40px; text-decoration: none; color: #555;}
nav li li:hover {background: #f5f5f5;}
nav li li:hover > a, nav li li:hover a:hover {background: #e3e3e3; color: #000; text-decoration: none;}
/* ----- */

/* Site Menus */

ul.uMenuRoot > li > a {
 font-size: 100%;
 text-decoration: none;
 display: block;
 color: #000;
 padding: 0 20px;
 margin: 0 0 0 0;
 line-height: 50px;
 }
 
nav li:hover > a, ul.uMenuRoot > li > a:hover, ul.uMenuRoot > li > .uMenuItemA {
 background: url('/.s/t/1253/5.png') no-repeat center top transparent; /*Это зеленая полоска над меню меняйте на что вам нужно*/
}
 
.show-menu {
 position: absolute;
 top: 30px;
 right: 30px;
 width: 50px;
 height: 20px;
 cursor: pointer;
 background: #006872;
 display: none;
 color: #fff;
 text-align: center;
 font-size: 80%;
 padding: 5px 10px;
 font-weight: bold;
 }
 .show-menu:hover {background: #e5e5e5;color: #000;}
/* --------- */