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

[Equator]

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

[lew]

скажите аккаунт вашего сайта.

[Equator]

SL295195

[lew]

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

насчет текста "каталог товаров"
чтоб его удалить, вам нужно в админке открыть файл HTML
И найди там код

<td class="content_catalog cont250">
<!-- Каталог -->
<div class="pad-box">
<ul class="leftmenu">
<li class="categories"><h2><a href="{CATALOG_URL}" class="indexPage">Каталог товаров</a></h2>
<ul>
{%IFNOT catalog_empty %}
{% FOR catalog %}
{% IFNOT catalog.HIDE %}
<li class="cat-item">
<a href="{catalog.URL}"
{% IF catalog.LEVEL>0%}style="padding-left:{catalog.LEVEL | multiply("20")}px"{% ENDIF %}
{% IF catalog.CURRENT %}class="selected"{% ENDIF %}
>{catalog.NAME}</a>
</li>
{% ENDIF %}
{% ENDFOR %}
{% ENDIF %}
</ul><br />
</li>

и удалите в этом коде следующие

<h2><a href="{CATALOG_URL}" class="indexPage">Каталог товаров</a></h2>

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

• 

[Equator]

Контакты просто не успел перенести пока. Потом сделаю.
Сравнение и наличие товаров оставить на месте.
А категории нужно разместить внизу шапки в серое меню.

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

• 

[Сake]

Цитата

Контакты просто не успел перенести пока. Потом сделаю.

Для перемещения контактов - найдите в файле стилей main.css

#contactInfo {
  font-size: 1.1em;
  left: 170px;
  position: absolute;
  top: 10px;
}

и замените на

#contactInfo {
  font-size: 1.1em;
  position: absolute;
  right: 0;
  top: 90px;
}

Цитата

А категории нужно разместить внизу шапки в серое меню.

Вы хотите реализовать выпадающее меню? или же у вас будет только один уровень навигации? Для переноса каталога можно воспользоваться информацией из темы форума http://forum.storela...аталогом-места/

[Equator]

Да, нужно выпадающее меню с одним уровнем. Тему, ссылку на которую вы дали, я изучал несколько часов, но честно говоря не совсем понял, как именно перенести каталог, а вернее категории в шапку и сделать меню каталога параллельным основному меню. Буду признателен, если поможете.

[Vaccina]

Добавьте пожалуйста номер аккаунта к себе в профиль форума.
В шаблоне HTML найдите:

<ul class="pad-box cont620" id="mainmenu">
		  {% FOR menu %}
			{% FOR header %}
			  {% FOR links %}
				<li><a href="{menu.header.links.URL}" {% IF menu.header.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %}>{menu.header.links.NAME}</a></li>
			  {% ENDFOR %}
			{% ENDFOR %}
		  {% ENDFOR %}
		</ul>

замените на:

<!-- Каталог товаров -->
  {%IFNOT catalog_full_empty%}
		{%FOR catalog_full%}
		  {% IF catalog_full.FIRST %}<ul id="nav">{% ENDIF %}
		  <li class="
				level{catalog_full.LEVEL}
				nav-{catalog_full.index}
				{% IF catalog_full.CURRENT %}active{% ELSEIF catalog_full.CURRENT_PARENT %}active{% ENDIF %}
				{% IF catalog_full.ISSET_SUB %}parent{% ENDIF %}
		  ">
				<a href="{catalog_full.URL}"><span>{catalog_full.NAME}</span></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%}
  <!-- /Каталог товаров -->

и далее по инструкции прописать код ниже остальных в файлах main.js и main.css

[Equator]

Сделал, как вы сказали, но получилось совсем не то... И основное меню пропало.

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

• 

[Vaccina]

Ранее был запрос на серой полоске сделать выпадающие категории, как поняла, вам это уже не нужно.
В этом случае делайте откат изменений - восстановите более ранний бэк ап в редакторе шаблонов.
Далее в HTML найдите:

<!-- Поиск -->
	  <div id="search">
		<form action="http://{NET_DOMAIN}/search" id="searchform" method="get">
		  <div>
			<input type="text"  value="{% IF SEARCH_QUERY %}{SEARCH_QUERY}{%ELSE%}Поиск{%ENDIF%}" onblur="this.value=(this.value=='') ? 'Поиск' : this.value;" onfocus="this.value=(this.value=='Поиск') ? '' : this.value;" id="s" class="search_box alignleft" name="q" />
			<input type="image" class="submit alignright" src="{ASSETS_IMAGES_PATH}search_but.gif" />
			<div class="clr"></div>
		  </div>
		</form>
	  </div>
	  <!-- end Поиск -->
	  <div class="clr"></div>

после него вставьте:

