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


Изменение Шапки Шаблона "вечность"


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

#1 SDV

SDV

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

  • Пользователи
  • PipPip
  • 14 сообщений

Отправлено 18 Январь 2014 - 13:51

Здравствуйте уважаемая служба поддержки :)

Можете подсказать, как сделать следующие изменения шапки сайта: (пример в приложении)
1. Блок "поиск" переместить вниз под меню 2го уровня и сделать чуть уже и короче
2. Блок "сравнение" переместить вниз под меню 2го уровня
3. Блок "телефон" сместить левее и ниже (разместить под логотипом)
4. Блок "логотип" сделать меньше и разместить над телефоном
5. Вставить большой баннер/фото "за подлицо", т.е. по границам верхнего и нижнего меню

Можете помочь с таким кол-ом вопросов?

Заранее спасибо...

Снимок-экрана-2014-01-18-в-13.45.00.jpg

#2 empty9228

empty9228

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

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

Отправлено 18 Январь 2014 - 14:51

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

#3 SDV

SDV

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

  • Пользователи
  • PipPip
  • 14 сообщений

Отправлено 18 Январь 2014 - 15:16

Благодарю за реакцию... странно вроде в первый раз скрин прикрепил :rolleyes:

#4 Alexey11

Alexey11

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

  • Модератоpы
  • 1 057 сообщений
  • ГородНижний новгород

Отправлено 19 Январь 2014 - 06:34

1.Перемещаем поиск.
Найдите данный код в шаблоне HTML:
<!-- Форма поиска -->
	  <form action="http://{NET_DOMAIN}/search" method="get" onsubmit="if($(this).find('#search').val()=='Поиск по магазину...') return false;" role="search">
		<div>
		  <input class="search" name="q" type="search"  value="{% IF SEARCH_QUERY %}{SEARCH_QUERY}{% ELSE %}Поиск по магазину...{% ENDIF %}" onfocus="if(this.value=='Поиск по магазину...'){this.value='';}" onblur="if(this.value==''){this.value='Поиск по магазину...';}" />
		  <input title="Искать" type="submit" value="Поиск" />
		</div>
	  </form> 
	  <!-- /Форма поиска -->
Удалите его.

Далее сразу после данного блока:
<!-- Список новинок -->
	  {% IFNOT index_page_new_goods_empty %}
		<section class="newsletter">
		  <div>
			<h3><b>Новинки</b></h3>
		  </div>
		</section>
		<section role="main">
Вставьте данный код:
<!-- Форма поиска -->
	  <form action="http://{NET_DOMAIN}/search" method="get" onsubmit="if($(this).find('#search').val()=='Поиск по магазину...') return false;" role="search">
		<div>
		  <input class="search" name="q" type="search"  value="{% IF SEARCH_QUERY %}{SEARCH_QUERY}{% ELSE %}Поиск по магазину...{% ENDIF %}" onfocus="if(this.value=='Поиск по магазину...'){this.value='';}" onblur="if(this.value==''){this.value='Поиск по магазину...';}" />
		  <input title="Искать" type="submit" value="Поиск" />
		</div>
	  </form>
	  <!-- /Форма поиска -->

Далее редактируем шаблон style.css.
Найдите данный блок кода:
form[role="search"] {position: absolute; right: 2em;top: 2.5em;}
замените его на:
form[role="search"] {position: absolute; right: 0em;top: -1.5em;}
2.Перемещаем блок сравнения товаров.
В шаблоне HTML найдите данный код:
	 <!-- Если в тарифном плане подключен модуль сравнения товаров -->
	  {% IF TARIFF_FEATURE_GOODS_COMPARE %}
		<!-- Если не выключен модуль сравнения товаров, то покажем этот блок -->
		{% IFNOT SETTINGS_COMPARE_DISABLE %}
		  {% IF COMPARE_GOODS_COUNT=0 %}
			<div class="compare hide">
			  <p>Ваш список сравнения пуст</p>
			</div>
		  {% ELSE %}
			<div class="compare">
			  <p><a href="{COMPARE_URL}">Сейчас на сравнении {COMPARE_GOODS_COUNT} товар{COMPARE_GOODS_COUNT | gen_word_end("","а","ов")}.</a></p>
			</div>
		  {% ENDIF %}
		{% ENDIF %}
	  {% ENDIF %}
	  <!-- END Если в тарифном плане подключен модуль фильтров по товарам -->
