Перейти к содержимому


Верхние Меню: Изменить Высоту И Закрепить На Экране

шапка

  • Авторизуйтесь для ответа в теме
Сообщений в теме: 14

#1 Ash74

Ash74

    Пользователь

  • Пользователи
  • PipPip
  • 42 сообщений
  • ГородЧелябинск

Отправлено 26 Февраль 2017 - 22:58

Доброго времени суток!

SL-259633

Нужна помощь по верхушке сайта:
№1 - выровнять обе эти менюшки по высоте. Сейчас нижняя, та что потемнее, немного выше верхней.
№2 - закрепить элемент на экране. При прокрутке страницы вниз/верх он должен быть всегда виден.

Жду ответа! Заранее спасибо.

Самое верхнее меню сайта.png

#2 RayLi

RayLi

    Активный участник

  • Модераторы
  • 2 864 сообщений

Отправлено 27 Февраль 2017 - 09:42

Просмотр сообщенияAsh74 (26 Февраль 2017 - 22:58) писал:

Доброго времени суток!

SL-259633

Нужна помощь по верхушке сайта:
№1 - выровнять обе эти менюшки по высоте. Сейчас нижняя, та что потемнее, немного выше верхней.
№2 - закрепить элемент на экране. При прокрутке страницы вниз/верх он должен быть всегда виден.

Жду ответа! Заранее спасибо.

Прикрепленный файл Самое верхнее меню сайта.png

Здравствуйте.
В данном случае попробуйте, пожалуйста, произвести следующие изменения:
№1 - В шаблоне main.css найдите, пожалуйста, данный код:

#custommenu li {
	list-style: none;
	display: inline-block;
	padding: 0;
	margin: 0;
	text-align: center;
	position: relative;
	padding-top: 12px;
}

И замените его вот этим вот кодом:

#custommenu li {
	list-style: none;
	display: inline-block;
	padding: 0;
	margin: 0;
	text-align: center;
	position: relative;
	padding-top: 0px;
}


#3 Ash74

Ash74

    Пользователь

  • Пользователи
  • PipPip
  • 42 сообщений
  • ГородЧелябинск

Отправлено 27 Февраль 2017 - 13:31

Спасибо! Первый вопрос отпал. Жду ответа на второй.

#4 Ирина345

Ирина345

    Активный участник

  • Модераторы
  • 5 709 сообщений

Отправлено 27 Февраль 2017 - 17:28

Просмотр сообщенияAsh74 (27 Февраль 2017 - 13:31) писал:

Спасибо! Первый вопрос отпал. Жду ответа на второй.
Здравствуйте, найдите в файле main.css
.header-top {position: relative;background: #494949;color: #929596;height: 40px;}

замените на
.header-top {	position: fixed;
	background: #494949;
	color: #929596;
	height: 40px;
	margin-bottom: 40px;
	z-index: 99;
	margin: 0 auto;
	width: 100%;
	margin-top: -40px;}

далее найдите
.header-middle {position: relative;}

замените на
.header-middle {
	position: relative;
	margin-top: 40px;
}


#5 Ash74

Ash74

    Пользователь

  • Пользователи
  • PipPip
  • 42 сообщений
  • ГородЧелябинск

Отправлено 27 Февраль 2017 - 19:49

Все получилось. Спасибо!

Чтобы не засорять форум, спрошу еще по шапке сайта =) Во вложении 2 скрина: как выглядит сейчас и как нужно чтобы выглядело в итоге.

№1 - перенести логотип в левую часть страницы
№2 - номер телефона и иконку личного кабинета перенести в правую часть страницы
№3 - иконку корзины переместить на верхнюю полоску

В ожидании! Заранее спасибо

Прикрепленные изображения

  • Шапка - как надо.png
  • Шапка - как сейчас.png


#6 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 01 Март 2017 - 05:00

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

