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

[ganser-id]

И снова добрый день!

Помогите, пожалуйста, допилить две вещи:

1) Вместо строки поиска сделать иконку (как корзина и сравнение) и перенести её на плашку каталога.

2) Вместо кнопок соц.сетей дублировать в шапку форму заказа обратного звонка (ужав по высоте до имеющихся размеров).

Прилагаю скрин с пояснениями. Спасибо заранее!

[Firefly]

ganser-id (16 Июнь 2015 - 19:57) писал:

И снова добрый день!

Помогите, пожалуйста, допилить две вещи:

1) Вместо строки поиска сделать иконку (как корзина и сравнение) и перенести её на плашку каталога.

2) Вместо кнопок соц.сетей дублировать в шапку форму заказа обратного звонка (ужав по высоте до имеющихся размеров).

Прилагаю скрин с пояснениями. Спасибо заранее!

Здравствуйте.
Ваш скриншот судя по всему не прикрепился, проверьте пожалуйста, и приложите к сообщению, чтобы можно было видеть, что необходимо сделать.

[ganser-id]

Firefly (16 Июнь 2015 - 20:17) писал:

Здравствуйте.
Ваш скриншот судя по всему не прикрепился, проверьте пожалуйста, и приложите к сообщению, чтобы можно было видеть, что необходимо сделать.

Прошу прощения

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

• 

[Firefly]

ganser-id (16 Июнь 2015 - 20:23) писал:

Прошу прощения

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

			 <ul class="connect-us">

Замените на:

			 <ul class="connect-us" style="display:none;">

Найдите код:

			 <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="inputText search-string" placeholder="Поиск по магазину...">
				 <button type="submit" title="Искать" class="button search-submit"></button>
				 </div>
			 </form>

Замените на:

			 <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="inputText search-string" placeholder="Поиск по магазину...">
				 <button type="submit" title="Искать" class="button search-submit"></button>
				 </div>
			 </form>
			 <form method="post" action="{CALLBACK_URL}" class="callbackForm" enctype="multipart/form-data">
				 <input type="hidden" name="hash" value="{HASH}" />
				 <input class="callbackredirect" type="hidden" name="return_to" value="{CALLBACK_URL}"/>
				 <!-- Набор полей которые не видит пользователь, но видят боты. Когда они их заполняют мы точно знаем, что их прислал нам бот и мы не сохраняем подобный отзыв о товаре, а боту отправившему отзыв сообщаем, что отзыв добавлен успешно, но будет отображён здесь после прохождения модерации -->
				 {ANTISPAM_CODE}
				 <div class="input-box">
				 <input id="callback_person" class="inputText callback_person required" type="text" name="form[{ANTISPAM_FORM_FIELD_NAME_CALLBACK_PERSON}]" value="{FORM_CALLBACK_PERSON}" placeholder="Представьтесь, пожалуйста" maxlength="50" title="Представьтесь, пожалуйста" autocomplete="off">
				 </div>
				 <div class="input-box">
				 <input id="callback_phone" class="inputText callback_phone required" type="text" name="form[{ANTISPAM_FORM_FIELD_NAME_CALLBACK_PHONE}]" value="{FORM_CALLBACK_PHONE}" placeholder="Введите номер телефона" maxlength="50" title="Введите номер телефона" autocomplete="off">
				 </div>
				 {% IFNOT FORM_SEND_OK %}<button type="submit" title="Отправить" class="submit">Отправить</button>{% ENDIF %}
			 </form>

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

@media (max-width: 768px) and (min-width: 0px) {
#header .header-right .header-right-inner .callbackForm {display:none;}
}
#header .header-right .header-right-inner .callbackForm {float:left; padding-right: 140px;}
#header .header-right .header-right-inner form .input-box input {width: 200px;float: left;padding: 0px 15px;font-size: 12px;margin: 0 0 10px 0;-webkit-border-radius: 18px;-moz-border-radius: 18px;border-radius: 18px;border: 1px solid #e9e9e9;background: #FFF;height:30px;}
#header .header-right .header-right-inner form .input-box input:focus {border: 1px solid #cdcdcd;}
#header .header-right .header-right-inner .callbackForm button.submit {float:left;clear: both;position: absolute;margin-left: 17px;margin-top: 17px;}
#header .header-right #search_mini_form {display:none;}
#menu .nav-right .block-search {display:block;}
#menu .nav-right .block-search #search_mini_form2 {position: absolute;right: 160px;cursor: pointer;z-index: 2;height: 51px;width: 51px;}
#menu .nav-right .block-search #search_mini_form2:before {content: "";right: 0px;position: absolute;width: 48px;height: 47px;-webkit-border-radius: 12px;-moz-border-radius: 12px;border-radius: 12px;border: 1px solid rgba(255, 255, 255, 0.5);background: transparent;}
#menu .nav-right .block-search #search_mini_form2:after {position: absolute;content: "";height: 16px;width: 17px;top: 18px;left: 18px;background: url("{ASSETS_IMAGES_PATH}ico-search-white.png") no-repeat left top;}
#menu .nav-right .block-search #search_mini_form2:hover:before {background: rgba(255, 255, 255, 0.2);}
#menu .nav-right .block-search #search_mini_form2:hover .form-search {opacity: 1;filter: alpha(opacity=100);-webkit-transform: scale(1);-moz-transform: scale(1);-o-transform: scale(1);transform: scale(1);}
#menu .nav-right .block-search #search_mini_form2 .form-search {position: absolute;right: -30px;top: 50px;padding-top: 21px;opacity: 0;filter: alpha(opacity=0);-webkit-transform: scale(0);-moz-transform: scale(0);-o-transform: scale(0);transform: scale(0);transform-origin: 50% 10% 0;-moz-transform-origin: 50% 10% 0;-webkit-transform-origin: 50% 10% 0;-o-transform-origin: 50% 10% 0;-ms-transform-origin: 50% 10% 0;}
#menu .nav-right .block-search #search_mini_form2 .form-search input.inputText {width: 170px;border-color: #FFF;}
#menu .nav-right .block-search #search_mini_form2 .button {top: 30px;}

[ganser-id]

Большое спасибо, встало как надо!

И ещё вдогонку маленькая просьба: нужно написать "Заказать обратный звонок:" перед формой в шапке - на скрине стрелкой отметил место.

Благодарю!

[Danil]

ganser-id (16 Июль 2015 - 13:54) писал:

Большое спасибо, встало как надо!

И ещё вдогонку маленькая просьба: нужно написать "Заказать обратный звонок:" перед формой в шапке - на скрине стрелкой отметил место.

Благодарю!

Обр_зв.JPG

Здравствуйте.
В шаблоне html после кода

<!-- END: Logo -->
			<div class="header-right col-xs-8">
			  <div class="header-right-inner">

вставьте

<span class="tekst1">Заказать обратный звонок</span>

В конец main.css добавьте

.tekst1 {  
float: right;
  display: block;
  font-size: 17px;
  margin-top: 21px;
  margin-right: 10px;
}
@media (max-width: 768px) and (min-width: 0px) {
 .tekst1{
  display: none;
}
}

[ganser-id]

Благодарю за код и оперативность
Правда, в стиле там выравнивание стояло по правой стороне, сам дотумкал, как поправить