Лого, Меню И Другое

Здравствуйте! Аккаунт SL-457640  Подскажите, можно ли в шаблоне комфорт укоротить слайдер и вставить боковое левое меню, то есть каталог.  Соответственно при этом уменьшить  баннера под слайдером.
Как лого разместить посередине, а то он у меня почему то вверх ускакал и вернуть на место корзину и сравнение в правый угол. А так же убрать надпись: Добро пожаловать на сайт

Возможно ли, что бы в верхнем меню вместо квадрата под заголовками, было просто подсвечивание при наведении.
Как менять цвета текстов в шапке, а именно корзина, сравнение. Ну пока это. Буду благодарен за советы

Здравствуйте.

Зайдите в раздел Сайт - Редактор шаблонов - 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;}

Спасибо! А по поводу каталога справа не ответили, возможно ли такое реализовать? Так же, как убрать надпись: "Добро пожаловать на сайт"

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">

Попробую спросить здесь. Как вставить телефоны в шапку?
Так же, нужно как на скриншоте уменьшить размр между фото и информацией в карточке(указано стрелкой где) и сделать чуть заметную серую рамку так же на карточке.

Здравствуйте.

Зайдите в раздел Сайт - Редактор шаблонов - 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;}

Почему то ничего не получилось. Наоборот, изчезла полоса сверху, а телефоны не появились, рамки так и не стало вокруг карточки товара.  И почкму то при входе в каталог, перебрасывает на главную, хотя вроде все прописано нормально.

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;
}

Спасибо, с каталогом получилось, а вот с номером не совсем. Мне нужно номер, а так же почта под ним что бы были в правом углу. И как вернуть верхнюю полосу, где поиск по сайту?

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">

Спасибо, вернулась, Что дальше?

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>&nbsp;{SETTINGS_STORE_EMAIL_MAIN}</a></div>
			{% ENDIF %}
<!--END Контакт Skype -->
		 </div>
	 {% ENDIF %}
<!--END Первый контактный телефон -->  

Я не могу найти код   .middle-content {
width: 686px;
display: inline-block;
vertical-align: top;
}
в шаблоне main.css к сожалению

Так же немного нужно поправить шапку и перенести корзину со сравнением туда куда указал стрелкой.

zaprom (05 Сентябрь 2018 - 16:25) писал:

Зайдите в шаблон main.css и на строчке 49 находится код, который нужно заменить:

  .middle-content{width: 686px;display: inline-block;vertical-align: top;}

А что по поводу переноса корзины?
И подскажите как уменьшить в шапке расстояние между телефоном и почтой, а так же поиграться их  размером и цветом шрифта

Здравствуйте.

Зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:

.phone a {color: #567eb5;line-height: 35px;}

измените цвет на необходимый.

Уточните пожалуйста, кнопки ЛК при этом оставить на месте при переносе?

Нет, кнопки ЛК и сравнение вообще  убрать

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> Сравнение &nbsp;&nbsp;<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> Корзина &nbsp; <span class="cart-count">
					 
					  <span id="cart-total">{% IF cart_count_empty %}<span class="red">0</span>{% ELSE %}{CART_COUNT_TOTAL}{% ENDIF %}</span></span>&nbsp;</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> Сравнение &nbsp;&nbsp;<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> Корзина &nbsp; <span class="cart-count">
					 
					  <span id="cart-total">{% IF cart_count_empty %}<span class="red">0</span>{% ELSE %}{CART_COUNT_TOTAL}{% ENDIF %}</span></span>&nbsp;</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;
}

Ок! А как теперь можно уменьшить немного прозрачный квадратик вокруг корзины и значков?

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;
}