Зайдите в раздел Сайт - Редактор шаблонов - HTML - найдите:
<!-- Личный кабинет, Телефон, Поиск -->
	  <div class="header-top">
		<div class="container">
		  <div class="block-account">
			<div class="user-title">
			  <i class="fa fa-bars" title="Меню пользователя"></i><span class="label">Меню</span>
			</div>
			<ul class="dropdown-list">
			  {% 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 %}>{menu.header.links.NAME}</a></li>
				  {% ENDFOR %}
				{% ENDFOR %}
			  {% ENDFOR %}
			</ul>
		  </div>
		  <!-- Поиск -->
		  <div class="form-search">
			<form id="search_mini_form" action="http://{NET_DOMAIN}/search" method="get" title="Поиск по магазину" onsubmit="if($(this).find('.form-search').val()) return false;">
			  <input type="text" name="q" value="{SEARCH_QUERY}" class="input-text search-string" placeholder="Поиск по магазину...">
			  <input type="hidden" name="goods_search_field_id" value="0">
			  <button type="submit" title="Искать" class="button search-submit fa fa-search"></button>
			</form>
		  </div>
		</div>
	  </div>
	  <!-- Меню Каталог в шапке -->
	  <div class="header-middle">
		<div class="container">
		  <!-- Каталог -->
		  <div id="custommenu" class="col-xs-12">
						<!-- Для отображения каталога товаров в шапке, замените на следующей строке {% IF MENU_CATALOG %} на {% IFNOT catalog_full_empty %} -->
						{% IFNOT catalog_full_empty %}
						<ul class="mainnav">
						{% 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>
			{% ELSE %}
			<!-- Меню в шапке -->
			<ul class="menunav">
			  {% 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 %}>{menu.header.links.NAME}</a></li>
				  {% ENDFOR %}
				{% ENDFOR %}
			  {% ENDFOR %}
			</ul>
			{% ENDIF %}
		  </div>
		  <!-- Адаптивный каталог -->
		  <div id="mommenu" class="menu-offcanvas">
			<span class="btn-navbar"> <i class="fa fa-bars"></i> <span class="overlay"></span></span>
			<div id="menu_offcanvas" class="offcanvas">
			  <span class="label">Каталог товаров</span>
			  <ul class="mainnav">
			  {% IFNOT catalog_full_empty %}
				{% FOR catalog_full %}
				  {% IF catalog_full.FIRST %}{% IFNOT catalog_full.LEVEL = 0 %}<ul class="sub">{% ENDIF %}{% ENDIF %}
					<li class="level{catalog_full.LEVEL} {% 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}" class="title-lv{catalog_full.LEVEL} {% IF catalog_full.CURRENT %}active{% ENDIF %}">{% IF catalog_full.ISSET_SUB %}<span class="open-menu {% 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 %}
			  {% ENDIF %}
			  </ul>
			</div>
		  </div>
		  <!-- Телефон -->
		  {% IF SETTINGS_STORE_PHONE_NUMBER1 %}
		  <div class="block-phone">
			<i class="fa fa-phone"></i>
			<label>Телефон: </label>
			<a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE1}{SETTINGS_STORE_PHONE_CITY_CODE1}{SETTINGS_STORE_PHONE_NUMBER1}">{SETTINGS_STORE_PHONE_COUNTRY_CODE1}({SETTINGS_STORE_PHONE_CITY_CODE1}){SETTINGS_STORE_PHONE_NUMBER1}</a>
		  </div>
		  {% ENDIF %}
		</div>
	  </div>
	  <!-- Меню, Логотип, Корзина -->
	  <div class="header-bottom">
		<div class="container">
		  <div class="row">
			<!-- Личный кабинет -->
			<div class="col-lg-3 col-sm-4 col-sms-6 col-smb-6" >
			  <div class="block-user">
				<div class="user-title">
				  <i class="fa fa-user" title="Меню пользователя"></i><span class="label">ЛК</span>
				</div>
				<ul class="dropdown-list">
				  {% 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}">Сравнение</a></li>{% ENDIF %}
				  {% ELSE %}
				  <li><a href="{USER_SETTINGS_URL}">Мой кабинет</a></li>
				  <li><a href="{FAVORITES_URL}">Избранное</a></li>
				  <li><a href="{USER_HISTORY_LIST_URL}">История заказов</a></li>
				  {% IF TARIFF_FEATURE_GOODS_COMPARE && SETTINGS_COMPARE_DISABLE=0 %}<li><a href="{COMPARE_URL}">Сравнение</a></li>{% ENDIF %}
				  <li><a href="{USER_LOGOUT_URL}">Выход</a></li>
				  {% ENDIF %}
				</ul>
			  </div>
			  <!-- Телефон -->
			  {% IF SETTINGS_STORE_PHONE_NUMBER1 %}
			  <div class="block-phone">
				<i class="fa fa-phone"></i>
				<a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE1}{SETTINGS_STORE_PHONE_CITY_CODE1}{SETTINGS_STORE_PHONE_NUMBER1}">{SETTINGS_STORE_PHONE_COUNTRY_CODE1}({SETTINGS_STORE_PHONE_CITY_CODE1}){SETTINGS_STORE_PHONE_NUMBER1}</a>
			  </div>
			  {% ENDIF %}
			</div>
			<!-- Корзина -->
			<div class="col-lg-3 col-sm-4 col-sms-6 col-smb-6 col-right">
			  <div class="block-cart {% IFNOT CART_COUNT_TOTAL = 0 %}have-items{% ENDIF %} {% IF MOD_LNAME = cart %}cart-page{% ENDIF %}">
				<div class="cart-title">
				  <a href="{CART_URL}" class="label">Корзина<i class="fa fa-shopping-cart" title="Перейти в корзину">&nbsp;</i></a>
				  <span class="cart-count" data-count="{CART_COUNT_TOTAL}">{CART_COUNT_TOTAL}</span>
				</div>
				<div class="dropdown-cart">
				  <div class="cart-content">
					{% IF cart_count_empty %}
					<div class="cart-empty">Ваша корзина пуста</div>
					{% ELSE %}
					<ul class="cart-products-list">
					  {% FOR cart_items %}
					  <li class="item">
						<a data-href="{cart_items.ORDER_LINE_DELETE_URL}" data-count="{cart_items.ORDER_LINE_QUANTITY}" title="Удалить позицию" class="product-remove"></a>
						<a href="{cart_items.GOODS_URL}" title="{cart_items.GOODS_NAME}" class="product-image"><img src="{% IF cart_items.GOODS_IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-icon.png?design=urban{% ELSE %}{cart_items.GOODS_IMAGE_ICON}{% ENDIF %}" alt="{cart_items.GOODS_NAME}" class="goods-image-icon"></a>
						<div class="product-details">
						  <div class="product-rating">
							<div class="ratings">
							  <div class="rating-box">
								{% IF cart_items.GOODS_OPINION_RATING_VALUE %}
								<span itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating">
								  <meta itemprop="worstRating" content = "1">
								  <meta itemprop="bestRating" content = "10">
								  <meta itemprop="ratingValue" content = "{cart_items.GOODS_OPINION_RATING_VALUE_ROUND}">
								  <div class="rating" style="width:{cart_items.GOODS_OPINION_RATING_VALUE_ROUND}0%" alt="{cart_items.GOODS_OPINION_RATING_VALUE_ROUND}" title="Рейтинг товара"></div>
								</span>
								{% ELSE %}
								  <div class="rating" style="width:0%" alt="Рейтинг не определён" title="Рейтинг не определён"></div>
								{% ENDIF %}
							  </div>
							</div>
						  </div>
						  <div class="product-name"><a href="{cart_items.GOODS_URL}" title="{cart_items.GOODS_NAME}">{cart_items.GOODS_NAME}</a></div>
						  <div class="product-price">
							<span class="price {CURRENCY_CHAR_CODE}" data-price="{cart_items.GOODS_MOD_PRICE_NOW}">{cart_items.GOODS_MOD_PRICE_NOW | money_format}</span>
							{% IF cart_items.GOODS_MOD_PRICE_OLD>cart_items.GOODS_MOD_PRICE_NOW %}
							<span class="old-price">
							  <span class="price {CURRENCY_CHAR_CODE}">{cart_items.GOODS_MOD_PRICE_OLD | money_format}</span>
							</span>
							{% ENDIF %}
						  </div>
						  <div class="product-qty">
							<span class="qty-label">Количество: </span>
							<span class="qty-value">
							  <span class="quantity">{cart_items.ORDER_LINE_QUANTITY} {cart_items.GOODS_MOD_MEASURE_NAME}</span>
							</span>
						  </div>
						  {% IFNOT cart_items.distinctive_properties_empty %}<div class="product-mod">({% FOR distinctive_properties %}{cart_items.distinctive_properties.NAME}: {cart_items.distinctive_properties.VALUE}{% IFNOT cart_items.distinctive_properties.last %}, {% ENDIF %}{% ENDFOR %})</div>{% ENDIF %}
						</div>
					  </li>
					  {% ENDFOR %}
					</ul>
					{% FOR cart_sum %}
					<div class="subtotal">
					  <span class="label">Итого:</span>
					  <span class="price {CURRENCY_CHAR_CODE} total-sum">{cart_sum.NOW | money_format}</span>
					</div>
					{% ENDFOR %}
					<div class="actions">
					  <a class="button black products-remove" title="Очистить корзину" data-href="{CART_TRUNCATE_URL}">Очистить</a>
					  <a class="button black" title="Перейти к оформлению заказа" href="{CART_URL}">В корзину</a>
					</div>
					{% ENDIF %}
				  </div>
				</div>
			  </div>
			</div>
			<!-- Логотип -->
			<div class="col-lg-6 col-sm-4 col-sms-12 col-smb-12">
			  <div class="logo">
				<a href="http://{NET_DOMAIN}/" title="{SETTINGS_STORE_NAME}">
				  <img src="{ASSETS_IMAGES_PATH}logo.png?design=urban" alt="{SETTINGS_STORE_NAME}">
				</a>
			  </div>
			</div>
		  </div>
		</div>
	  </div>

