Меню Сайта
#1
Отправлено 15 Июль 2017 - 01:54
Получается при нажатии на кнопку Войти в ЛК всплывала окно как в других кнопках меню и там была информация для клиента Войти , зарегистрироваться и т п.
#3
Отправлено 15 Июль 2017 - 07:06
Зайдите в раздел Сайт - Редактор шаблонов - HTML - найдите:
<!-- Меню в шапке --> <div class="menu toggle_menu_wrap"> <a class="toggle_menu icon-align-justify" href="#"><span class="title">Меню</span></a> <div class="toggle_menu_cont"> <h4 class="title">Меню</h4> <ul class="mainnav" itemscope itemtype="http://schema.org/SiteNavigationElement"> {% FOR menu %} {% FOR header %} {% FOR links %} <li><a href="{menu.header.links.URL}" class="{% IF menu.header.links.SELECTED %}active{%ENDIF%} {% IF menu.header.links.NAME = Каталог %}tc{% ENDIF %}" {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %} itemprop="url"><span>{menu.header.links.NAME}</span></a></li> {% ENDFOR %} {% ENDFOR %} {% ENDFOR %} </ul> </div> </div>
перед ним вставьте:
<!-- Вход в ЛК --> <div class="menu lk toggle_menu_wrap"> <a class="toggle_menu icon-align-justify" href="#"><span class="title">Войти в ЛК</span></a> <div class="toggle_menu_cont"> <h4 class="title">Войти в ЛК</h4> <ul class="mainnav"> {% IFNOT CLIENT_IS_LOGIN %} <li><a href="{USER_LOGIN_URL}" title="Вход в личный кабинет">Вход</a></li> <li><a href="{USER_REGISTER_URL}" title="Регистрация">Регистрация</a></li> {% IF TARIFF_FEATURE_GOODS_COMPARE && SETTINGS_COMPARE_DISABLE=0 %}<li><a href="{COMPARE_URL}" title="Сравнение">Сравнение</a></li>{% ENDIF %} {% ELSE %} <li><a href="{USER_SETTINGS_URL}" title="Личный кабинет">Мой кабинет</a></li> <li><a href="{USER_HISTORY_LIST_URL}" title="История заказов">История</a></li> <li><a href="{FAVORITES_URL}" title="Избранные товары">Избранное</a></li> {% IF TARIFF_FEATURE_GOODS_COMPARE && SETTINGS_COMPARE_DISABLE=0 %}<li><a href="{COMPARE_URL}" title="Сравнение">Сравнение</a></li>{% ENDIF %} <li><a href="{USER_LOGOUT_URL}" title="Выход">Выход</a></li> {% ENDIF %} </ul> </div> </div>
Далее зайдите в main.css - найдите:
#header .toggle_menu_wrap .toggle_menu_cont {display: none;position: absolute;width: 300px;right: -25px;top: -25px;padding: 30px 10px 20px 30px;text-align: left;z-index: -1;background: #fff;-webkit-box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.15);-moz-box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.15);box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.15);}
в данной строке уменьшите значение стиля width.
Уточните пожалуйста на счет пропорционального текста, сейчас текст подпунктов идет ровно под заголовком, куда его необходимо переместить?
#4
Отправлено 15 Июль 2017 - 12:12
Vaccina (15 Июль 2017 - 07:06) писал:
Зайдите в раздел Сайт - Редактор шаблонов - HTML - найдите:
<!-- Меню в шапке --> <div class="menu toggle_menu_wrap"> <a class="toggle_menu icon-align-justify" href="#"><span class="title">Меню</span></a> <div class="toggle_menu_cont"> <h4 class="title">Меню</h4> <ul class="mainnav" itemscope itemtype="http://schema.org/SiteNavigationElement"> {% FOR menu %} {% FOR header %} {% FOR links %} <li><a href="{menu.header.links.URL}" class="{% IF menu.header.links.SELECTED %}active{%ENDIF%} {% IF menu.header.links.NAME = Каталог %}tc{% ENDIF %}" {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %} itemprop="url"><span>{menu.header.links.NAME}</span></a></li> {% ENDFOR %} {% ENDFOR %} {% ENDFOR %} </ul> </div> </div>
перед ним вставьте:
<!-- Вход в ЛК --> <div class="menu lk toggle_menu_wrap"> <a class="toggle_menu icon-align-justify" href="#"><span class="title">Войти в ЛК</span></a> <div class="toggle_menu_cont"> <h4 class="title">Войти в ЛК</h4> <ul class="mainnav"> {% IFNOT CLIENT_IS_LOGIN %} <li><a href="{USER_LOGIN_URL}" title="Вход в личный кабинет">Вход</a></li> <li><a href="{USER_REGISTER_URL}" title="Регистрация">Регистрация</a></li> {% IF TARIFF_FEATURE_GOODS_COMPARE && SETTINGS_COMPARE_DISABLE=0 %}<li><a href="{COMPARE_URL}" title="Сравнение">Сравнение</a></li>{% ENDIF %} {% ELSE %} <li><a href="{USER_SETTINGS_URL}" title="Личный кабинет">Мой кабинет</a></li> <li><a href="{USER_HISTORY_LIST_URL}" title="История заказов">История</a></li> <li><a href="{FAVORITES_URL}" title="Избранные товары">Избранное</a></li> {% IF TARIFF_FEATURE_GOODS_COMPARE && SETTINGS_COMPARE_DISABLE=0 %}<li><a href="{COMPARE_URL}" title="Сравнение">Сравнение</a></li>{% ENDIF %} <li><a href="{USER_LOGOUT_URL}" title="Выход">Выход</a></li> {% ENDIF %} </ul> </div> </div>
Далее зайдите в main.css - найдите:
#header .toggle_menu_wrap .toggle_menu_cont {display: none;position: absolute;width: 300px;right: -25px;top: -25px;padding: 30px 10px 20px 30px;text-align: left;z-index: -1;background: #fff;-webkit-box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.15);-moz-box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.15);box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.15);}
в данной строке уменьшите значение стиля width.
Уточните пожалуйста на счет пропорционального текста, сейчас текст подпунктов идет ровно под заголовком, куда его необходимо переместить?
#5
Отправлено 16 Июль 2017 - 10:57
#6
Отправлено 16 Июль 2017 - 11:28
bscgroup (15 Июль 2017 - 12:12) писал:
@media all and (min-width: 1200px) { #header .cart .toggle_menu_cont {right: 60px;} #header .search .toggle_menu_cont {right: 85px;} #header .header-top .container { display: flex; align-items: center; justify-content: space-around;} #header .header-top .container > div:first-child {margin-left:auto;} #header .header-top .container > div:last-child {margin-right:auto;min-width:100px;} #header .contacts.toggle_menu_wrap { margin-right: 0;} #header .logo { margin:0 auto;} }
#7
Отправлено 16 Июль 2017 - 13:01
Mr.Nito (16 Июль 2017 - 11:28) писал:
@media all and (min-width: 1200px) { #header .cart .toggle_menu_cont {right: 60px;} #header .search .toggle_menu_cont {right: 85px;} #header .header-top .container { display: flex; align-items: center; justify-content: space-around;} #header .header-top .container > div:first-child {margin-left:auto;} #header .header-top .container > div:last-child {margin-right:auto;min-width:100px;} #header .contacts.toggle_menu_wrap { margin-right: 0;} #header .logo { margin:0 auto;} }
#9
Отправлено 19 Июль 2017 - 08:46
Не дублируйте пожалуйста вопросы, ответила вам в другой теме по данному вопросу.
http://forum.storela...та/#entry264987
#11
Отправлено 20 Июль 2017 - 07:28
Зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
#header .header-top .container > div.contacts.toggle_menu_wrap { margin-right: 45%; }
замените на:
#header .header-top .container > div.contacts.toggle_menu_wrap { margin-right: 35%; }
Далее найдите:
#header .header-top .container { padding-top: 60px; }
замените на:
#header .header-top .container { padding-top: 0; line-height: 60px; }
Далее найдите:
#header .header-top .container > div.logo { display: inline-block; position: absolute; top: 40px; left: 15px; right: 15px; margin: 0; }
замените на:
#header .header-top .container > div.logo { display: inline-block; position: absolute; top: -5px; left: 15px; right: 15px; margin: 0; }
Результат:
#12
Отправлено 20 Июль 2017 - 07:50
Vaccina (20 Июль 2017 - 07:28) писал:
Зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
#header .header-top .container > div.contacts.toggle_menu_wrap { margin-right: 45%; }
замените на:
#header .header-top .container > div.contacts.toggle_menu_wrap { margin-right: 35%; }
Далее найдите:
#header .header-top .container { padding-top: 60px; }
замените на:
#header .header-top .container { padding-top: 0; line-height: 60px; }
Далее найдите:
#header .header-top .container > div.logo { display: inline-block; position: absolute; top: 40px; left: 15px; right: 15px; margin: 0; }
замените на:
#header .header-top .container > div.logo { display: inline-block; position: absolute; top: -5px; left: 15px; right: 15px; margin: 0; }
Результат:
Скриншот сделанный 2017-07-20 в 11.28.18.png
#13
Отправлено 20 Июль 2017 - 12:07
#14
Отправлено 20 Июль 2017 - 13:55
#15
Отправлено 20 Июль 2017 - 18:37
bscgroup (20 Июль 2017 - 12:07) писал:
Код
@media all and (min-width: 375px) and (max-width: 481px) { #header { padding: 17px 0; } #header .header-top .container > div.logo { top: -10px; } }
#16
Отправлено 20 Июль 2017 - 19:15
Mr.Nito (20 Июль 2017 - 18:37) писал:
Код
@media all and (min-width: 375px) and (max-width: 481px) { #header { padding: 17px 0; } #header .header-top .container > div.logo { top: -10px; } }
#18
Отправлено 23 Июль 2017 - 19:57
@media all and (min-width:1200px) { .menu.lk.toggle_menu_wrap,.m.menu.toggle_menu_wrap, .contacts toggle_menu_wrap,.search.toggle_menu_wrap, .cart.toggle_menu_wrap{width:18%;} #header .header-top .container > div {margin-left: 1%;} }
#19
Отправлено 23 Июль 2017 - 20:42
metry (23 Июль 2017 - 19:57) писал:
@media all and (min-width:1200px) { .menu.lk.toggle_menu_wrap,.m.menu.toggle_menu_wrap, .contacts toggle_menu_wrap,.search.toggle_menu_wrap, .cart.toggle_menu_wrap{width:18%;} #header .header-top .container > div {margin-left: 1%;} }
#20
Отправлено 24 Июль 2017 - 12:05
Количество пользователей, читающих эту тему: 0
0 пользователей, 0 гостей, 0 анонимных