Сообщений в теме: 4

[evros]

Прошу помочь внести изменения в шапку сайта как во вложении. Подскажите пожалуйста, как правильно все реализовать. Заранее благодарю за обратную связь.

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

• 

[Firefly]

evros (18 Июль 2015 - 16:10) писал:

Прошу помочь внести изменения в шапку сайта как во вложении. Подскажите пожалуйста, как правильно все реализовать. Заранее благодарю за обратную связь.

Здравствуйте.
Зайдите в админ. панель -> Сайт -> Редактор шаблонов -> Шаблоны -> HTML, найдите код:

				<form id="search_mini_form" action="http://{NET_DOMAIN}/search" method="get">
				  <div class="form-search">
					<input id="search" type="text" name="q" value="" class="search-string" placeholder="Поиск по магазину...">
					<button type="submit" title="Искать" class="button search-submit"></button>
				  </div>
				</form>

Перенесите данный код после:

		<!-- /END Баннеры на главной -->

Зайдите в админ. панель -> Сайт -> Редактор шаблонов -> Стили -> main.css, найдите код:

/* Поиск */
.header-top .header-top-right #search_mini_form {background-image: url('{ASSETS_IMAGES_PATH}ico-search.png?design=orange');background-repeat: no-repeat;background-position: 10px 12px;width: 52px;height: 50px;border-left: 1px solid #f2f2f2;position: relative;background-color: #ff3600;}
.header-top .header-top-right #search_mini_form .form-search {opacity: 0;filter: alpha(opacity = 0);visibility: hidden;position: absolute;top: 0;right: 0;height: 50px;z-index: 1;}
.header-top .header-top-right #search_mini_form .form-search .button {float: right;background-image: url('{ASSETS_IMAGES_PATH}ico-search.png?design=orange');background-repeat: no-repeat;background-position: 11px 12px;width: 52px;height: 50px;cursor:pointer;}
.header-top .header-top-right #search_mini_form:hover {background-color: rgba(247,146,66,.5);}
.header-top .header-top-right #search_mini_form .form-search #search {position: absolute;top: 0;right: 52px;float: right;height: 50px;border: 7px solid transparent;border-color: #ff3600;width: 50px;font-size: 100%;}
.header-top .header-top-right #search_mini_form:hover .form-search {opacity: 1; filter:alpha(opacity = 100);visibility:visible;z-index:1;}
.header-top .header-top-right #search_mini_form:hover .form-search #search {width: 200px;}

Замените на:

/* Поиск */
#search_mini_form .form-search .button {float: left; background-image: url('{ASSETS_IMAGES_PATH}ico-search.png?design=orange'); background-repeat: no-repeat; background-position: 11px 12px; width: 52px; height: 50px; cursor: pointer; margin: 5px 0;}
#search_mini_form:hover {background-color: rgba(247,146,66,.5);}
#search_mini_form .form-search #search {float: left; height: 50px; border: 5px solid transparent; border-color: #BBBBBB; width: 88%; font-size: 100%; margin: 5px;}
#search_mini_form:hover .form-search {opacity: 1; filter:alpha(opacity = 100);visibility:visible;z-index:1;}

Полностью занять строкой поиска все 100% ширины экрана не получится, т.к. это повлияет на существующую адаптивность и кнопки будут налезать друг на друга.

Найдите код:

.header-top .header-top-right #search_mini_form {display:none;}

Замените на:

#search_mini_form {display:none;}

[AShchuka]

Здравствуйте!
Скажите пожалуйста,как сместить категории в шапке правее,чтобы были по центру страницы?

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

• 

[Vaccina]

В main.css найдите:

.navbar-collapse.collapse {
	display: block;
	height: auto;
	padding-bottom: 0px;
	overflow: visible;
}

замените на:

.navbar-collapse.collapse {
	display: block;
	height: auto;
	padding-bottom: 0px;
	overflow: visible;
	width: 100%;
	text-align: right;
}

далее найдите:

.header-top .header-top-left .top-navbar-links {
	float: left;
	list-style: outside none none;
	overflow: hidden;
	height: 50px;
}

замените на:

.header-top .header-top-left .top-navbar-links {
	float: right;
	list-style: outside none none;
	overflow: hidden;
	height: 50px;
}

[AShchuka]

Спасибо)