замените на:
<!-- Личный кабинет, Телефон, Поиск -->
	  <div class="header-top">
		<div class="container">
		  <div class="block-account">
			<div class="user-title">
			  <i class="fa fa-bars" title="Меню пользователя"></i><span class="label">Меню</span>
			</div>
			<ul class="dropdown-list">
			  {% 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 %}>{menu.header.links.NAME}</a></li>
				  {% ENDFOR %}
				{% ENDFOR %}
			  {% ENDFOR %}
			</ul>
		  </div>
		  <!-- Поиск -->
		  <div class="form-search">
			<form id="search_mini_form" action="http://{NET_DOMAIN}/search" method="get" title="Поиск по магазину" onsubmit="if($(this).find('.form-search').val()) return false;">
			  <input type="text" name="q" value="{SEARCH_QUERY}" class="input-text search-string" placeholder="Поиск по магазину...">
			  <input type="hidden" name="goods_search_field_id" value="0">
			  <button type="submit" title="Искать" class="button search-submit fa fa-search"></button>
			</form>
		  </div>
	<!-- Корзина -->
			<div class="col-right">
			  <div class="block-cart {% IFNOT CART_COUNT_TOTAL = 0 %}have-items{% ENDIF %} {% IF MOD_LNAME = cart %}cart-page{% ENDIF %}">
				<div class="cart-title">
				  <a href="{CART_URL}" class="label">Корзина<i class="fa fa-shopping-cart" title="Перейти в корзину">&nbsp;</i></a>
				  <span class="cart-count" data-count="{CART_COUNT_TOTAL}">{CART_COUNT_TOTAL}</span>
				</div>
				<div class="dropdown-cart">
				  <div class="cart-content">
					{% IF cart_count_empty %}
					<div class="cart-empty">Ваша корзина пуста</div>
					{% ELSE %}
					<ul class="cart-products-list">
					  {% FOR cart_items %}
					  <li class="item">
						<a data-href="{cart_items.ORDER_LINE_DELETE_URL}" data-count="{cart_items.ORDER_LINE_QUANTITY}" title="Удалить позицию" class="product-remove"></a>
						<a href="{cart_items.GOODS_URL}" title="{cart_items.GOODS_NAME}" class="product-image"><img src="{% IF cart_items.GOODS_IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-icon.png?design=urban{% ELSE %}{cart_items.GOODS_IMAGE_ICON}{% ENDIF %}" alt="{cart_items.GOODS_NAME}" class="goods-image-icon"></a>
						<div class="product-details">
						  <div class="product-rating">
							<div class="ratings">
							  <div class="rating-box">
								{% IF cart_items.GOODS_OPINION_RATING_VALUE %}
								<span itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating">
								  <meta itemprop="worstRating" content = "1">
								  <meta itemprop="bestRating" content = "10">
								  <meta itemprop="ratingValue" content = "{cart_items.GOODS_OPINION_RATING_VALUE_ROUND}">
								  <div class="rating" style="width:{cart_items.GOODS_OPINION_RATING_VALUE_ROUND}0%" alt="{cart_items.GOODS_OPINION_RATING_VALUE_ROUND}" title="Рейтинг товара"></div>
								</span>
								{% ELSE %}
								  <div class="rating" style="width:0%" alt="Рейтинг не определён" title="Рейтинг не определён"></div>
								{% ENDIF %}
							  </div>
							</div>
						  </div>
						  <div class="product-name"><a href="{cart_items.GOODS_URL}" title="{cart_items.GOODS_NAME}">{cart_items.GOODS_NAME}</a></div>
						  <div class="product-price">
							<span class="price {CURRENCY_CHAR_CODE}" data-price="{cart_items.GOODS_MOD_PRICE_NOW}">{cart_items.GOODS_MOD_PRICE_NOW | money_format}</span>
							{% IF cart_items.GOODS_MOD_PRICE_OLD>cart_items.GOODS_MOD_PRICE_NOW %}
							<span class="old-price">
							  <span class="price {CURRENCY_CHAR_CODE}">{cart_items.GOODS_MOD_PRICE_OLD | money_format}</span>
							</span>
							{% ENDIF %}
						  </div>
						  <div class="product-qty">
							<span class="qty-label">Количество: </span>
							<span class="qty-value">
							  <span class="quantity">{cart_items.ORDER_LINE_QUANTITY} {cart_items.GOODS_MOD_MEASURE_NAME}</span>
							</span>
						  </div>
						  {% IFNOT cart_items.distinctive_properties_empty %}<div class="product-mod">({% FOR distinctive_properties %}{cart_items.distinctive_properties.NAME}: {cart_items.distinctive_properties.VALUE}{% IFNOT cart_items.distinctive_properties.last %}, {% ENDIF %}{% ENDFOR %})</div>{% ENDIF %}
						</div>
					  </li>
					  {% ENDFOR %}
					</ul>
					{% FOR cart_sum %}
					<div class="subtotal">
					  <span class="label">Итого:</span>
					  <span class="price {CURRENCY_CHAR_CODE} total-sum">{cart_sum.NOW | money_format}</span>
					</div>
					{% ENDFOR %}
					<div class="actions">
					  <a class="button black products-remove" title="Очистить корзину" data-href="{CART_TRUNCATE_URL}">Очистить</a>
					  <a class="button black" title="Перейти к оформлению заказа" href="{CART_URL}">В корзину</a>
					</div>
					{% ENDIF %}
				  </div>
				</div>
			  </div>
			</div>
		</div>
	  </div>
	  <!-- Меню Каталог в шапке -->
	  <div class="header-middle">
		<div class="container">
		  <!-- Каталог -->
		  <div id="custommenu" class="col-xs-12">
						<!-- Для отображения каталога товаров в шапке, замените на следующей строке {% IF MENU_CATALOG %} на {% IFNOT catalog_full_empty %} -->
						{% IFNOT catalog_full_empty %}
						<ul class="mainnav">
						{% 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>
			{% ELSE %}
			<!-- Меню в шапке -->
			<ul class="menunav">
			  {% 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 %}>{menu.header.links.NAME}</a></li>
				  {% ENDFOR %}
				{% ENDFOR %}
			  {% ENDFOR %}
			</ul>
			{% ENDIF %}
		  </div>
		  <!-- Адаптивный каталог -->
		  <div id="mommenu" class="menu-offcanvas">
			<span class="btn-navbar"> <i class="fa fa-bars"></i> <span class="overlay"></span></span>
			<div id="menu_offcanvas" class="offcanvas">
			  <span class="label">Каталог товаров</span>
			  <ul class="mainnav">
			  {% IFNOT catalog_full_empty %}
				{% FOR catalog_full %}
				  {% IF catalog_full.FIRST %}{% IFNOT catalog_full.LEVEL = 0 %}<ul class="sub">{% ENDIF %}{% ENDIF %}
					<li class="level{catalog_full.LEVEL} {% 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}" class="title-lv{catalog_full.LEVEL} {% IF catalog_full.CURRENT %}active{% ENDIF %}">{% IF catalog_full.ISSET_SUB %}<span class="open-menu {% 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 %}
			  {% ENDIF %}
			  </ul>
			</div>
		  </div>
		  <!-- Телефон -->
		  {% IF SETTINGS_STORE_PHONE_NUMBER1 %}
		  <div class="block-phone">
			<i class="fa fa-phone"></i>
			<label>Телефон: </label>
			<a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE1}{SETTINGS_STORE_PHONE_CITY_CODE1}{SETTINGS_STORE_PHONE_NUMBER1}">{SETTINGS_STORE_PHONE_COUNTRY_CODE1}({SETTINGS_STORE_PHONE_CITY_CODE1}){SETTINGS_STORE_PHONE_NUMBER1}</a>
		  </div>
		  {% ENDIF %}
		</div>
	  </div>
	  <!-- Меню, Логотип, Корзина -->
	  <div class="header-bottom">
		<div class="container">
		  <div class="row">
	<!-- Логотип -->
			<div class="col-lg-9 col-sm-8 col-sms-6 col-smb-6">
			  <div class="logo">
				<a href="http://{NET_DOMAIN}/" title="{SETTINGS_STORE_NAME}">
				  <img src="{ASSETS_IMAGES_PATH}logo.png?design=urban" alt="{SETTINGS_STORE_NAME}">
				</a>
			  </div>
			</div>
			<!-- Личный кабинет -->
			<div class="col-lg-3 col-sm-4 col-sms-6 col-smb-6" >
			  <div class="block-user">
				<div class="user-title">
				  <i class="fa fa-user" title="Меню пользователя"></i><span class="label">ЛК</span>
				</div>
				<ul class="dropdown-list">
				  {% 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}">Сравнение</a></li>{% ENDIF %}
				  {% ELSE %}
				  <li><a href="{USER_SETTINGS_URL}">Мой кабинет</a></li>
				  <li><a href="{FAVORITES_URL}">Избранное</a></li>
				  <li><a href="{USER_HISTORY_LIST_URL}">История заказов</a></li>
				  {% IF TARIFF_FEATURE_GOODS_COMPARE && SETTINGS_COMPARE_DISABLE=0 %}<li><a href="{COMPARE_URL}">Сравнение</a></li>{% ENDIF %}
				  <li><a href="{USER_LOGOUT_URL}">Выход</a></li>
				  {% ENDIF %}
				</ul>
			  </div>
			  <!-- Телефон -->
			  {% IF SETTINGS_STORE_PHONE_NUMBER1 %}
			  <div class="block-phone">
				<i class="fa fa-phone"></i>
				<a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE1}{SETTINGS_STORE_PHONE_CITY_CODE1}{SETTINGS_STORE_PHONE_NUMBER1}">{SETTINGS_STORE_PHONE_COUNTRY_CODE1}({SETTINGS_STORE_PHONE_CITY_CODE1}){SETTINGS_STORE_PHONE_NUMBER1}</a>
			  </div>
			  {% ENDIF %}
			</div>
		  </div>
		</div>
	  </div>


