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


Помогите Разобраться


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

#1 bg999

bg999

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

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

Отправлено 23 Март 2014 - 17:10

Здравствуйте!
Делаем новый магазин и решили немного изменить дизайн:
1. Убрали боковое меню на все сайте, но решили вернуть или заново сделать боковое меню только в каталоге. Сейчас каталог вылядет вот так
Изображение
А надо так
Изображение

2. Как сделать что бы показывало на странице больше 20 товаров например 100 по умолчанию?

3. Как сделать что бы отображение в каталоге было только в виде таблицы, а списком вообще убрать

4. Внешний вид строки поиска меняется когда из верхней части сайта переносим в нижнюю, один и тот же код по разному отображается.
Сейчас так
Изображение
а надо так
Изображение

Заранее спасибо, адрес сайта 123456789123.storeland.ru

#2 bg999

bg999

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

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

Отправлено 25 Март 2014 - 02:02

Ответьте пожалуйста скоро запуск сайта

#3 Сake

Сake

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

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

Отправлено 25 Март 2014 - 02:31

1. В вашем шаблоне код каталога должен выглядеть примерно следующим образом

{% IF MOD_LNAME = catalog %}
<!-- Каталог товаров -->
			  <div class="menu_main">
				<span class="link_nav"></span><a href="#" class="link_nav">Каталог</a>
				<a href="{CATALOG_URL}" title="Каталог" style="text-decoration: none"><h4 class="hidden-phone">Каталог</h4></a>
				{%IFNOT catalog_full_empty%}
				  {%FOR catalog_full%}
					{% IF catalog_full.FIRST %}<ul>{% ENDIF %}
					<li {% IF catalog_full.CURRENT %}class="open"{% ELSEIF catalog_full.CURRENT_PARENT %}class="open"{% ENDIF %}{% IF catalog_full.HIDE %} style="display:none;"{% ENDIF %}>
					  <a href="{catalog_full.URL}"{% IF catalog_full.CURRENT %}class="selected"{% ENDIF %}>{catalog_full.NAME}</a><span class="icons"{% IFNOT catalog_full.ISSET_SUB %}style="display: none;"{% ENDIF %}></span>
					{% 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%}
			  </div>
			  <!-- /Каталог товаров -->
{% ENDIF %}

данный код должен размещаться в шаблоне "HTML".

2. Почитайте тему форума http://forum.storela...ст/#entry123999
вместо строки

var sid = 's269509';

вам необходимо использовать строку

var sid = 's279509';

3. Добавьте в ваш файл стилей main.css

.sorter .view-mode {
  display: none;
}

по умолчанию у вас отображается товар в виде таблицы.

4. Для поиска можно добавить следующие стили

.form-search .input-text {
  height: 24px;
  margin-top: -5px;
  padding-right: 20px;
  width: 140px;
}
.form-search button span {
  display: none;
}
.form-search {
  position: relative;
  width: 160px;
}
.form-search button {
  background: #5F5F5F;
  border-radius: 14px;
  height: 20px;
  position: absolute;
  right: 0;
  width: 20px;
  z-index: 1;
}


#4 bg999

bg999

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

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

Отправлено 25 Март 2014 - 18:54

Просмотр сообщенияСake (25 Март 2014 - 02:31) писал:

1. В вашем шаблоне код каталога должен выглядеть примерно следующим образом

{% IF MOD_LNAME = catalog %}
<!-- Каталог товаров -->
			 <div class="menu_main">
			 <span class="link_nav"></span><a href="#" class="link_nav">Каталог</a>
			 <a href="{CATALOG_URL}" title="Каталог" style="text-decoration: none"><h4 class="hidden-phone">Каталог</h4></a>
			 {%IFNOT catalog_full_empty%}
				 {%FOR catalog_full%}
				 {% IF catalog_full.FIRST %}<ul>{% ENDIF %}
				 <li {% IF catalog_full.CURRENT %}class="open"{% ELSEIF catalog_full.CURRENT_PARENT %}class="open"{% ENDIF %}{% IF catalog_full.HIDE %} style="display:none;"{% ENDIF %}>
					 <a href="{catalog_full.URL}"{% IF catalog_full.CURRENT %}class="selected"{% ENDIF %}>{catalog_full.NAME}</a><span class="icons"{% IFNOT catalog_full.ISSET_SUB %}style="display: none;"{% ENDIF %}></span>
				 {% 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%}
			 </div>
			 <!-- /Каталог товаров -->
{% ENDIF %}

