Лого, Меню И Другое
#1
Отправлено 31 Август 2018 - 20:58
Как лого разместить посередине, а то он у меня почему то вверх ускакал и вернуть на место корзину и сравнение в правый угол. А так же убрать надпись: Добро пожаловать на сайт
Возможно ли, что бы в верхнем меню вместо квадрата под заголовками, было просто подсвечивание при наведении.
Как менять цвета текстов в шапке, а именно корзина, сравнение. Ну пока это. Буду благодарен за советы
#2
Отправлено 01 Сентябрь 2018 - 08:10
Зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
#logo{display: inline-block;width: 300px;}
замените на:
#logo{display: inline-block;width: 150px;height:100px;} #logo a{display: inline-block;vertical-align: middle;line-height: 140px;}
далее найдите:
.menuWrap li.selected{background:white;} .menuWrap li:hover{background:#e7f3f7;} .menuWrap li:hover a{color:#14a395;} .menuWrap li.selected a{color:#14a395;background: #e7f3f7;}
замените на:
.menuWrap li:hover a{color:#14a395;} .menuWrap li.selected a{color:#fff; text-decoration: underline;}
Цвет кнопок корзины, сравнения и так далее вы можете изменить в следующей строке:
.header-button a{padding:15px;color:#95a8a9;font-size:15px;}
#3
Отправлено 01 Сентябрь 2018 - 22:15
#4
Отправлено 02 Сентябрь 2018 - 16:23
zaprom (01 Сентябрь 2018 - 22:15) писал:
Здравствуйте.
Чтобы убрать данную надпись, Вам необходимо в шаблоне html найти следующий блок кода:
<div class="middle-content"> <div class="welcome-message"><a href="{INDEX_PAGE_URL}">Добро пожаловать на сайт!</a></div> <div class="middle-buttons-container"> <ul class="bt">
И заменить его этим вот кодом:
<div class="middle-content"> <div class="middle-buttons-container"> <ul class="bt">
#6
Отправлено 05 Сентябрь 2018 - 05:28
Зайдите в раздел Сайт - Редактор шаблонов - HTML - найдите:
<div id="header-container2"> <div id="header-top"> <div class="mainwidth">
после него пропишите:
<!-- Первый контактный телефон --> {% IF SETTINGS_STORE_PHONE_NUMBER1 %} <div class="phone"> <a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE1} {% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}{SETTINGS_STORE_PHONE_CITY_CODE1}{% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER1}"> <span class="icon-phone"></span> <span class="phone-country-code">{SETTINGS_STORE_PHONE_COUNTRY_CODE1}</span> {% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}({SETTINGS_STORE_PHONE_CITY_CODE1}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER1} </a> </div> {% ENDIF %} <!--END Первый контактный телефон -->
Зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
.item .goods-cat-image-medium-square{width:100%;height:300px;}
замените на:
.item .goods-cat-image-medium-square{width:100%;height:150px;}
далее найдите:
#search{text-align:right;padding:5px 0;}
перед ним пропишите:
.phone {float: left;} .phone a{color:#fff;line-height: 35px;}
#7
Отправлено 05 Сентябрь 2018 - 10:28
#8
Отправлено 05 Сентябрь 2018 - 11:07
zaprom (05 Сентябрь 2018 - 10:28) писал:
Здравствуйте. Зайдите в шаблон main.css и найдите данный код:
.phone a {color: #fff;line-height: 35px;}
Измените на:
.phone a {color: #567eb5;line-height: 35px;}
Исправляем переход в каталог, найдите:
#logo a { display: inline-block; vertical-align: middle; line-height: 140px; }
И замените на:
#logo a { display: inline-block; vertical-align: middle; line-height: 110px; padding-top: 10px; }
#10
Отправлено 05 Сентябрь 2018 - 11:52
zaprom (05 Сентябрь 2018 - 11:31) писал:
Давайте сначала вернем обратно верхнюю полосу.
Зайдите в шаблон HTML и найдите данный код:
<div id="sitewrapper"> <div id="header-container">
Замените его на:
<div id="sitewrapper"> <div id="header-container"> <div id="header-container2"> <div id="header-top"> <div class="mainwidth">
#11
Отправлено 05 Сентябрь 2018 - 12:11
#12
Отправлено 05 Сентябрь 2018 - 15:37
zaprom (05 Сентябрь 2018 - 12:11) писал:
Зайдите в шаблон main.css и найдите код:
.phone { float: left; }
Замените на:
.phone { float: right; }
Найдите код:
.middle-content { width: 686px; display: inline-block; vertical-align: top; }
Замените его на:
.middle-content { width: 486px; display: inline-block; vertical-align: top; }
Зайдите в шаблон HTML и найдите код:
<div id="header-container2"> <div id="header-top"> <div class="mainwidth"> <!-- Первый контактный телефон --> {% IF SETTINGS_STORE_PHONE_NUMBER1 %} <div class="phone"> <a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE1} {% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}{SETTINGS_STORE_PHONE_CITY_CODE1}{% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER1}"> <span class="icon-phone"></span> <span class="phone-country-code">{SETTINGS_STORE_PHONE_COUNTRY_CODE1}</span> {% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}({SETTINGS_STORE_PHONE_CITY_CODE1}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER1} </a> </div> {% ENDIF %} <!--END Первый контактный телефон -->
Замените его на:
<div id="header-container2"> <div id="header-top"> <div class="mainwidth">
Найдите этот код:
<!-- /Форма поиска --> </div> </div> <div class="header-middle"> <div class="mainwidth hm"> <div id="logo"> <a href="{INDEX_PAGE_URL}"><img src="{ASSETS_IMAGES_PATH}logo.png?design=comfort" title="" alt=""></a> </div>
И сразу после него Вставьте код:
<!-- Первый контактный телефон --> {% IF SETTINGS_STORE_PHONE_NUMBER1 %} <div class="phone"> <a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE1} {% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}{SETTINGS_STORE_PHONE_CITY_CODE1}{% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER1}"> <span class="icon-phone"></span> <span class="phone-country-code">{SETTINGS_STORE_PHONE_COUNTRY_CODE1}</span> {% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}({SETTINGS_STORE_PHONE_CITY_CODE1}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER1} </a> <!-- Контакт Skype --> {% IF SETTINGS_STORE_EMAIL_MAIN %} <div><a href="mailto:{SETTINGS_STORE_EMAIL_MAIN}" title="Свяжитесь с нами по электронной почте"><span class="icon-mail"></span> {SETTINGS_STORE_EMAIL_MAIN}</a></div> {% ENDIF %} <!--END Контакт Skype --> </div> {% ENDIF %} <!--END Первый контактный телефон -->
#14
Отправлено 05 Сентябрь 2018 - 17:04
zaprom (05 Сентябрь 2018 - 16:25) писал:
width: 686px;
display: inline-block;
vertical-align: top;
}
в шаблоне main.css к сожалению
Так же немного нужно поправить шапку и перенести корзину со сравнением туда куда указал стрелкой.
Зайдите в шаблон main.css и на строчке 49 находится код, который нужно заменить:
.middle-content{width: 686px;display: inline-block;vertical-align: top;}
#15
Отправлено 05 Сентябрь 2018 - 22:03
И подскажите как уменьшить в шапке расстояние между телефоном и почтой, а так же поиграться их размером и цветом шрифта
#16
Отправлено 06 Сентябрь 2018 - 05:43
Зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
.phone a {color: #567eb5;line-height: 35px;}
измените цвет на необходимый.
Уточните пожалуйста, кнопки ЛК при этом оставить на месте при переносе?
#17
Отправлено 06 Сентябрь 2018 - 09:04
#18
Отправлено 06 Сентябрь 2018 - 09:54
zaprom (06 Сентябрь 2018 - 09:04) писал:
Здравствуйте. Зайдите в шаблон HTML и найдите данный код:
<div class="middle-content"> <div class="middle-buttons-container"> <ul class="bt"> {%IFNOT CLIENT_IS_LOGIN%} <li class="header-button w50 nomrg"><a href="{USER_LOGIN_URL}" title="Авторизация"><span class="icon-lock"></span></a></li> <li class="header-button w50"><a href="{USER_REGISTER_URL}" title="Регистрация"><span class="icon-user"></span></a></li> {%ELSE%} <li class="header-button w30 nomrg"><a href="{USER_LOGOUT_URL}" title="Выход из ЛК"><span class="icon-eye-blocked"></span></a></li> <li class="header-button w30"><a href="{USER_FAVORITES_URL}"><span class="icon-heart2"></span></a></li> <li class="header-button w30"><a href="{USER_SETTINGS_URL}" title="Настройки пользователя"><span class="icon-user"></span></a></li> {%ENDIF%} <li class="header-button w50"><a href="{COMPARE_URL}" title="Сравнение"><span class="icon-diamond"></span> Сравнение <span id="compareInfoBlock"><span class="compare-count" id="compareInfo"><span class="nb_goods">{COMPARE_GOODS_COUNT}</span></span></span></a></li> <li class="header-button w50"><a href="{CART_URL}" title="Корзина"><span class="icon-cart3"></span> Корзина <span class="cart-count"> <span id="cart-total">{% IF cart_count_empty %}<span class="red">0</span>{% ELSE %}{CART_COUNT_TOTAL}{% ENDIF %}</span></span> </a></li> </ul> </div> </div>
Удалите его.
Найдите код:
<div class="header-bottom"> <div class="mainwidth"> <div class="lrmenubutton">Меню</div>
И замените на:
<div class="header-bottom"> <div class="mainwidth"> <div class="middle-content"> <div class="middle-buttons-container"> <ul class="bt"> {%IFNOT CLIENT_IS_LOGIN%} <li class="header-button w50 nomrg"><a href="{USER_LOGIN_URL}" title="Авторизация"><span class="icon-lock"></span></a></li> <li class="header-button w50"><a href="{USER_REGISTER_URL}" title="Регистрация"><span class="icon-user"></span></a></li> {%ELSE%} <li class="header-button w30 nomrg"><a href="{USER_LOGOUT_URL}" title="Выход из ЛК"><span class="icon-eye-blocked"></span></a></li> <li class="header-button w30"><a href="{USER_FAVORITES_URL}"><span class="icon-heart2"></span></a></li> <li class="header-button w30"><a href="{USER_SETTINGS_URL}" title="Настройки пользователя"><span class="icon-user"></span></a></li> {%ENDIF%} <!--<li class="header-button w50"><a href="{COMPARE_URL}" title="Сравнение"><span class="icon-diamond"></span> Сравнение <span id="compareInfoBlock"><span class="compare-count" id="compareInfo"><span class="nb_goods">{COMPARE_GOODS_COUNT}</span></span></span></a></li>--> <li class="header-button w50"><a href="{CART_URL}" title="Корзина"><span class="icon-cart3"></span> Корзина <span class="cart-count"> <span id="cart-total">{% IF cart_count_empty %}<span class="red">0</span>{% ELSE %}{CART_COUNT_TOTAL}{% ENDIF %}</span></span> </a></li> </ul> </div> </div> <div class="lrmenubutton">Меню</div>
Найдите в шаблоне main.css код:
.middle-content { width: 486px; display: inline-block; vertical-align: top; }
Замените его на:
.middle-content { width: 356px; display: inline-block; vertical-align: top; float: right; }
#19
Отправлено 06 Сентябрь 2018 - 10:24
#20
Отправлено 06 Сентябрь 2018 - 10:38
zaprom (06 Сентябрь 2018 - 10:24) писал:
Найдите в шаблоне main.css код:
.header-button { padding: 15px 0; border-radius: 2px; color: white; cursor: pointer; background: rgba(255,255,255,0.1); position: relative; }
Замените его на:
.header-button { padding: 10px 0; border-radius: 3px; color: white; cursor: pointer; background: rgba(255,255,255,0.1); position: relative; margin-top: 6px; }
Количество пользователей, читающих эту тему: 0
0 пользователей, 0 гостей, 0 анонимных