Далее зйдите в main.css - найдите:
#header .logo {
	text-align: center;
}

замените на:
#header .logo {
	text-align: left;
}

далее найдите:
.block-account {
	width: 75%;
	overflow: hidden;
	height: 40px;
}

замените на:
.block-account {
	width: 60%;
	overflow: hidden;
	height: 40px;
}

далее найдите:
.block-cart .cart-title {
	line-height: 40px;
}

замените на:
.block-cart .cart-title {
	line-height: 50px;
}

далее найдите:
.block-cart .cart-title .cart-count {
	display: inline-block;
	position: absolute;
	background-color: #c7081b;
	color: #ffffff;
	font-size: 12px;
	width: 20px;
	height: 20px;
	line-height: 20px;
	text-align: center;
	border-radius: 100%;
	top: -10px;
	right: 0px;
}

замените на:
.block-cart .cart-title .cart-count {
	display: inline-block;
	position: absolute;
	background-color: #c7081b;
	color: #ffffff;
	font-size: 12px;
	width: 20px;
	height: 20px;
	line-height: 20px;
	text-align: center;
	border-radius: 100%;
	top: 0px;
	right: 0px;
}

далее найдите:
.block-cart {
	display: table-cell;
	position: relative;
	float: right;
	vertical-align: top;
	padding: 0 10px;
	text-align: left;
}

