Опубликовано: 20 июля 2016
Дерево категорий в 2 строчки
Добрый день! Мы используем Ваш шаблон "Выгодная покупка". Возник
следующий вопрос: можно ли как-то настроить шаблон так, чтоб меню было в
2 строчки?
С уважением, Татьяна.
- Коломна, ул. Кирова, 60а, офис 7
- +7 (995) 656-25-45
- kolmakov.igor@gmail.com
Комментарии (2)
1. в пользовательских стилях прописать правило
@media only screen and (min-width: 993px){ .tree-wrapper { height: auto; line-height: 40px; } }2. в файле tree.html (сайт-дизайн-шаблоны)
в строке
<ul class="base-menu {$type} tree" style="display: none;">
заменить на
<ul class="base-menu {$type} tree">
3. в файле profitbuy.min.js (сайт-дизайн-шаблоны)
строку
$('.base-menu.tree').responsiveMenu({more_label:'<i class="material-icons mi-lg pull-left"></i>'+$.at.t('More')});заменить на
/*$('.base-menu.tree').responsiveMenu({more_label:'<i class="material-icons mi-lg pull-left"></i>'+$.at.t('More')});*/Спасибо за ответ, но мы имели в виду не совсем то: нам надо было сделать сами пункты меню двухстрочными, например, имеем название "Клапаны электромагнитные", и надо, чтоб "Клапаны" были на одной строчке, а "электромагнитные" - на другой, при этом чтоб сама высота пункта меню осталась такой же, а ширина пункта уменьшилась бы до "электромагнитные"(чтоб пункт меню был как бы компактнее по ширине).
по инструкции выше, приведенные стили из пункта 1 замените на
@media only screen and (min-width: 993px){
.tree-wrapper .base-menu.tree > li > a {
text-align: center;
}
.tree-wrapper .base-menu.tree > li {
display: table-cell;
float: none;
}
.tree-wrapper .base-menu.tree {
display: table;
width: 100%;
}
}
А пользовательские стили в каком файле находятся? Я прост видела там целый вагон .css файлов, но именно напрямую подключенных к main.html не было.
Я добавила пока в profitbuy.css, но изменений нет.
http://wm-site.ru/profitbuy/290/blok-polzovatelski...
Спасибо, да, так лучше, что видно ВСЕ пункты главного меню, однако названия пунктов меню в 2 строки все равно не выводятся, ну и <br /> если пытаться писать, то ломается отображение шаблона.
Спасибо.
Меня тоже интересует данная идея. Сделал всё по вашей инструкции, исчезла кнопка "ещё" и не вмещавшиеся категории выползли вправа за пределы экрана. А названия базовых категорий по-прежнему отображаются в одну строку.
Проверьте еще раз все ли сделали верно, применяются ли все стили которые вы добавили. Как минимум укажите адрес вашего сайта.
http://mtscamera.ru
(временный адрес)
Мы переехали на постоянный адрес, сделали там всё по инструкции выше, меню просто развернулось (исчезла кнопка ещё и теперь меню не влезает в 12.5"-экран), но пункты меню по-прежнему отображаются в одну строчку.
Вот новый адрес: http://shop-watervalve.ru
по инструкции выше, приведенные стили из пункта 1 замените на
@media only screen and (min-width: 993px){
.tree-wrapper .base-menu.tree > li > a {
text-align: center;
white-space: normal;
line-height: 1.45;
}
.tree-wrapper .base-menu.tree > li {
display: table-cell;
float: none;
height: 70px;
vertical-align: middle;
}
.tree-wrapper .base-menu.tree {
display: table;
width: 100%;
}
}