Далее переместите его сразу после:
<!-- Форма поиска -->
	  <form action="http://{NET_DOMAIN}/search" method="get" onsubmit="if($(this).find('#search').val()=='Поиск по магазину...') return false;" role="search">
		<div>
		  <input class="search" name="q" type="search"  value="{% IF SEARCH_QUERY %}{SEARCH_QUERY}{% ELSE %}Поиск по магазину...{% ENDIF %}" onfocus="if(this.value=='Поиск по магазину...'){this.value='';}" onblur="if(this.value==''){this.value='Поиск по магазину...';}" />
		  <input title="Искать" type="submit" value="Поиск" />
		</div>
	  </form>
	  <!-- /Форма поиска -->
Редактируем шаблоне style.css
Находим данный код:
.compare {text-align: center;margin-bottom: 0px;bottom: 1%;position: absolute;right:  10%;padding:20px;}
меняем его на:
.compare {text-align: center;margin-bottom: 0px;top: -1%;position: absolute;right:  30%;padding:20px;}


#5 SDV

SDV

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

  • Пользователи
  • PipPip
  • 14 сообщений

Отправлено 19 Январь 2014 - 14:03

Спасибо...
по первым 2м пунктам все сделал как написано, но получается что поиск и сравнение отображаются только когда есть новинки в отображении, т.е. если товар добавлен в новинки. Так же сравнение и поиск получаются на разных уровнях.

Вот http://stocktoys.storeland.ru

#6 SDV

SDV

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

  • Пользователи
  • PipPip
  • 14 сообщений

Отправлено 25 Январь 2014 - 11:17

Пожалуйста подскажите, как сделать то что я прошу в топике? Код выше не помогает, все съезжает и отображается только при новинках. Или предложите стоимость данных изменений Вашими силами.

#7 @lina_va

@lina_va

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

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

Отправлено 25 Январь 2014 - 16:43

Просмотр сообщенияSDV (19 Январь 2014 - 14:03) писал:

Спасибо...
по первым 2м пунктам все сделал как написано, но получается что поиск и сравнение отображаются только когда есть новинки в отображении, т.е. если товар добавлен в новинки. Так же сравнение и поиск получаются на разных уровнях.

Вот http://stocktoys.storeland.ru
Добрый вечер. Редактируем поиск и сравнение товаров
B HTML блок:
	 <!-- Форма поиска -->
	 <form action="http://{NET_DOMAIN}/search" method="get" onsubmit="if($(this).find('#search').val()=='Поиск по магазину...') return false;" role="search">
	 <div>
		 <input class="search" name="q" type="search" value="{% IF SEARCH_QUERY %}{SEARCH_QUERY}{% ELSE %}Поиск по магазину...{% ENDIF %}" onfocus="if(this.value=='Поиск по магазину...'){this.value='';}" onblur="if(this.value==''){this.value='Поиск по магазину...';}" />
		 <input title="Искать" type="submit" value="Поиск" />
	 </div>
	 </form>
	 <!-- /Форма поиска -->
	 <!-- Если в тарифном плане подключен модуль сравнения товаров -->
	 {% IF TARIFF_FEATURE_GOODS_COMPARE %}
	 <!-- Если не выключен модуль сравнения товаров, то покажем этот блок -->
	 {% IFNOT SETTINGS_COMPARE_DISABLE %}
		 {% IF COMPARE_GOODS_COUNT=0 %}
		 <div class="compare hide">
			 <p>Ваш список сравнения пуст</p>
		 </div>
		 {% ELSE %}
		 <div class="compare">
			 <p><a href="{COMPARE_URL}">Сейчас на сравнении {COMPARE_GOODS_COUNT} товар{COMPARE_GOODS_COUNT | gen_word_end("","а","ов")}.</a></p>
		 </div>
		 {% ENDIF %}
	 {% ENDIF %}
	 {% ENDIF %}
	 <!-- END Если в тарифном плане подключен модуль фильтров по товарам -->
перенесите после:
<!-- Каталог товаров -->
<div class="conta">
B style.css заменяем:
.conta {
position: relative;
width: 100%;
max-width: 1280px;
margin: 20px auto;
z-index: 30;
}
на
.conta {
height: 80px;
position: relative;
width: 100%;
max-width: 1280px;
margin: 20px auto;
z-index: 30;
}

form[role="search"] {
position: absolute;
right: 2em;
top: 2.5em;
}
на
form[role="search"] {
position: absolute;
right: 2em;
top: 4.5em;
}
и
.compare {
text-align: center;
margin-bottom: 0px;
bottom: 1%;
position: absolute;
right: 10%;
padding: 20px;
}
на
.compare {
text-align: center;
margin-bottom: 0px;
bottom: -23%;
position: absolute;
right: 31%;
padding: 20px;
}


#8 @lina_va

@lina_va

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

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

Отправлено 25 Январь 2014 - 16:55

Просмотр сообщенияSDV (18 Январь 2014 - 13:51) писал:

Здравствуйте уважаемая служба поддержки :)