замените на:
.block-cart {
	display: table-cell;
	position: relative;
	float: right;
	vertical-align: top;
	padding: 0 10px;
	text-align: left;
	margin-right: 10px;
}

далее найдите:
.block-cart .cart-title a {
	display: inline-block;
	text-transform: uppercase;
}

замените на:
.block-cart .cart-title a {
	display: inline-block;
	text-transform: uppercase;
	color: #fff;
}


#7 Ash74

Ash74

    Пользователь

  • Пользователи
  • PipPip
  • 42 сообщений
  • ГородЧелябинск

Отправлено 01 Март 2017 - 09:18

Всё отлично, спасибо!

Еще парочка квестов :rolleyes:

№1 - выровнять блок с телефонами по правой стороне экрана. Левая часть с лого выглядит как надо.
№2 - отобразить второй номер телефона. И подскажите, можно ли изменить шрифт у этого блока, но так чтобы изменился только он, а остальные шрифты остались без изменений? Если да, то где это сделать?

Прикрепленные изображения

  • Верхушка-1.png


#8 metry

metry

    Активный участник

  • Модераторы
  • 884 сообщений

Отправлено 01 Март 2017 - 14:48

Добрый день.
Зайдите в раздел Сайт - Редактор шаблонов - HTML - найдите:
<!-- Личный кабинет -->
<div class="col-lg-3 col-sm-4 col-sms-6 col-smb-6" >
<div class="block-user">
<div class="user-title">
<i class="fa fa-user" title="Меню пользователя"></i><span class="label">ЛК</span>
</div>
<ul class="dropdown-list">
{% 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}">Сравнение</a></li>{% ENDIF %}
{% ELSE %}
<li><a href="{USER_SETTINGS_URL}">Мой кабинет</a></li>
<li><a href="{FAVORITES_URL}">Избранное</a></li>
<li><a href="{USER_HISTORY_LIST_URL}">История заказов</a></li>
{% IF TARIFF_FEATURE_GOODS_COMPARE && SETTINGS_COMPARE_DISABLE=0 %}<li><a href="{COMPARE_URL}">Сравнение</a></li>{% ENDIF %}
<li><a href="{USER_LOGOUT_URL}">Выход</a></li>
{% ENDIF %}
</ul>
</div>
<!-- Телефон -->
{% IF SETTINGS_STORE_PHONE_NUMBER1 %}
<div class="block-phone">
<i class="fa fa-phone"></i>
<a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE1}{SETTINGS_STORE_PHONE_CITY_CODE1}{SETTINGS_STORE_PHONE_NUMBER1}">{SETTINGS_STORE_PHONE_COUNTRY_CODE1}({SETTINGS_STORE_PHONE_CITY_CODE1}){SETTINGS_STORE_PHONE_NUMBER1}</a>
</div>
{% ENDIF %}
замените на :


