Каталог Автоматически Разворачивается
#1
Отправлено 12 Март 2017 - 17:26
Подскажите, как сделать чтобы каталог в верхнем меню автоматически разворачивался.
Мой аккаунт SL-408620
Нужно сделать так:
1. На любой странице пользователь при подведении мышки на кнопку меню Каталог получал автоматический разворот каталога до первого уровня (скрин 1).
2. При подведении мышки пользователем на первый уровень каталога (например, перчатки), уже разворачивается второй уровень. Например, боксерские перчатки, и перчатки мма (скрин 2)
#2
Отправлено 17 Март 2017 - 15:07
kirussian (12 Март 2017 - 17:26) писал:
Подскажите, как сделать чтобы каталог в верхнем меню автоматически разворачивался.
Мой аккаунт SL-408620
Нужно сделать так:
1. На любой странице пользователь при подведении мышки на кнопку меню Каталог получал автоматический разворот каталога до первого уровня (скрин 1).
2. При подведении мышки пользователем на первый уровень каталога (например, перчатки), уже разворачивается второй уровень. Например, боксерские перчатки, и перчатки мма (скрин 2)
Вам необходимо в шаблоне HTML найти блок
<!-- Меню в шапке --> <ul class="menunav" itemscope itemtype="http://schema.org/SiteNavigationElement"> {% FOR menu %} {% FOR header %} {% FOR links %} <li><a href="{menu.header.links.URL}" {% IF menu.header.links.SELECTED %}class="active"{%ENDIF%} {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %} itemprop="url">{menu.header.links.NAME}</a></li> {% ENDFOR %} {% ENDFOR %} {% ENDFOR %} </ul>и заменить его на
<!-- Меню в шапке --> <ul class="menunav" itemscope itemtype="http://schema.org/SiteNavigationElement"> <li class="parent"><a href="/catalog" {% IF PAGE_NAME = Каталог %}class="active"{%ENDIF%} itemprop="url">Каталог</a> <ul class="dropdown-menu"> {% FOR catalog_full %} {% IF catalog_full.FIRST %}{% IFNOT catalog_full.LEVEL = 0 %}<ul class="sub {% IF catalog_full.LEVEL > 1 %}hide-cat{% ENDIF %} {% IF catalog_full.LEVEL = 1 %}dropdown-menu{% ENDIF %}">{% ENDIF %}{% ENDIF %} <li class="level{catalog_full.LEVEL} {% IF catalog_full.ISSET_SUB %}parent{% ENDIF %} {% IF catalog_full.CURRENT %}active{% ENDIF %}"> <a href="{catalog_full.URL}" class="title-lv{catalog_full.LEVEL} {% IF catalog_full.CURRENT %}active{% ENDIF %}" itemprop="url">{catalog_full.NAME}</a> {% IF catalog_full.ISSET_SUB=0 %}</li>{% ENDIF %} {% IF catalog_full.LAST %}{%FOR out%}</ul> {%IFNOT catalog_full.out.LAST%}</li>{%ENDIF%}{%ENDFOR%}{% ENDIF %} {% ENDFOR %} </li> {% FOR menu %} {% FOR header %} {% FOR links %} <li><a href="{menu.header.links.URL}" {% IF menu.header.links.SELECTED %}class="active"{%ENDIF%} {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %} itemprop="url">{menu.header.links.NAME}</a></li> {% ENDFOR %} {% ENDFOR %} {% ENDFOR %} </ul>Далее в файле main.css найдите строку
#custommenu ul.menunav li > a.active {border-bottom: 2px solid #09afe7;}и сразу после нее вставьте блок
#custommenu ul.menunav li{float:none;} #custommenu ul.menunav li ul.dropdown-menu li> a{border-bottom:1px solid #09afe7;} #custommenu ul.menunav li ul.dropdown-menu {position: absolute;width:100%;left: 0;background: #333744;z-index: 999;overflow-y: hidden;visibility: hidden;opacity: 0;filter: alpha(opacity=0);-khtml-opacity: 0;-webkit-box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.5);-moz-box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.5);box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.5);-webkit-transform: scale(0.5);-moz-transform: scale(0.5);-ms-transform: scale(0.5);-o-transform: scale(0.5);transform: scale(0.5);-webkit-transform-origin: center 10%;-moz-transform-origin: center 10%;transform-origin: center 10%;-webkit-transition: all 0.25s linear;-moz-transition: all 0.25s linear;-o-transition: all 0.25s linear;transition: all 0.25s linear;} #custommenu ul.menunav li.parent:hover ul.dropdown-menu {display: block;margin-left: 15px;overflow-y: hidden;visibility: visible;opacity: 1;filter: alpha(opacity=100);-khtml-opacity: 1;-webkit-transform: scale(1);-moz-transform: scale(1);-ms-transform: scale(1);-o-transform: scale(1);transform: scale(1);-webkit-transform-origin: top center;-moz-transform-origin: top center;transform-origin: top center;-webkit-transition: all 0.25s linear;-moz-transition: all 0.25s linear;-o-transition: all 0.25s linear;transition: all 0.25s linear;} #custommenu ul.menunav li.parent:hover ul.dropdown-menu li{vertical-align:top;} #custommenu ul.menunav li ul.dropdown-menu li ul.sub.dropdown-menu {display: none;} #custommenu ul.menunav li.parent:hover ul.dropdown-menu li:hover .sub{display: block;margin-left: 15px;overflow-y: hidden;visibility: visible;opacity: 1;filter: alpha(opacity=100);-khtml-opacity: 1;-webkit-transform: scale(1);-moz-transform: scale(1);-ms-transform: scale(1);-o-transform: scale(1);transform: scale(1);-webkit-transform-origin: top center;-moz-transform-origin: top center;transform-origin: top center;-webkit-transition: all 0.25s linear;-moz-transition: all 0.25s linear;-o-transition: all 0.25s linear;transition: all 0.25s linear;position: relative;padding: 0;box-shadow:none;} #custommenu ul.menunav li.parent:hover ul.dropdown-menu li .sub li{display:block;float:none;} #custommenu ul.menunav li.parent:hover ul.dropdown-menu li .sub li a{border:none;} #custommenu ul.menunav li.parent:hover ul.dropdown-menu li .sub.hide-cat{display:none;}
Так же Вам необходимо в разделе Сайт-> Меню удалить пункт меню Каталог.
#3
Отправлено 17 Март 2017 - 21:36
Stasya (17 Март 2017 - 15:07) писал:
Вам необходимо в шаблоне HTML найти блок
<!-- Меню в шапке --> <ul class="menunav" itemscope itemtype="http://schema.org/SiteNavigationElement"> {% FOR menu %} {% FOR header %} {% FOR links %} <li><a href="{menu.header.links.URL}" {% IF menu.header.links.SELECTED %}class="active"{%ENDIF%} {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %} itemprop="url">{menu.header.links.NAME}</a></li> {% ENDFOR %} {% ENDFOR %} {% ENDFOR %} </ul>и заменить его на
<!-- Меню в шапке --> <ul class="menunav" itemscope itemtype="http://schema.org/SiteNavigationElement"> <li class="parent"><a href="http://stasyashop.ru/catalog" {% IF PAGE_NAME = Каталог %}class="active"{%ENDIF%} itemprop="url">Каталог</a> <ul class="dropdown-menu"> {% FOR catalog_full %} {% IF catalog_full.FIRST %}{% IFNOT catalog_full.LEVEL = 0 %}<ul class="sub {% IF catalog_full.LEVEL > 1 %}hide-cat{% ENDIF %} {% IF catalog_full.LEVEL = 1 %}dropdown-menu{% ENDIF %}">{% ENDIF %}{% ENDIF %} <li class="level{catalog_full.LEVEL} {% IF catalog_full.ISSET_SUB %}parent{% ENDIF %} {% IF catalog_full.CURRENT %}active{% ENDIF %}"> <a href="{catalog_full.URL}" class="title-lv{catalog_full.LEVEL} {% IF catalog_full.CURRENT %}active{% ENDIF %}" itemprop="url">{catalog_full.NAME}</a> {% IF catalog_full.ISSET_SUB=0 %}</li>{% ENDIF %} {% IF catalog_full.LAST %}{%FOR out%}</ul> {%IFNOT catalog_full.out.LAST%}</li>{%ENDIF%}{%ENDFOR%}{% ENDIF %} {% ENDFOR %} </li> {% FOR menu %} {% FOR header %} {% FOR links %} <li><a href="{menu.header.links.URL}" {% IF menu.header.links.SELECTED %}class="active"{%ENDIF%} {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %} itemprop="url">{menu.header.links.NAME}</a></li> {% ENDFOR %} {% ENDFOR %} {% ENDFOR %} </ul>Далее в файле main.css найдите строку
#custommenu ul.menunav li > a.active {border-bottom: 2px solid #09afe7;}и сразу после нее вставьте блок
#custommenu ul.menunav li{float:none;} #custommenu ul.menunav li ul.dropdown-menu li> a{border-bottom:1px solid #09afe7;} #custommenu ul.menunav li ul.dropdown-menu {position: absolute;width:100%;left: 0;background: #333744;z-index: 999;overflow-y: hidden;visibility: hidden;opacity: 0;filter: alpha(opacity=0);-khtml-opacity: 0;-webkit-box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.5);-moz-box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.5);box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.5);-webkit-transform: scale(0.5);-moz-transform: scale(0.5);-ms-transform: scale(0.5);-o-transform: scale(0.5);transform: scale(0.5);-webkit-transform-origin: center 10%;-moz-transform-origin: center 10%;transform-origin: center 10%;-webkit-transition: all 0.25s linear;-moz-transition: all 0.25s linear;-o-transition: all 0.25s linear;transition: all 0.25s linear;} #custommenu ul.menunav li.parent:hover ul.dropdown-menu {display: block;margin-left: 15px;overflow-y: hidden;visibility: visible;opacity: 1;filter: alpha(opacity=100);-khtml-opacity: 1;-webkit-transform: scale(1);-moz-transform: scale(1);-ms-transform: scale(1);-o-transform: scale(1);transform: scale(1);-webkit-transform-origin: top center;-moz-transform-origin: top center;transform-origin: top center;-webkit-transition: all 0.25s linear;-moz-transition: all 0.25s linear;-o-transition: all 0.25s linear;transition: all 0.25s linear;} #custommenu ul.menunav li.parent:hover ul.dropdown-menu li{vertical-align:top;} #custommenu ul.menunav li ul.dropdown-menu li ul.sub.dropdown-menu {display: none;} #custommenu ul.menunav li.parent:hover ul.dropdown-menu li:hover .sub{display: block;margin-left: 15px;overflow-y: hidden;visibility: visible;opacity: 1;filter: alpha(opacity=100);-khtml-opacity: 1;-webkit-transform: scale(1);-moz-transform: scale(1);-ms-transform: scale(1);-o-transform: scale(1);transform: scale(1);-webkit-transform-origin: top center;-moz-transform-origin: top center;transform-origin: top center;-webkit-transition: all 0.25s linear;-moz-transition: all 0.25s linear;-o-transition: all 0.25s linear;transition: all 0.25s linear;position: relative;padding: 0;box-shadow:none;} #custommenu ul.menunav li.parent:hover ul.dropdown-menu li .sub li{display:block;float:none;} #custommenu ul.menunav li.parent:hover ul.dropdown-menu li .sub li a{border:none;} #custommenu ul.menunav li.parent:hover ul.dropdown-menu li .sub.hide-cat{display:none;}
Так же Вам необходимо в разделе Сайт-> Меню удалить пункт меню Каталог.
Все отлично. Осталось небольшую поправку сделать: каталог разворачивается, но туда попадают скрытые категории. Например, перчатки - детские (скрин)
#5
Отправлено 21 Март 2017 - 08:19
#7
Отправлено 24 Март 2017 - 10:11
kirussian (23 Март 2017 - 23:58) писал:
Описание проблемы: Нажимаем на меню "КАТАЛОГ" и нас перебрасывает на совершенно другой магазин
#8
Отправлено 24 Март 2017 - 10:13
#9
Отправлено 18 Сентябрь 2017 - 15:52
#10
Отправлено 18 Сентябрь 2017 - 16:06
#11
Отправлено 19 Сентябрь 2017 - 07:57
#12
Отправлено 19 Сентябрь 2017 - 15:58
Mari-ina (18 Сентябрь 2017 - 15:52) писал:
<ul class="menunav" itemscope itemtype="http://schema.org/SiteNavigationElement"> <li class="parent"><a href="/catalog" {% IF PAGE_NAME = Каталог %}class="active"{%ENDIF%} itemprop="url">Каталог</a> <ul class="dropdown-menu"> {% FOR catalog_full %} {% IF catalog_full.FIRST %}{% IFNOT catalog_full.LEVEL = 0 %}<ul class="sub {% IF catalog_full.LEVEL > 1 %}hide-cat{% ENDIF %} {% IF catalog_full.LEVEL = 1 %}dropdown-menu{% ENDIF %}">{% ENDIF %}{% ENDIF %} <li class="level{catalog_full.LEVEL} {% IF catalog_full.ISSET_SUB %}parent{% ENDIF %} {% IF catalog_full.CURRENT %}active{% ENDIF %}"> <a href="{catalog_full.URL}" class="title-lv{catalog_full.LEVEL} {% IF catalog_full.CURRENT %}active{% ENDIF %}" itemprop="url">{catalog_full.NAME}</a> {% IF catalog_full.ISSET_SUB=0 %}</li>{% ENDIF %} {% IF catalog_full.LAST %}{%FOR out%}</ul> {%IFNOT catalog_full.out.LAST%}</li>{%ENDIF%}{%ENDFOR%}{% ENDIF %} {% ENDFOR %}
замените на
<ul class="menunav" itemscope itemtype="http://schema.org/SiteNavigationElement"> <li class="parent"><a href="/catalog" {% IF PAGE_NAME = Каталог %}class="active"{%ENDIF%} itemprop="url">Каталог</a> <ul class="dropdown-menu"> {% FOR catalog_full %} {% IF catalog_full.FIRST %}{% IFNOT catalog_full.LEVEL = 0 %}<ul class="sub {% IF catalog_full.LEVEL > 1 %}hide-cat{% ENDIF %} {% IF catalog_full.LEVEL = 1 %}dropdown-menu{% ENDIF %}">{% ENDIF %}{% ENDIF %} <li {% IF catalog_full.HIDE %}style="display:none;"{% ENDIF %}class="level{catalog_full.LEVEL} {% IF catalog_full.ISSET_SUB %}parent{% ENDIF %} {% IF catalog_full.CURRENT %}active{% ENDIF %}"> <a href="{catalog_full.URL}" class="title-lv{catalog_full.LEVEL} {% IF catalog_full.CURRENT %}active{% ENDIF %}" itemprop="url">{catalog_full.NAME}</a> {% IF catalog_full.ISSET_SUB=0 %}</li>{% ENDIF %} {% IF catalog_full.LAST %}{%FOR out%}</ul> {%IFNOT catalog_full.out.LAST%}</li>{%ENDIF%}{%ENDFOR%}{% ENDIF %} {% ENDFOR %}
Mari-ina (18 Сентябрь 2017 - 16:06) писал:
Mari-ina (19 Сентябрь 2017 - 07:57) писал:
Добавьте в разделе Сайт-Меню пункт - Каталог, далее найдите в шаблоне HTML код
</li> {% FOR menu %} {% FOR header %} {% FOR links %} <li><a href="{menu.header.links.URL}" {% IF menu.header.links.SELECTED %}class="active"{%ENDIF%} {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %} itemprop="url">{menu.header.links.NAME}</a></li> {% ENDFOR %} {% ENDFOR %} {% ENDFOR %} </ul>
замените на
</li> {% FOR menu %} {% FOR header %} {% FOR links %} <li {%IF menu.header.links.NAME=Каталог%}class="ad_catalog"{%ENDIF%}><a href="{menu.header.links.URL}" {% IF menu.header.links.SELECTED %}class="active"{%ENDIF%} {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %} itemprop="url">{menu.header.links.NAME}</a></li> {% ENDFOR %} {% ENDFOR %} {% ENDFOR %} </ul>
далее найдите в файле main.css код
@media all and (max-width: 991px) {
замените на
.ad_catalog {display:none;} @media all and (max-width: 991px) { .ad_catalog {display:block;}
#13
Отправлено 20 Сентябрь 2017 - 08:13
Ирина345 (19 Сентябрь 2017 - 15:58) писал:
Добавьте в разделе Сайт-Меню пункт - Каталог, далее найдите в шаблоне HTML код
</li> {% FOR menu %} {% FOR header %} {% FOR links %} <li><a href="{menu.header.links.URL}" {% IF menu.header.links.SELECTED %}class="active"{%ENDIF%} {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %} itemprop="url">{menu.header.links.NAME}</a></li> {% ENDFOR %} {% ENDFOR %} {% ENDFOR %} </ul>
замените на
</li> {% FOR menu %} {% FOR header %} {% FOR links %} <li {%IF menu.header.links.NAME=Каталог%}class="ad_catalog"{%ENDIF%}><a href="{menu.header.links.URL}" {% IF menu.header.links.SELECTED %}class="active"{%ENDIF%} {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %} itemprop="url">{menu.header.links.NAME}</a></li> {% ENDFOR %} {% ENDFOR %} {% ENDFOR %} </ul>
#14
Отправлено 20 Сентябрь 2017 - 17:06
Mari-ina (20 Сентябрь 2017 - 08:13) писал:
Вернул Вам стандартный каталог для моб. версии, проверьте, пожалуйста.
#15
Отправлено 21 Сентябрь 2017 - 08:32
Danil (20 Сентябрь 2017 - 17:06) писал:
Вернул Вам стандартный каталог для моб. версии, проверьте, пожалуйста.
Спасибо. Подскажите еще, как сделать в горизонтальном меню в первой категории два столбика подкатегорий, так как список довольно большой и на маленьком экране неудобно выбирать нижние подкатегории.
И второй момент, на расширении 1024 каталог в верхнем меню не правильно срабатывает, выбрать подкатегорию невозможно, просто сразу перебрасывает в общий каталог
#16
Отправлено 21 Сентябрь 2017 - 11:01
Mari-ina (21 Сентябрь 2017 - 08:32) писал:
И второй момент, на расширении 1024 каталог в верхнем меню не правильно срабатывает, выбрать подкатегорию невозможно, просто сразу перебрасывает в общий каталог
если такой вариант подходит, то найдите в файле main.css код
#custommenu ul.menunav li.parent:hover ul.dropdown-menu li:hover .sub{display: block;margin-left: 15px;overflow-y: hidden;visibility: visible;opacity: 1;filter: alpha(opacity=100);-khtml-opacity: 1;-webkit-transform: scale(1);-moz-transform: scale(1);-ms-transform: scale(1);-o-transform: scale(1);transform: scale(1);-webkit-transform-origin: top center;-moz-transform-origin: top center;transform-origin: top center;-webkit-transition: all 0.25s linear;-moz-transition: all 0.25s linear;-o-transition: all 0.25s linear;transition: all 0.25s linear;position: relative;padding: 0;box-shadow:none;}замените на
#custommenu ul.menunav li.parent:hover ul.dropdown-menu li:hover .sub { /* display: block; */ display: flex; justify-content: center; flex-direction: column; flex-wrap: wrap; margin-left: 15px; overflow: inherit; visibility: visible; height: 200px; opacity: 1; filter: alpha(opacity=100); -khtml-opacity: 1; -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); -webkit-transform-origin: top center; -moz-transform-origin: top center; transform-origin: top center; -webkit-transition: all 0.25s linear; -moz-transition: all 0.25s linear; -o-transition: all 0.25s linear; transition: all 0.25s linear; position: relative; padding: 0; box-shadow: none; }При расширение 1024 проблем не наблюдаю.
#17
Отправлено 26 Сентябрь 2017 - 09:46
#18
Отправлено 26 Сентябрь 2017 - 10:28
Mari-ina (26 Сентябрь 2017 - 09:46) писал:
Здравствуйте.
Изменения Вам произвел.
В шаблоне main.css код:
/* Меню, Каталог */ .block-menu-content {float: left;width: 100%;font-size:110%;} .block-menu-content ul li {line-height: 26px;} .block-menu-content ul li i {width: 16px;margin-right: 10px;} .block-menu-content ul li.parent.subhead:before {padding-right: 20px;} .block-menu-content ul li.subhead {text-align: left;border-bottom: 1px solid #505050;font-weight: normal;text-transform: capitalize;padding: 4px 0;} .block-menu-content ul li.parent.subhead {padding-left:0;} .block-menu-content ul.sub {padding-left:15px;display: none;} .block-menu-content ul li.active > ul.sub {display: block;} .block-menu-content ul li a.active {color: #F39641;} .block-menu-content ul li .open-sub {float: right;right: 15px;padding: 0 10px;margin-right: -5px;} .block-menu-content ul li .open-sub:before {content: "\f067";font-family: 'FontAwesome';font-size: 14px;float:right;} .block-menu-content ul li.active .open-sub.active:before {content: "\f068";color: #707070;}
Заменил на:
/* Меню, Каталог */ .block-menu-content ul li {position: relative;padding: 0;} .block-menu-content li a {display: block;line-height: 40px;margin: 0;padding: 0 0 0 0;font-weight: 400;letter-spacing: 0.3px;text-align: left;} .block-menu-content li.level1 a {color:#fff;padding:0 5px;} .block-menu-content li.level1 a:hover{color:#212C50;background-color:#d1f1fd;} .block-menu-content li.level1 a:hover{color:#212C50;} .block-menu-content ul li.parent.subhead:before {padding-right: 20px;} .block-menu-content ul li.parent.subhead {padding-left:0;} .menu .block-menu-content{margin-bottom:10px;} .level1 a{font-size:14px;font-family:'Raleway Regular';} .block-menu-content .anch0{font-size:20px;font-family:'Raleway Regular';position:relative;} .block-menu-content .anch0:after{content:' ';height:3px;width:100%;display:block;background: #3CA2B0;} .block-menu-content ul li a.active, .block-menu-content ul li a:hover {} .block-menu-content ul li .open-sub {float: right;right: 0px;position: absolute;padding: 0 0px 0 0;} .block-menu-content ul li .open-sub:before {content: "\f105";font-family: 'FontAwesome';} .parent.level0{position:relative;} .parent.level0 ul.sub3{display:none;position:absolute;left:100%;top:-5px;padding:5px 7px 7px 5px;background:#3CA2B0;min-width:250px;z-index:10000;} .parent.level0 ul.sub2{display:none;position:absolute;left:100%;top:-5px;padding:5px 7px 7px 5px;background:#3CA2B0;min-width:250px;z-index:10000;} .parent.level0 ul.sub1{display:none;position:absolute;left:100%;top:0;padding:5px 7px 7px 5px;background:#3CA2B0;width:250px;z-index:10000;border-left:3px solid white;} .parent.level0 ul.sub1 a{max-width:233px;display:block;overflow:hidden;} .parent.level0 ul.sub1 a,.parent.level1 ul.sub2 a,.parent.level2 ul.sub3 a{font-size:14px;line-height:40px;} .parent.level0:hover ul.sub1,.parent.level1:hover ul.sub2,.parent.level2:hover ul.sub3,.parent.level3:hover ul.sub4{display:block;} .block-menu-content ul.sub0{display:block;} .block-menu-content ul.sub1{display:none;} .block-menu-content ul.sub2{display:none;}
Код в шаблоне HTML:
<div class="block-menu-content"> <ul> {% FOR catalog_full %} {% IF catalog_full.FIRST %}{% IFNOT catalog_full.LEVEL = 0 %}<ul class="sub">{% ENDIF %}{% ENDIF %} <li {% IF catalog_full.HIDE %}style="display:none;"{% ENDIF %} class="{% IF catalog_full.ISSET_SUB %}parent{% ENDIF %} {% IF catalog_full.LEVEL = 0 %}subhead{% ENDIF %} {% IF catalog_full.CURRENT || catalog_full.CURRENT_PARENT %}active{% ENDIF %}"> <a href="{catalog_full.URL}" {% IF catalog_full.CURRENT %}class="active"{% ENDIF %}>{% IF catalog_full.ISSET_SUB %}<span class="open-sub {% IF catalog_full.CURRENT_PARENT || catalog_full.CURRENT %}active{% ENDIF %}"></span>{% ENDIF %}{catalog_full.NAME}</a> {% IF catalog_full.ISSET_SUB=0 %}</li>{% ENDIF %} {% IF catalog_full.LAST %}{%FOR out%}</ul>{%IFNOT catalog_full.out.LAST%}</li>{%ENDIF%}{%ENDFOR%}{% ENDIF %} {% ENDFOR %} </ul> </div>
Заменил на:
<div class="block-menu-content"> <ul> {% FOR catalog_full %} {% IF catalog_full.FIRST %}{% IFNOT catalog_full.LEVEL = 0 %}<ul class="sub sub{catalog_full.LEVEL}">{% ENDIF %}{% ENDIF %} <li {% IF catalog_full.HIDE %}style="display:none;"{% ENDIF %} class="{% IF catalog_full.ISSET_SUB %}parent{% ENDIF %} {% IF catalog_full.LEVEL = 0 %}subhead{% ENDIF %} level{catalog_full.LEVEL} {% IF catalog_full.CURRENT || catalog_full.CURRENT_PARENT %}active{% ENDIF %}"> <a {% IFNOT catalog_full.CURRENT %}href="{catalog_full.URL}"{% ENDIF %} class="{% IF catalog_full.CURRENT %}active{% ENDIF %} anch{catalog_full.LEVEL}">{% IF catalog_full.ISSET_SUB %}<span class="open-sub {% IF catalog_full.CURRENT_PARENT || catalog_full.CURRENT %}active{% ENDIF %}"></span>{% ENDIF %}{catalog_full.NAME}</a> {% IF catalog_full.ISSET_SUB=0 %}</li>{% ENDIF %} {% IF catalog_full.LAST %}{%FOR out%}</ul>{%IFNOT catalog_full.out.LAST%}</li>{%ENDIF%}{%ENDFOR%}{% ENDIF %} {% ENDFOR %} </ul> </div>
Проверьте результат.
#19
Отправлено 27 Сентябрь 2017 - 10:51
Firefly (26 Сентябрь 2017 - 10:28) писал:
Изменения Вам произвел.
В шаблоне main.css код:
/* Меню, Каталог */ .block-menu-content {float: left;width: 100%;font-size:110%;} .block-menu-content ul li {line-height: 26px;} .block-menu-content ul li i {width: 16px;margin-right: 10px;} .block-menu-content ul li.parent.subhead:before {padding-right: 20px;} .block-menu-content ul li.subhead {text-align: left;border-bottom: 1px solid #505050;font-weight: normal;text-transform: capitalize;padding: 4px 0;} .block-menu-content ul li.parent.subhead {padding-left:0;} .block-menu-content ul.sub {padding-left:15px;display: none;} .block-menu-content ul li.active > ul.sub {display: block;} .block-menu-content ul li a.active {color: #F39641;} .block-menu-content ul li .open-sub {float: right;right: 15px;padding: 0 10px;margin-right: -5px;} .block-menu-content ul li .open-sub:before {content: "\f067";font-family: 'FontAwesome';font-size: 14px;float:right;} .block-menu-content ul li.active .open-sub.active:before {content: "\f068";color: #707070;}
Заменил на:
/* Меню, Каталог */ .block-menu-content ul li {position: relative;padding: 0;} .block-menu-content li a {display: block;line-height: 40px;margin: 0;padding: 0 0 0 0;font-weight: 400;letter-spacing: 0.3px;text-align: left;} .block-menu-content li.level1 a {color:#fff;padding:0 5px;} .block-menu-content li.level1 a:hover{color:#212C50;background-color:#d1f1fd;} .block-menu-content li.level1 a:hover{color:#212C50;} .block-menu-content ul li.parent.subhead:before {padding-right: 20px;} .block-menu-content ul li.parent.subhead {padding-left:0;} .menu .block-menu-content{margin-bottom:10px;} .level1 a{font-size:14px;font-family:'Raleway Regular';} .block-menu-content .anch0{font-size:20px;font-family:'Raleway Regular';position:relative;} .block-menu-content .anch0:after{content:' ';height:3px;width:100%;display:block;background: #3CA2B0;} .block-menu-content ul li a.active, .block-menu-content ul li a:hover {} .block-menu-content ul li .open-sub {float: right;right: 0px;position: absolute;padding: 0 0px 0 0;} .block-menu-content ul li .open-sub:before {content: "\f105";font-family: 'FontAwesome';} .parent.level0{position:relative;} .parent.level0 ul.sub3{display:none;position:absolute;left:100%;top:-5px;padding:5px 7px 7px 5px;background:#3CA2B0;min-width:250px;z-index:10000;} .parent.level0 ul.sub2{display:none;position:absolute;left:100%;top:-5px;padding:5px 7px 7px 5px;background:#3CA2B0;min-width:250px;z-index:10000;} .parent.level0 ul.sub1{display:none;position:absolute;left:100%;top:0;padding:5px 7px 7px 5px;background:#3CA2B0;width:250px;z-index:10000;border-left:3px solid white;} .parent.level0 ul.sub1 a{max-width:233px;display:block;overflow:hidden;} .parent.level0 ul.sub1 a,.parent.level1 ul.sub2 a,.parent.level2 ul.sub3 a{font-size:14px;line-height:40px;} .parent.level0:hover ul.sub1,.parent.level1:hover ul.sub2,.parent.level2:hover ul.sub3,.parent.level3:hover ul.sub4{display:block;} .block-menu-content ul.sub0{display:block;} .block-menu-content ul.sub1{display:none;} .block-menu-content ul.sub2{display:none;}
Код в шаблоне HTML:
<div class="block-menu-content"> <ul> {% FOR catalog_full %} {% IF catalog_full.FIRST %}{% IFNOT catalog_full.LEVEL = 0 %}<ul class="sub">{% ENDIF %}{% ENDIF %} <li {% IF catalog_full.HIDE %}style="display:none;"{% ENDIF %} class="{% IF catalog_full.ISSET_SUB %}parent{% ENDIF %} {% IF catalog_full.LEVEL = 0 %}subhead{% ENDIF %} {% IF catalog_full.CURRENT || catalog_full.CURRENT_PARENT %}active{% ENDIF %}"> <a href="{catalog_full.URL}" {% IF catalog_full.CURRENT %}class="active"{% ENDIF %}>{% IF catalog_full.ISSET_SUB %}<span class="open-sub {% IF catalog_full.CURRENT_PARENT || catalog_full.CURRENT %}active{% ENDIF %}"></span>{% ENDIF %}{catalog_full.NAME}</a> {% IF catalog_full.ISSET_SUB=0 %}</li>{% ENDIF %} {% IF catalog_full.LAST %}{%FOR out%}</ul>{%IFNOT catalog_full.out.LAST%}</li>{%ENDIF%}{%ENDFOR%}{% ENDIF %} {% ENDFOR %} </ul> </div>
Заменил на:
<div class="block-menu-content"> <ul> {% FOR catalog_full %} {% IF catalog_full.FIRST %}{% IFNOT catalog_full.LEVEL = 0 %}<ul class="sub sub{catalog_full.LEVEL}">{% ENDIF %}{% ENDIF %} <li {% IF catalog_full.HIDE %}style="display:none;"{% ENDIF %} class="{% IF catalog_full.ISSET_SUB %}parent{% ENDIF %} {% IF catalog_full.LEVEL = 0 %}subhead{% ENDIF %} level{catalog_full.LEVEL} {% IF catalog_full.CURRENT || catalog_full.CURRENT_PARENT %}active{% ENDIF %}"> <a {% IFNOT catalog_full.CURRENT %}href="{catalog_full.URL}"{% ENDIF %} class="{% IF catalog_full.CURRENT %}active{% ENDIF %} anch{catalog_full.LEVEL}">{% IF catalog_full.ISSET_SUB %}<span class="open-sub {% IF catalog_full.CURRENT_PARENT || catalog_full.CURRENT %}active{% ENDIF %}"></span>{% ENDIF %}{catalog_full.NAME}</a> {% IF catalog_full.ISSET_SUB=0 %}</li>{% ENDIF %} {% IF catalog_full.LAST %}{%FOR out%}</ul>{%IFNOT catalog_full.out.LAST%}</li>{%ENDIF%}{%ENDFOR%}{% ENDIF %} {% ENDFOR %} </ul> </div>
Проверьте результат.
Спасибо, а на ак 299810 можно сделать также
#20
Отправлено 29 Сентябрь 2017 - 09:04
Темы с аналогичным тегами каталог, развернуть, автоматически
Количество пользователей, читающих эту тему: 0
0 пользователей, 0 гостей, 0 анонимных