Можете подсказать, как сделать следующие изменения шапки сайта: (пример в приложении)
1. Блок "поиск" переместить вниз под меню 2го уровня и сделать чуть уже и короче
2. Блок "сравнение" переместить вниз под меню 2го уровня
3. Блок "телефон" сместить левее и ниже (разместить под логотипом)
4. Блок "логотип" сделать меньше и разместить над телефоном
5. Вставить большой баннер/фото "за подлицо", т.е. по границам верхнего и нижнего меню

Можете помочь с таким кол-ом вопросов?

Заранее спасибо...

Прикрепленный файл Снимок-экрана-2014-01-18-в-13.45.00.jpg
3) B html заменяем:
<header role="banner">
на
<header role="banner" style=" height: 150px;">

в style.css
.contacts {
float: left;
position: relative;
}
на
.contacts {
margin-top: -20px;
margin-left: 30px;
float: left;
position: relative;
}
4) Чтобы изменить размер логотипа пропишите ширину и высоту в html:
	 <h1 title="{SETTINGS_STORE_NAME}"><a href="http://{NET_DOMAIN}/" title="{SETTINGS_STORE_NAME}"><img src="{ASSETS_IMAGES_PATH}logo.png" alt="{SETTINGS_STORE_NAME}" /><br />{SETTINGS_STORE_NAME}</a></h1>

<img src="http://design.stocktoys.ru/logo.png" alt="StockTOYS" style=" width:50 px; height: 30px;
">
5) B HTML после кода:
			<!-- Время работы магазина -->
			{% IF SETTINGS_STORE_WORK_TIME %}
			  <div class="work-time" title="Время работы нашего магазина: {SETTINGS_STORE_WORK_TIME}">
				{SETTINGS_STORE_WORK_TIME}
			  </div>
			{% ENDIF %}
		   
			<!-- Skype номер -->
			{% IF SETTINGS_STORE_SKYPE %}
			  <div class="contentTableHeadMainSkype">
				<a class="valignMiddle" href="skype:{SETTINGS_STORE_SKYPE}?call" title="Свяжитесь с нами по Skype">
				  <img class="valignMiddle" src="{FORALL_IMAGES_PATH}icon/skype.png" width="16" height="16" alt="Свяжитесь с нами по Skype" />
				  <span class="valignMiddle">{SETTINGS_STORE_SKYPE}</span>
				</a>
			  </div>
			{% ENDIF %}
		   
			<!-- ICQ номер -->
			{% IF SETTINGS_STORE_ICQ %}
			  <div class="contentTableHeadMainIcq">
				<img class="valignMiddle" src="http://wwp.icq.com/scripts/online.dll?icq={SETTINGS_STORE_ICQ_ONLY_DIGITS}&amp;img=27" alt="Статус" width="16" height="16" />
				<span class="valignMiddle">{SETTINGS_STORE_ICQ}</span>
			  </div>
			{% ENDIF %}
		  </div>
		{% ENDIF %}
	  </div>
вставляем:
   <div class="baner">	  
	 <img src="{ASSETS_IMAGES_PATH}i.png"  />
   </div>
и добавляем в style.css:
.baner {
float: right;
width: 1000px;
height: 150px;
}

i.png
- название загруженной в бэкофис картинки

#9 SDV

SDV

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

  • Пользователи
  • PipPip
  • 14 сообщений

Отправлено 26 Январь 2014 - 14:36

@lina_va Спасибо! Практически все получилось, кроме 3го вопроса "телефона и время". Все сделал по схеме, но телефон с временем перенести не получилось.
www.stocktoys.ru

#10 @lina_va

@lina_va

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

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

Отправлено 26 Январь 2014 - 14:58

Просмотр сообщенияSDV (26 Январь 2014 - 14:36) писал:

@lina_va Спасибо! Практически все получилось, кроме 3го вопроса "телефона и время". Все сделал по схеме, но телефон с временем перенести не получилось.
www.stocktoys.ru
B html замените:
<header role="banner" style=" height: 150px;">
на
<header role="banner" style=" height: 165px;">
и в style.css
.contacts {
float: left;
position: relative;
}
на
.contacts {
margin-top: 60px;
margin-left: -120px;
float: left;
position: relative;
}

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

  • 1.jpg


#11 SDV

SDV

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

  • Пользователи
  • PipPip
  • 14 сообщений

Отправлено 26 Январь 2014 - 21:20

@lina_va Все получилось... Спасибо огромное!
еще вопросик по этой теме :rolleyes:  Как немного сократить высоту между плашкой нижнего (второго) меню и картинкой (логотипом)? После всех изменений, меню немного спустилось.

#12 miyako

miyako

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

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