<!-- Личный кабинет -->
<div class="col-lg-3 col-sm-4 col-sms-6 col-smb-6" >
<div class="block-user">
<div class="user-title">
<i class="fa fa-user" title="Меню пользователя"></i><span class="label">ЛК</span>
</div>
<ul class="dropdown-list">
{% 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}">Сравнение</a></li>{% ENDIF %}
{% ELSE %}
<li><a href="{USER_SETTINGS_URL}">Мой кабинет</a></li>
<li><a href="{FAVORITES_URL}">Избранное</a></li>
<li><a href="{USER_HISTORY_LIST_URL}">История заказов</a></li>
{% IF TARIFF_FEATURE_GOODS_COMPARE && SETTINGS_COMPARE_DISABLE=0 %}<li><a href="{COMPARE_URL}">Сравнение</a></li>{% ENDIF %}
<li><a href="{USER_LOGOUT_URL}">Выход</a></li>
{% ENDIF %}
</ul>
</div>
<!-- Телефон -->
{% IF SETTINGS_STORE_PHONE_NUMBER1 %}
<div class="block-phone">
<i class="fa fa-phone"></i>
<a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE1}{SETTINGS_STORE_PHONE_CITY_CODE1}{SETTINGS_STORE_PHONE_NUMBER1}">{SETTINGS_STORE_PHONE_COUNTRY_CODE1}({SETTINGS_STORE_PHONE_CITY_CODE1}){SETTINGS_STORE_PHONE_NUMBER1}</a>
</div>
<br>
{% ENDIF %}
{% IF SETTINGS_STORE_PHONE_NUMBER2 %}
<div class="block-phone">
<i class="fa fa-phone"></i>
<a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE2}{SETTINGS_STORE_PHONE_CITY_CODE2}{SETTINGS_STORE_PHONE_NUMBER2}">{SETTINGS_STORE_PHONE_COUNTRY_CODE2}({SETTINGS_STORE_PHONE_CITY_CODE2}){SETTINGS_STORE_PHONE_NUMBER2}</a>
</div>
{% ENDIF %}