данный код должен размещаться в шаблоне "HTML".

2. Почитайте тему форума http://forum.storela...ст/#entry123999
вместо строки

var sid = 's269509';

вам необходимо использовать строку

var sid = 's279509';

3. Добавьте в ваш файл стилей main.css

.sorter .view-mode {
display: none;
}

по умолчанию у вас отображается товар в виде таблицы.

4. Для поиска можно добавить следующие стили

.form-search .input-text {
height: 24px;
margin-top: -5px;
padding-right: 20px;
width: 140px;
}
.form-search button span {
display: none;
}
.form-search {
position: relative;
width: 160px;
}
.form-search button {
background: #5F5F5F;
border-radius: 14px;
height: 20px;
position: absolute;
right: 0;
width: 20px;
z-index: 1;
}


К сожалению не все ответы помогли(
1. Попробовал по вставлять в разных местах шаблона HTML и даже в Товары
3. Все равно осталось отображение списком а особенно в поиске когда выдача идет результатов там идет списком по умолчанию.

Из-за чего может не получаться?

#5 Сake

Сake

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

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

Отправлено 26 Март 2014 - 00:42

1. Пожалуйста, опишите проблему подробнее. У вас не отобразился код каталога? Добавленное условие {% IF MOD_LNAME = catalog %}  будет отображать каталог только когда пользователь уже находиться в нем, например перейдя по ссылке /catalog в верхнем меню навигации.

2. Найдите в вашем шаблоне "Поиск" следующий код

{% IF GOODS_VIEW_TYPE=1 %}
			<ol class="products-list">

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

{% IF GOODS_VIEW_TYPE=10 %}
			<ol class="products-list">


#6 bg999

bg999

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

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

Отправлено 26 Март 2014 - 01:26

Просмотр сообщенияСake (26 Март 2014 - 00:42) писал:

1. Пожалуйста, опишите проблему подробнее. У вас не отобразился код каталога? Добавленное условие {% IF MOD_LNAME = catalog %}  будет отображать каталог только когда пользователь уже находиться в нем, например перейдя по ссылке /catalog в верхнем меню навигации.

2. Найдите в вашем шаблоне "Поиск" следующий код

{% IF GOODS_VIEW_TYPE=1 %}
		 <ol class="products-list">

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

{% IF GOODS_VIEW_TYPE=10 %}
		 <ol class="products-list">


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

#7 Vaccina

Vaccina

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

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

Отправлено 26 Март 2014 - 02:28

попробуйте сл.вариант, в шаблоне Товары найдите:
{% FOR goods %}
				<li class="item">
				  <div class="product-box">
					<table class="product-image">
					  <tr>
перед ним вставьте:
<li class="item">
<!-- Каталог товаров -->
						 <div class="menu_main">
						 <span class="link_nav"></span><a href="#" class="link_nav">Каталог</a>
						 <a href="{CATALOG_URL}" title="Каталог" style="text-decoration: none"><h4 class="hidden-phone">Каталог</h4></a>
						 {%IFNOT catalog_full_empty%}
								 {%FOR catalog_full%}
								 {% IF catalog_full.FIRST %}<ul>{% ENDIF %}
								 <li {% IF catalog_full.CURRENT %}class="open"{% ELSEIF catalog_full.CURRENT_PARENT %}class="open"{% ENDIF %}{% IF catalog_full.HIDE %} style="display:none;"{% ENDIF %}>
										 <a href="{catalog_full.URL}"{% IF catalog_full.CURRENT %}class="selected"{% ENDIF %}>{catalog_full.NAME}</a><span class="icons"{% IFNOT catalog_full.ISSET_SUB %}style="display: none;"{% ENDIF %}></span>
								 {% 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%}
						 </div>
						 <!-- /Каталог товаров -->
</li>


#8 bg999

bg999

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

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

Отправлено 26 Март 2014 - 11:57

Просмотр сообщенияVaccina (26 Март 2014 - 02:28) писал:

попробуйте сл.вариант, в шаблоне Товары найдите:
{% FOR goods %}
			 <li class="item">
				 <div class="product-box">
				 <table class="product-image">
					 <tr>
перед ним вставьте:
<li class="item">
<!-- Каталог товаров -->
						 <div class="menu_main">
						 <span class="link_nav"></span><a href="#" class="link_nav">Каталог</a>
						 <a href="{CATALOG_URL}" title="Каталог" style="text-decoration: none"><h4 class="hidden-phone">Каталог</h4></a>
						 {%IFNOT catalog_full_empty%}
								 {%FOR catalog_full%}
								 {% IF catalog_full.FIRST %}<ul>{% ENDIF %}
								 <li {% IF catalog_full.CURRENT %}class="open"{% ELSEIF catalog_full.CURRENT_PARENT %}class="open"{% ENDIF %}{% IF catalog_full.HIDE %} style="display:none;"{% ENDIF %}>
										 <a href="{catalog_full.URL}"{% IF catalog_full.CURRENT %}class="selected"{% ENDIF %}>{catalog_full.NAME}</a><span class="icons"{% IFNOT catalog_full.ISSET_SUB %}style="display: none;"{% ENDIF %}></span>
								 {% 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%}
						 </div>
						 <!-- /Каталог товаров -->
</li>


Сделал но что то опять не так, результат осатвил на сайте чтобы вы могли посмотреть. Что можно еще попробовать? и нужно чтобы отодвигались и фильтры и хлебные крошки как показанно на рисунке

Изображение

#9 Castiel

Castiel

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

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

Отправлено 26 Март 2014 - 16:07

Просмотр сообщенияbg999 (26 Март 2014 - 11:57) писал:

Сделал но что то опять не так, результат осатвил на сайте чтобы вы могли посмотреть. Что можно еще попробовать? и нужно чтобы отодвигались и фильтры и хлебные крошки как показанно на рисунке

Изображение

Здравствуйте, для того чтобы отображать боковой каталог товаров во всех категориях выполните данную инструкцию

Редактируем шаблон HTML
Находим
	   <!-- Правый блок. Контент сайта -->
	  <div class="main-container col1-layout">
		<div class="main">

Заменяем на
	  <div class="main-container col1-layout">
		  {% IF MOD_LNAME = catalog %}
												 <!-- Каталог товаров -->
												 <div class="menu_main">
												 <span class="link_nav"></span><a href="#" class="link_nav">Каталог</a>
												 <a href="{CATALOG_URL}" title="Каталог" style="text-decoration: none"><h4 class="hidden-phone">Каталог</h4></a>
												 {%IFNOT catalog_full_empty%}
																 {%FOR catalog_full%}
																 {% IF catalog_full.FIRST %}<ul>{% ENDIF %}
																 <li {% IF catalog_full.CURRENT %}class="open"{% ELSEIF catalog_full.CURRENT_PARENT %}class="open"{% ENDIF %}{% IF catalog_full.HIDE %} style="display:none;"{% ENDIF %}>
																				 <a href="{catalog_full.URL}"{% IF catalog_full.CURRENT %}class="selected"{% ENDIF %}>{catalog_full.NAME}</a><span class="icons"{% IFNOT catalog_full.ISSET_SUB %}style="display: none;"{% ENDIF %}></span>
																 {% 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%}
												 </div>
												 <!-- /Каталог товаров -->
												 {% ENDIF %}
		{% IF MOD_LNAME = catalog %}
		<div class="main" style="float:right;width:760px">
		{% ELSE %}
		<div class="main">
		{% ENDIF %}





Панель администратора, "Сайт"->"Редактор шаблонов".
В файле "Товары".
Удалить код:
			<li class="item">
<!-- Каталог товаров -->
												 <div class="menu_main">
												 <span class="link_nav"></span><a href="#" class="link_nav">Каталог</a>
												 <a href="{CATALOG_URL}" title="Каталог" style="text-decoration: none"><h4 class="hidden-phone">Каталог</h4></a>
												 {%IFNOT catalog_full_empty%}
																 {%FOR catalog_full%}
																 {% IF catalog_full.FIRST %}<ul>{% ENDIF %}
																 <li {% IF catalog_full.CURRENT %}class="open"{% ELSEIF catalog_full.CURRENT_PARENT %}class="open"{% ENDIF %}{% IF catalog_full.HIDE %} style="display:none;"{% ENDIF %}>
																				 <a href="{catalog_full.URL}"{% IF catalog_full.CURRENT %}class="selected"{% ENDIF %}>{catalog_full.NAME}</a><span class="icons"{% IFNOT catalog_full.ISSET_SUB %}style="display: none;"{% ENDIF %}></span>
																 {% 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%}
												 </div>
												 <!-- /Каталог товаров -->
</li>



Панель администратора, "Сайт"->"Редактор шаблонов".
В файле "main.css".
Найти код:
.col1-layout .products-grid { width:970px; margin-top:10px; }
Заменить:
.col1-layout .products-grid { width:100%; margin-top:10px; }



Панель администратора, "Сайт"->"Редактор Шаблонов".
В конец файла "main.css".
Добавить код:
.menu_main {
  float:left;
  width:180px;
}


#10 bg999

bg999

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

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

Отправлено 01 Апрель 2014 - 19:36

Просмотр сообщенияCastiel (26 Март 2014 - 16:07) писал:

Здравствуйте, для того чтобы отображать боковой каталог товаров во всех категориях выполните данную инструкцию

Редактируем шаблон HTML
Находим
	 <!-- Правый блок. Контент сайта -->
	 <div class="main-container col1-layout">
	 <div class="main">

Заменяем на
	 <div class="main-container col1-layout">
		 {% IF MOD_LNAME = catalog %}
												 <!-- Каталог товаров -->
												 <div class="menu_main">
												 <span class="link_nav"></span><a href="#" class="link_nav">Каталог</a>
												 <a href="{CATALOG_URL}" title="Каталог" style="text-decoration: none"><h4 class="hidden-phone">Каталог</h4></a>
												 {%IFNOT catalog_full_empty%}
																 {%FOR catalog_full%}
																 {% IF catalog_full.FIRST %}<ul>{% ENDIF %}
																 <li {% IF catalog_full.CURRENT %}class="open"{% ELSEIF catalog_full.CURRENT_PARENT %}class="open"{% ENDIF %}{% IF catalog_full.HIDE %} style="display:none;"{% ENDIF %}>
																				 <a href="{catalog_full.URL}"{% IF catalog_full.CURRENT %}class="selected"{% ENDIF %}>{catalog_full.NAME}</a><span class="icons"{% IFNOT catalog_full.ISSET_SUB %}style="display: none;"{% ENDIF %}></span>
																 {% 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%}
												 </div>
												 <!-- /Каталог товаров -->
												 {% ENDIF %}
	 {% IF MOD_LNAME = catalog %}
	 <div class="main" style="float:right;width:760px">
	 {% ELSE %}
	 <div class="main">
	 {% ENDIF %}





Панель администратора, "Сайт"->"Редактор шаблонов".
В файле "Товары".
Удалить код:
<li class="item">
<!-- Каталог товаров -->
<div class="menu_main">
<span class="link_nav"></span><a href="#" class="link_nav">Каталог</a>
<a href="{CATALOG_URL}" title="Каталог" style="text-decoration: none"><h4 class="hidden-phone">Каталог</h4></a>
{%IFNOT catalog_full_empty%}
{%FOR catalog_full%}
{% IF catalog_full.FIRST %}<ul>{% ENDIF %}
<li {% IF catalog_full.CURRENT %}class="open"{% ELSEIF catalog_full.CURRENT_PARENT %}class="open"{% ENDIF %}{% IF catalog_full.HIDE %} style="display:none;"{% ENDIF %}>
<a href="{catalog_full.URL}"{% IF catalog_full.CURRENT %}class="selected"{% ENDIF %}>{catalog_full.NAME}</a><span class="icons"{% IFNOT catalog_full.ISSET_SUB %}style="display: none;"{% ENDIF %}></span>
{% 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%}
</div>
<!-- /Каталог товаров -->
</li>



Панель администратора, "Сайт"->"Редактор шаблонов".
В файле "main.css".
Найти код:
.col1-layout .products-grid { width:970px; margin-top:10px; }
Заменить:
.col1-layout .products-grid { width:100%; margin-top:10px; }



Панель администратора, "Сайт"->"Редактор Шаблонов".
В конец файла "main.css".
Добавить код:
.menu_main {
float:left;
width:180px;
}


Спасибо получилось) а подскажите как сделать что бы это боковое меню так же отображалось на странице ПОИСКа?