<!-- Каталог товаров -->
  {%IFNOT catalog_full_empty%}
				{%FOR catalog_full%}
				  {% IF catalog_full.FIRST %}<ul id="nav">{% ENDIF %}
				  <li class="
								level{catalog_full.LEVEL}
								nav-{catalog_full.index}
								{% IF catalog_full.CURRENT %}active{% ELSEIF catalog_full.CURRENT_PARENT %}active{% ENDIF %}
								{% IF catalog_full.ISSET_SUB %}parent{% ENDIF %}
				  ">
								<a href="{catalog_full.URL}"><span>{catalog_full.NAME}</span></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%}
  <!-- /Каталог товаров -->

далее зайдите в main.css и в самый низ вставьте:

#nav{
  position:absolute;
  left:0;
  top:100px;
}
#nav li{
  display:inline-block;
  position:relative;
  height:21px;
}
#nav li ul{display:none;}
#nav li:hover ul{
  display:block;
  position:absolute;
  left:0;
  top:20px;
}

[Equator]

Огромное спасибо и прошу прощения, наверное, изначально я не очень понятно объяснил. Не могли бы вы еще подсказать, как увеличить расстояние между категориями?

Сообщение отредактировал Equator: 06 Июнь 2014 - 02:39

[Сake]

Найдите в вашем файле стилей main.css следующий класс

#nav {
  font-family: OpenSans;
  left: 0;
  position: absolute;
  top: 185px;
}

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

#nav {
  bottom: 10px;
  font-family: OpenSans;
  left: 18px;
  position: absolute;
}

далее добавьте

#nav a {
  color: #a3a3a3;
  padding-right: 16px;
  text-decoration: none;
  white-space: nowrap;
}
#nav a:hover {
	color: #0099cc;
}
#header {
  height: 232px;
}
#cpages {
  top: 0 !important;
}

[Equator]

Все получилось, благодарю.

[Equator]

Еще такой вопрос, сейчас я сделал так, чтобы при наведении на эти категории курсором мыши, они выделялись и меняли внешний вид. Можно ли сделать так, чтобы при открытии определенной категории, она фиксировалась, т.е. менялся ее внешний вид, как при наведении курсора, но только постоянно, пока открыта эта категория?
И подскажите пожалуйста, как удалить уже не нужные мне категории справа?

[Vaccina]

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

#nav li:hover {
	background: url("http://wintermobile.storeland.net/ButtonForMenu.png") repeat-x scroll 0 0 rgba(0, 0, 0, 0);
	border-bottom: 3px solid #65ACE4;
	box-shadow: 0 0 4px #D9D9D9;
	color: #7C7C7C;
	transition-duration: 0.2s;
}
#nav a:hover {
	color: #65ACE4;
}

замените на:

#nav li:hover, #nav li.active {
	background: url("http://wintermobile.storeland.net/ButtonForMenu.png") repeat-x scroll 0 0 rgba(0, 0, 0, 0);
	border-bottom: 3px solid #65ACE4;
	box-shadow: 0 0 4px #D9D9D9;
	color: #7C7C7C;
	transition-duration: 0.2s;
}
#nav a:hover, #nav li.active a {
	color: #65ACE4;
}

Чтобы убрать каталог сбоку, в шаблоне HTML найдите и удалите:

<li class="categories"><h2><a href="{CATALOG_URL}" class="indexPage">Каталог товаров</a></h2>
					<ul>
					{%IFNOT catalog_empty %}
					  {% FOR catalog %}
						{% IFNOT catalog.HIDE %}
						  <li class="cat-item">
							<a href="{catalog.URL}"
							  {% IF catalog.LEVEL>0%}style="padding-left:{catalog.LEVEL | multiply("20")}px"{% ENDIF %}
							  {% IF catalog.CURRENT %}class="selected"{% ENDIF %}
							>{catalog.NAME}</a>
						  </li>
						{% ENDIF %}
					  {% ENDFOR %}
					{% ENDIF %}
					</ul><br />
				  </li>

[Equator]

Спасибо.

[Equator]

А как сделать такие же активные ссылки, только для главного меню, чтобы при переходе, например, на главную или страницу доставки, ссылка меняла цвет? Пытался сделать с помощью .active { }, но не получилось. Подскажите.

[Dars]

Equator (07 Июнь 2014 - 10:47) писал:

А как сделать такие же активные ссылки, только для главного меню, чтобы при переходе, например, на главную или страницу доставки, ссылка меняла цвет? Пытался сделать с помощью .active { }, но не получилось. Подскажите.

Добавьте в main.css строку:

#mainmenu .selected {color:black;}

где black - цвет ссылки.

[Equator]

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

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

• 
• 

[Vaccina]

Найдите:

#nav li:hover ul {
	display: block;
	left: 0;
	position: absolute;
	top: 20px;
}

замените на:

#nav li:hover ul {
	display: block;
	left: 0;
	position: absolute;
	top: 65px;
}
#nav ul li {
	display: block;
	height: auto;
	margin: 0;
	padding: 0;
	position: relative;
	background: #fff;
}
#nav ul li a {
	height: auto;
	padding: 10px;
}