Так же в редакторе шаблонов - HTML - найдите:
				 <!-- Адаптивный каталог -->
				 <div id="mommenu" class="menu-offcanvas">
					 <span class="btn-navbar"> <i class="fa fa-bars"></i> <span class="overlay"></span></span>
					 <div id="menu_offcanvas" class="offcanvas">
						 <span class="label">Каталог товаров</span>
						 <ul class="mainnav">
						 {% IFNOT catalog_full_empty %}
							 {% FOR catalog_full %}
								 {% IF catalog_full.FIRST %}{% IFNOT catalog_full.LEVEL = 0 %}<ul class="sub">{% ENDIF %}{% ENDIF %}
									 <li class="level{catalog_full.LEVEL} {% 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}" class="title-lv{catalog_full.LEVEL} {% IF catalog_full.CURRENT %}active{% ENDIF %}">{% IF catalog_full.ISSET_SUB %}<span class="open-menu {% 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 %}
						 {% ENDIF %}
						 </ul>
					 </div>
				 </div>
				 <!-- Телефон -->
{% IF SETTINGS_STORE_PHONE_NUMBER1 %}
		 <div class="block-phone">
		 <i class="fa fa-phone"></i>
		 <label>Телефон: </label>
		 <a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE1}{SETTINGS_STORE_PHONE_CITY_CODE1}{SETTINGS_STORE_PHONE_NUMBER1}">{SETTINGS_STORE_PHONE_COUNTRY_CODE1}({SETTINGS_STORE_PHONE_CITY_CODE1}){SETTINGS_STORE_PHONE_NUMBER1}</a>
		 </div>
		 {% ENDIF %}

замените на:

				 <!-- Адаптивный каталог -->
				 <div id="mommenu" class="menu-offcanvas">
					 <span class="btn-navbar"> <i class="fa fa-bars"></i> <span class="overlay"></span></span>
					 <div id="menu_offcanvas" class="offcanvas">
						 <span class="label">Каталог товаров</span>
						 <ul class="mainnav">
						 {% IFNOT catalog_full_empty %}
							 {% FOR catalog_full %}
								 {% IF catalog_full.FIRST %}{% IFNOT catalog_full.LEVEL = 0 %}<ul class="sub">{% ENDIF %}{% ENDIF %}
									 <li class="level{catalog_full.LEVEL} {% 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}" class="title-lv{catalog_full.LEVEL} {% IF catalog_full.CURRENT %}active{% ENDIF %}">{% IF catalog_full.ISSET_SUB %}<span class="open-menu {% 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 %}
						 {% ENDIF %}
						 </ul>
					 </div>
				 </div>
				 <!-- Телефон -->
{% IF SETTINGS_STORE_PHONE_NUMBER1 %}
		 <div class="block-phone">
		 <i class="fa fa-phone"></i>
		 <a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE1}{SETTINGS_STORE_PHONE_CITY_CODE1}{SETTINGS_STORE_PHONE_NUMBER1}">{SETTINGS_STORE_PHONE_COUNTRY_CODE1}({SETTINGS_STORE_PHONE_CITY_CODE1}){SETTINGS_STORE_PHONE_NUMBER1}</a>
		 </div>
						 <br>
						 {% ENDIF %}
						 {% IF SETTINGS_STORE_PHONE_NUMBER2 %}
						 <div class="block-phone">
							 <i class="fa fa-phone"></i>
							 <a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE2}{SETTINGS_STORE_PHONE_CITY_CODE2}{SETTINGS_STORE_PHONE_NUMBER2}">{SETTINGS_STORE_PHONE_COUNTRY_CODE2}({SETTINGS_STORE_PHONE_CITY_CODE2}){SETTINGS_STORE_PHONE_NUMBER2}</a>
						 </div>
						 {% ENDIF %}