#11 Vaccina

Vaccina

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

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

Отправлено 02 Апрель 2014 - 04:36

В шаблоне HTML найдите:
{% IF MOD_LNAME = catalog %}
Попробуйте заменить на:
{% IF MOD_LNAME = catalog && MOD_LNAME = search %}


#12 bg999

bg999

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

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

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

Просмотр сообщенияVaccina (02 Апрель 2014 - 04:36) писал:

В шаблоне HTML найдите:
{% IF MOD_LNAME = catalog %}
Попробуйте заменить на:
{% IF MOD_LNAME = catalog && MOD_LNAME = search %}


когда меняю в поиске вообще ноль реакций (нечего не меняется), а в каталоге все смещается и левая колонка пропадает, что можно еще попробовать?

#13 Castiel

Castiel

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

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

Отправлено 05 Апрель 2014 - 10:43

Просмотр сообщенияbg999 (03 Апрель 2014 - 18:51) писал:

когда меняю в поиске вообще ноль реакций (нечего не меняется), а в каталоге все смещается и левая колонка пропадает, что можно еще попробовать?

Попробуйте такой вариант

В шаблоне "HTML"
Находим:
{% IF MOD_LNAME = catalog%}

Заменяем на:
{% IF MOD_LNAME = catalog || MOD_LNAME = search %}
				  <style>
					.main {margin: 0;width: 80%;float: right;}
				  </style>


#14 bg999

bg999

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

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

Отправлено 06 Апрель 2014 - 17:24

Просмотр сообщенияCastiel (05 Апрель 2014 - 10:43) писал:

Попробуйте такой вариант

В шаблоне "HTML"
Находим:
{% IF MOD_LNAME = catalog%}

Заменяем на:
{% IF MOD_LNAME = catalog || MOD_LNAME = search %}
<style>
.main {margin: 0;width: 80%;float: right;}
</style>


Получилось) Спасибо!

#15 bg999

bg999

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

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

Отправлено 17 Апрель 2014 - 20:33

Добрый день! Вот делаем еще один магазин и решили немного поменять дизайн. Адрес сайта http://a22391.storeland.ru/ Помогите пожалуйста и овьете на пару вопросов:

1. Как в хедере сделать так чтобы серое поле продлилось с двух сторон
Речь идет о меню, на рисунке ниже есть ДО и нужно сделать как на варианте ПОСЛЕ

Изображение


2. Как сделать так чтобы выпадающее меню на каждой кнопке открывалось с самого начала а не так как сейчас? На рисунке ниже тоже показано ДО и ПОСЛЕ (какой результат нужен)
Изображение

#16 Сake

Сake

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

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

Отправлено 18 Апрель 2014 - 02:08

1. Найдите в шаблоне "HTML" строку

<div class="wrapper">

и замените её на

<div class="wrapper">
  <div class="menu-line"></div>

после в файл стилей main.css добавьте

.menu-line {
  position: absolute;
  left: 0px;
  right: 0px;
  background: #848891;
  top: 75px;
  height: 47px;
}

2. Добавьте в файл стилей main.css

.mymenu #nav {
  position: relative !important;
}
.mymenu #nav li {
  position: static !important;
}

Так как у вас стрелка реализована в виде статичного изображение - при таком изменении будут наблюдаться проблема с отображением направляющей стрелки. После применения данных стилей можно будет изменить отображение стрелки путем использования стилей вместо статичного изображения.

#17 bg999

bg999

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

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

Отправлено 18 Апрель 2014 - 11:06

Просмотр сообщенияСake (18 Апрель 2014 - 02:08) писал:

1. Найдите в шаблоне "HTML" строку

<div class="wrapper">

и замените её на

<div class="wrapper">
<div class="menu-line"></div>

после в файл стилей main.css добавьте

.menu-line {
position: absolute;
left: 0px;
right: 0px;
background: #848891;
top: 75px;
height: 47px;
}

2. Добавьте в файл стилей main.css

.mymenu #nav {
position: relative !important;
}
.mymenu #nav li {
position: static !important;
}

Так как у вас стрелка реализована в виде статичного изображение - при таком изменении будут наблюдаться проблема с отображением направляющей стрелки. После применения данных стилей можно будет изменить отображение стрелки путем использования стилей вместо статичного изображения.


Спасибо получилось) А скажите пожалуйста как реализовать стрелку с помощью стилей?

#18 Castiel

Castiel

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

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

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

Просмотр сообщенияbg999 (18 Апрель 2014 - 11:06) писал:

Спасибо получилось) А скажите пожалуйста как реализовать стрелку с помощью стилей?

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

#19 Сake

Сake

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

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

Отправлено 19 Апрель 2014 - 04:04

Найдите и удалите в вашем шаблоне "HTML" следующий код

<tr>
	 <td colspan="8"><img alt="" src="http://st.nioxinshop.ru/8/1050/215/top.png" style="width: 951px; height: 27px; margin-top: 3px;" /></td>
	 </tr>

далее найдите ссылки меню для которых нет вложенных элементов (только один уровень), например

<a href="http://academie-shop.ru/page/dostavka" title="" style="padding-left: 35px; padding-top: 17px;">ТЕЛО</a>

и добавьте данной ссылке класс .notsub, должно получиться так

<a class="notsub" href="http://academie-shop.ru/page/dostavka" title="" style="padding-left: 35px; padding-top: 17px;">ТЕЛО</a>

далее в файл стилей main.css добавьте следующие стили

#nav > li > a {
  height: 37px;
  position: relative;
}
#nav > li:not(:first-child) a:not(.notsub):before {
  border-bottom: 15px solid #FFF;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  top: 40px;
  content: " ";
  display: none;
  height: 0;
  left: 50%;
  margin-left: 10px;
  position: absolute;
  right: 50%;
  width: 0;
  z-index: 2;
}
#nav > li:not(:first-child) a:hover:not(.notsub):before,
#nav > li:not(:first-child).active a:not(.notsub):before {
  display: block !important;
}

далее в файл main.js добавьте код

$('#nav > li').hover(function() {
	 $(this).addClass('active');
}, function() {
	 $(this).removeClass('active');
});


#20 bg999

bg999

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

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

Отправлено 22 Апрель 2014 - 18:31

Просмотр сообщенияСake (19 Апрель 2014 - 04:04) писал:

Найдите и удалите в вашем шаблоне "HTML" следующий код

<tr>
	 <td colspan="8"><img alt="" src="http://st.nioxinshop.ru/8/1050/215/top.png" style="width: 951px; height: 27px; margin-top: 3px;" /></td>
	 </tr>

далее найдите ссылки меню для которых нет вложенных элементов (только один уровень), например

<a href="http://academie-shop.ru/page/dostavka" title="" style="padding-left: 35px; padding-top: 17px;">ТЕЛО</a>

и добавьте данной ссылке класс .notsub, должно получиться так

<a class="notsub" href="http://academie-shop.ru/page/dostavka" title="" style="padding-left: 35px; padding-top: 17px;">ТЕЛО</a>

далее в файл стилей main.css добавьте следующие стили

#nav > li > a {
height: 37px;
position: relative;
}
#nav > li:not(:first-child) a:not(.notsub):before {
border-bottom: 15px solid #FFF;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
top: 40px;
content: " ";
display: none;
height: 0;
left: 50%;
margin-left: 10px;
position: absolute;
right: 50%;
width: 0;
z-index: 2;
}
#nav > li:not(:first-child) a:hover:not(.notsub):before,
#nav > li:not(:first-child).active a:not(.notsub):before {
display: block !important;
}

далее в файл main.js добавьте код

$('#nav > li').hover(function() {
	 $(this).addClass('active');
}, function() {
	 $(this).removeClass('active');
});


Спасибо, помогите немного доработать. Ниже картинка и на ней изображено что есть сейчас и чего хотелось бы добиться.

Изображение




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

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