Отправлено 27 Январь 2014 - 10:13

Просмотр сообщенияSDV (26 Январь 2014 - 21:20) писал:

@lina_va Все получилось... Спасибо огромное!
еще вопросик по этой теме :rolleyes:  Как немного сократить высоту между плашкой нижнего (второго) меню и картинкой (логотипом)? После всех изменений, меню немного спустилось.

Найдите код в шаблоне HTML  -
<header role="banner" style=" height: 165px;">
и замените на -
<header role="banner" style=" height: 150px;">


#13 SDV

SDV

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

  • Пользователи
  • PipPip
  • 14 сообщений

Отправлено 27 Январь 2014 - 10:24

miyako, Почему то эти действия ничего не меняют, даже 280px писал, никаких изменений не видно?!

#14 ne_yana

ne_yana

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

  • Модератоpы
  • 1 190 сообщений

Отправлено 27 Январь 2014 - 10:35

Просмотр сообщенияSDV (27 Январь 2014 - 10:24) писал:

miyako, Почему то эти действия ничего не меняют, даже 280px писал, никаких изменений не видно?!
Здравствуйте, сейчас у Вас установлено значение 165px, и отображение соответствует этому значению. Возможно у Вас кэшировалась страница. Попробуйте сделать изменения еще раз и почистить кэш.

#15 miyako

miyako

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

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

Отправлено 27 Январь 2014 - 10:36

Просмотр сообщенияSDV (27 Январь 2014 - 10:24) писал:

miyako, Почему то эти действия ничего не меняют, даже 280px писал, никаких изменений не видно?!

Возможно не заметили разницы в 10 пикселей, или не очистили кэш браузера.

Код -
<header role="banner" style=" height: 150px;">
замените на -
<header role="banner" >


#16 SDV

SDV

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

  • Пользователи
  • PipPip
  • 14 сообщений

Отправлено 27 Январь 2014 - 15:13

Спасибо! Видимо медленно обновляется или закешировалась... все ок!

#17 SDV

SDV

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

  • Пользователи
  • PipPip
  • 14 сообщений

Отправлено 28 Январь 2014 - 08:29

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

Подскажите по поводу отображения в браузерах... у меня в ИЕ8 карточки товара съезжают, кнопка заказать и кол-во, в сафари тоже глюк, постоянно на главной в ролинге два товара одни и теже. Или у меня браузеры старые? И как мне сделать товары на главной, чтоб отображались, как товары в каталоге, имею в виду название, цена, отзывы, кнопка заказа и т.д.?

#18 Castiel

Castiel

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

  • Модераторы
  • 3 519 сообщений
  • ГородНижний Новгород

Отправлено 28 Январь 2014 - 09:03

Просмотр сообщенияSDV (28 Январь 2014 - 08:29) писал:

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

Подскажите по поводу отображения в браузерах... у меня в ИЕ8 карточки товара съезжают, кнопка заказать и кол-во, в сафари тоже глюк, постоянно на главной в ролинге два товара одни и теже. Или у меня браузеры старые? И как мне сделать товары на главной, чтоб отображались, как товары в каталоге, имею в виду название, цена, отзывы, кнопка заказа и т.д.?

Здравствуйте
Удалите эти строки
<!--[if IE 8]> <html class="ie8" lang="en"> <![endif]-->
<!--[if lte IE 8]> <html class="ie8_all" lang="en"> <![endif]-->

Так же рекомендуем обновить браузеры и не использовать ИЕ, скачайте google chrome или другой современный браузер.

Разница между товарами на главной и в каталоге это положение названия товара, вы хотите чтобы оно было сверху или снизу?

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

  • pic34.jpg


#19 SDV

SDV

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

  • Пользователи
  • PipPip
  • 14 сообщений

Отправлено 28 Январь 2014 - 19:59

Снизу... точно так же как в каталоге!

#20 Vaccina

Vaccina

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

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

Отправлено 29 Январь 2014 - 01:27

В шаблоне HTML найдите:
<h3><a title="{index_page_goods.NAME}" href="{index_page_goods.URL_MIN_PRICE_NOW | url_amp}" style="height:100px;">{index_page_goods.NAME}</a></h3>
переместите его поставив после:
<div style="width: 100%;position: relative;height: 100%;overflow:hidden;">
				<a title="{index_page_goods.NAME}" href="{index_page_goods.URL_MIN_PRICE_NOW | url_amp}">
				 <img alt="{index_page_goods.NAME}" src="{% IF index_page_goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-small.png{% ELSE %}{index_page_goods.IMAGE_SMALL}{% ENDIF %}" />
				</a>
			  </div>

Если имеются еще товары с подобным отображением, то изменения проводятся аналогично инструкции выше




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

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