в main.css найдите
.block-phone {display: inline-block;float: none;width: 200px;line-height: 40px;margin-left: 30px;text-transform: uppercase;}


замените его на:

.block-phone {display: inline-block; width: 200px;text-transform: uppercase;float:right; text-align:right;}


#9 Ash74

Ash74

    Пользователь

  • Пользователи
  • PipPip
  • 42 сообщений
  • ГородЧелябинск

Отправлено 25 Апрель 2017 - 23:17

Приветствую!

Сделал всё по инструкции от Vaccina (01 Март 2017 - 07:00)

В итоге сейчас все страницы выглядят как на скрине - большая часть экрана заполняется серым цветом. Всё работает нормально, но нужно вернуть белый цвет основной части страницы (стрелочками обозначил область)

Жду ответа! Заранее спасибо.

Прикрепленные изображения

  • Цвет экарана.jpg


#10 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 26 Апрель 2017 - 06:06

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

Попробуйте почистить кэш. Сейчас у вас отображается сайт с белым фоном:
123.jpg

Если же отменяли изменения, то сохраните их пожалуйста. Или попробуйте после изменений в main.css блок:
.wrapper {
	position: relative;
	overflow-x: hidden;
	left: 0px;
}

попробуйте заменить на:
.wrapper {
	position: relative;
	overflow-x: hidden;
	left: 0px;
	background: #fff;
}


#11 Ash74

Ash74

    Пользователь

  • Пользователи
  • PipPip
  • 42 сообщений
  • ГородЧелябинск

Отправлено 26 Апрель 2017 - 07:32

Доброе утро!

Да, я откатил изменения. Вот сейчас Вы можете увидеть, как сайт выглядит. Попробовал внести изменения в main.css - меняется не только фон, но и цвет полоски сверху. Нужно полосу оставить серого цвета, а фон поменять. На скрине обозначил.

Прикрепленные изображения

  • 123.jpg


#12 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 26 Апрель 2017 - 07:39

В шаблоне HTML найдите:
</div>
				</div>
		  </div>	 
	<!-- /END Шапка -->

замените на:
</div>
				</div>
				</div>
		  </div>	 
	<!-- /END Шапка -->


#13 Ash74

Ash74

    Пользователь

  • Пользователи
  • PipPip
  • 42 сообщений
  • ГородЧелябинск

Отправлено 26 Апрель 2017 - 07:57

Всё получилось! Большое спасибо за оперативный ответ =)

Последняя деталь: как переместить значок ЛК в правую часть экрана, под номера телефонов? И где можно изменить подпись "ЛК" на другой текст?

Прикрепленные изображения

  • Сейчас ЛК.jpg
  • Надо ЛК.jpg


#14 Firefly

Firefly

    Активный участник

  • Модераторы
  • 3 810 сообщений

Отправлено 26 Апрель 2017 - 09:38

Просмотр сообщенияAsh74 (26 Апрель 2017 - 07:57) писал:

Всё получилось! Большое спасибо за оперативный ответ =)

Последняя деталь: как переместить значок ЛК в правую часть экрана, под номера телефонов? И где можно изменить подпись "ЛК" на другой текст?

Здравствуйте.
Значок Вам переместил вниз.
Для изменения названия в шаблоне HTML найдите код:
								  <i class="fa fa-user" title="Меню пользователя"></i><span class="label">ЛК</span>

И в нем измените текст на требуемый

#15 Ash74

Ash74

    Пользователь

  • Пользователи
  • PipPip
  • 42 сообщений
  • ГородЧелябинск

Отправлено 26 Апрель 2017 - 10:34

Спасибо! Удачного дня!





Темы с аналогичным тегами шапка

Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных