Отключен JavaScript

У вас отключен JavaScript. Некоторые возможности системы не будут работать. Пожалуйста, включите JavaScript для получения доступа ко всем функциям.

Пару Вопросов По Каталогу

Автор Enalton, 15 нояб. 2013 14:25

каталог

Вперед

Авторизуйтесь для ответа в теме

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

#1 Enalton

Новичок

Пользователи
1 сообщений

Отправлено 15 Ноябрь 2013 - 14:25

Как выровнять товары в строчку, под цифрой 1, что бы они так не плясали ? И как изменить цвет зеленой вставки под цифрой 2, и сделать вместо кнопки купить, кнопку подробнее?

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

Наверх

#2 Koderhan

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

Модератоpы
6 227 сообщений

Отправлено 15 Ноябрь 2013 - 18:13

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

Панель администратора, "Сайт"->"Редактор шаблонов".
В файле "main.css".
Найти код:

.goodstable .title { width: 81%; background:url({ASSETS_IMAGES_PATH}goods-table-title-top.jpg) left top no-repeat; padding: 2% 0 0 18%; text-align: left;}

Заменить:

.goodstable .title { width: 81%; background:url({ASSETS_IMAGES_PATH}goods-table-title-top.jpg) left top no-repeat; padding: 2% 0 0 18%; text-align: left; height: 2.9em; overflow: hidden;}

Для изменения цвета под ценой.
Панель администратора, "Сайт"->"Редактор шаблонов".
В файле "main.css".
Добавить код:

.goodstable .maingoodstable .price {
width: 97.8%;
padding: 3.1% 0% 2.5% 0%;
-moz-border-radius: 0.6em;
-webkit-border-radius: 0.6em;
border-radius: 0.6em;
height: auto;
min-width: 185px;
background-color: green; /* цвет */
/*
Тут код градиента
*/
}

Генератор градиента http://www.css3facto...near-gradients/

Наверх

#3 Свят

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

Пользователи
246 сообщений

Отправлено 06 Декабрь 2013 - 21:07

Koderhan (15 Ноябрь 2013 - 18:13) писал:

.goodstable .title { width: 81%; background:url({ASSETS_IMAGES_PATH}goods-table-title-top.jpg) left top no-repeat; padding: 2% 0 0 18%; text-align: left;}

Заменить:

.goodstable .title { width: 81%; background:url({ASSETS_IMAGES_PATH}goods-table-title-top.jpg) left top no-repeat; padding: 2% 0 0 18%; text-align: left; height: 2.9em; overflow: hidden;}

Для изменения цвета под ценой.
Панель администратора, "Сайт"->"Редактор шаблонов".
В файле "main.css".
Добавить код:

.goodstable .maingoodstable .price {
width: 97.8%;
padding: 3.1% 0% 2.5% 0%;
-moz-border-radius: 0.6em;
-webkit-border-radius: 0.6em;
border-radius: 0.6em;
height: auto;
min-width: 185px;
background-color: green; /* цвет */
/*
Тут код градиента
*/
}

Генератор градиента http://www.css3facto...near-gradients/

Сделал как вы и сказали чтобы цены в каталоге не прыгали так.Ничего не изменилось все по прежнему(

Наверх

#4 Сake

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

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

Отправлено 07 Декабрь 2013 - 03:56

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

.goodstable .title a {
  display: block;
  height: 30px;
}
.goodstable .maingoodstable .text {
  height: 30px;
}
.goodstable .maingoodstable .img {
  height: 140px;
  overflow: hidden;
}
.goodstable .maingoodstable .price {
  height: 32px;
}

Наверх

#5 Свят

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

Пользователи
246 сообщений

Отправлено 07 Декабрь 2013 - 10:41

Да теперь всё в линию. Вот только фото получились срезанные внизу процентов на 15.
От этого можно как-нибудь уйти?

Наверх

#6 Castiel

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

Модераторы
3 519 сообщений

ГородНижний Новгород

Отправлено 07 Декабрь 2013 - 10:45

Свят (07 Декабрь 2013 - 10:41) писал:

Обновите эту часть

.goodstable .maingoodstable .img {
  height: 170px;
  overflow: hidden;
}

Наверх

#7 Свят

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

Пользователи
246 сообщений

Отправлено 07 Декабрь 2013 - 10:50

Всё равно не получается. Кое где чуток все равно срезано а в алкотестерах строчка купить вообще наполовину скрылась

Наверх

#8 Свят

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

Пользователи
246 сообщений

Отправлено 07 Декабрь 2013 - 11:00

ПРо алкотестеры я понял...они в акции поэтому и такой результат(((в Остальном везде строчки нормальные

Наверх

#9 Castiel

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

Модераторы
3 519 сообщений

ГородНижний Новгород

Отправлено 07 Декабрь 2013 - 11:00

Свят (07 Декабрь 2013 - 10:50) писал:

Обновите эту часть
Находим

.goodstable .maingoodstable .text {
height: 30px;
}

Заменяем

.goodstable .maingoodstable .text {
height: 100px;
}

Таким образом у вас будет отображаться весь текст описания, но у товаров с маленьким описанием будут отступы (пустые места)
Если такой вариант вам не понравиться, то верните старые значения

Наверх

#10 Свят

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

Пользователи
246 сообщений

Отправлено 07 Декабрь 2013 - 11:06

Castiel (07 Декабрь 2013 - 11:00) писал:

Вам необходимо сделать так чтобы было видно весть текст и всю картинку?

Цитата

.goodstable .maingoodstable .img {
height: 170px;
overflow: hidden;
}

И как сделать чтобы все изображения были по центру ячейки а то прижаты к верху все(

Наверх

#11 miyako

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

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

Отправлено 07 Декабрь 2013 - 13:06

Свят (07 Декабрь 2013 - 11:06) писал:

Нет краткий текст меня не интересует. Мне главное чтобы была картинка не обрезана(сейчас кое где встречаются чуть чуть обрезаны). Я так понимаю мне этот параметр еще увеличить?

И как сделать чтобы все изображения были по центру ячейки а то прижаты к верху все(

Центрирование изображение товаров по вертикали -
Найдите код в main.css -

.goodstable .maingoodstable .img {
height: 170px;
overflow: hidden;
}

и замените на -

.goodstable .maingoodstable .img {
height: 170px;
overflow: hidden;
line-height: 170px;
text-align: center;
}

Далее добавьте в конец main.css код -

.goodstable .maingoodstable .img img{
vertical-align: middle;
}

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

Наверх

#12 Свят

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

Пользователи
246 сообщений

Отправлено 07 Декабрь 2013 - 19:11

miyako (07 Декабрь 2013 - 13:06) писал:

Центрирование изображение товаров по вертикали -
Найдите код в main.css -

.goodstable .maingoodstable .img {
height: 170px;
overflow: hidden;
}

и замените на -

.goodstable .maingoodstable .img {
height: 170px;
overflow: hidden;
line-height: 170px;
text-align: center;
}

Далее добавьте в конец main.css код -

.goodstable .maingoodstable .img img{
vertical-align: middle;
}

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

Наверх

#13 Свят

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

Пользователи
246 сообщений

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

Здравствуйте.
Возможно подкатегории в котегорях расположить не так: как на первом рис., а как на втором?

Чтобы было примерно так же - картинка, краткое описание и перейти в каталог.

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

Наверх

#14 Vaccina

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

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

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

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

Для подобного отображения вам необходимо в шаблоне Товары найти сл.код:

<ul class="categoriesList">
		  {% FOR nested_categories_list %}
			  <li class="fleft tabproduct">
				  <div class="title fnt13 b txtalgncnt">
					<a style="color:#a6bf2d;" href="{nested_categories_list.URL}" title="Перейти к категории &laquo;{nested_categories_list.NAME}&raquo;">{nested_categories_list.NAME}</a>
				  </div>
				  <div class="img txtalgncnt categoriesListImg" >
					<a href="{nested_categories_list.URL}" title="Перейти на страницу &laquo;{nested_categories_list.NAME}&raquo;"><img {% IF nested_categories_list.IMAGE_EMPTY %}src="{ASSETS_IMAGES_PATH}no-photo-small.png" width="130"{% ELSE %}src="{nested_categories_list.IMAGE_MEDIUM}"{% ENDIF %} alt="{nested_categories_list.NAME}" /></a>
				  </div>
				  <div class="buttons txtalgncnt" style="margin-top:10px;">
					<a href="{nested_categories_list.URL}" class="orangebar" title="Перейти к категории &laquo;{nested_categories_list.NAME}&raquo;">Перейти в категорию</a>
				  </div>
			  </li>
			{% ENDFOR %}
		  </ul>

и заменить на:

<div class="goodsListBlock">
	{% FOR nested_categories_list %}
	  <div class="goodlist padd51 clr over">
		 <div class="title fnt12 fntarl clr fleftul">
		 <a href="{nested_categories_list.URL}" class="fleft" title="Перейти на страницу &laquo;{nested_categories_list.NAME}&raquo;">{nested_categories_list.NAME}</a>
		 </div>
		  <div class="goodlistmain over clr">
			  <div class="img txtalgncnt padd50 fleft">
			  <a href="{nested_categories_list.URL}">
				<img {% IF nested_categories_list.IMAGE_EMPTY %}src="{ASSETS_IMAGES_PATH}no-photo-medium.png" width="220"{% ELSE %}src="{nested_categories_list.IMAGE_SMALL}"{% ENDIF %} alt="{nested_categories_list.NAME}" />   
			  </a>
			</div>
			  <div class="priceblock fright">
					 <div class="price over">
							  <a class="orangebut fnt11 fntarl txtalgncnt fright fntupcase anone0" href="{nested_categories_list.URL}" title="Перейти к категории &laquo;{nested_categories_list.NAME}&raquo;">Подробнее</a>
					</div>
				  <ul class="links fnt11 fntupcase aunder"></ul>
			  </div>
			  <div class="goodinfo fnt11 fntarl fleft" style="text-overflow: ellipsis;"></div>
		  </div>
	   </div>
	   <div id="hr"></div>
	   {% ENDFOR goods %}
	   </div>

Наверх

#15 АвтоПрезенты.рф

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

Пользователи
42 сообщений

Отправлено 06 Февраль 2014 - 20:49

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

Наверх

#16 Castiel

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

Модераторы
3 519 сообщений

ГородНижний Новгород

Отправлено 06 Февраль 2014 - 21:14

АвтоПрезенты.рф (06 Февраль 2014 - 20:49) писал:

Редактируем шаблон Товары
Находим и вырезаем

{% IF CATEGORY_DESCRIPTION %}
	<div class="contenttext clr padd51">
	  <div class="title dinline fnt14 b fntarl padd51">{CATEGORY_NAME}</div>
		<div class="text txtalgnjsf fnt13 padd50 fntarl aunder">
		<div class="htmlDataBlock">
		  {CATEGORY_DESCRIPTION}
		</div>
	  <!-- Короткое SEO-описание -->
	  {% IF CATEGORY_SEO_DESCRIPTION_SHORT %}
	  <div class="htmlDataBlock">
		 {CATEGORY_SEO_DESCRIPTION_SHORT}
	  </div>
	  {% ENDIF %}
	  <!-- END Короткое SEO-описание -->
	 
	  <!-- Полное SEO-описание -->
	  {% IF CATEGORY_SEO_DESCRIPTION_LARGE %}
	  <div class="htmlDataBlock">
		  {CATEGORY_SEO_DESCRIPTION_LARGE}
	  </div>
	  {% ENDIF %}
	  <!-- END Полное SEO-описание -->
   </div>   
	</div>
{% ENDIF %}

Вырезанный код вставляем перед

Наверх

#17 АвтоПрезенты.рф

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

Пользователи
42 сообщений

Отправлено 06 Февраль 2014 - 22:04

Спасибо, все получилось как надо.

А как изменить цвет подкатегорий?

Наверх

#18 Castiel

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

Модераторы
3 519 сообщений

ГородНижний Новгород

Отправлено 06 Февраль 2014 - 22:14

АвтоПрезенты.рф (06 Февраль 2014 - 22:04) писал:

Спасибо, все получилось как надо.

А как изменить цвет подкатегорий?
Прикрепленный файл

цвет подкатегорий.jpg

Здравствуйте, редактируем main.css
Находим

.block .main.ullinks li a:hover {
background: url({ASSESTS_IMAGES_PATH}range-white.png) #be91cf center right no-repeat;
color: #fff;
}

#be91cf цвет при наведении

Изменяем цвет подменю
Редактируем шаблон HTML
Находим

<li class="{% IF catalog.LEVEL>0%}anone{% ENDIF %} {% IF catalog.CURRENT %}fnt12 b{% ENDIF %}"><a href="{catalog.URL}" {% IF catalog.LEVEL>0%}style="margin-left:15px; background:#be91cf; color:#fff;padding-left:{catalog.LEVEL | multiply("10")}px"{% ENDIF %}>{catalog.NAME}</a></li>

background:#be91cf; цвет фона

Наверх

#19 Свят

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

Пользователи
246 сообщений

Отправлено 09 Февраль 2014 - 18:01

Здравствуйте.
А возможно сделать чтобы изменялся цвет при наведении и у подменю.
Спасибо.

Наверх

#20 Сake

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

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

Отправлено 11 Февраль 2014 - 02:32

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

.block .main.ullinks li a:hover { background:url({ASSETS_IMAGES_PATH}range-white.png) #FFA54F center right no-repeat; color:#000000; }

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

.block .main.ullinks li a:hover { background:url({ASSETS_IMAGES_PATH}range-white.png) #FFA54F center right no-repeat !important; color:#000000; }

Наверх

Вперед

Обратно в Каталог товаров

Темы с аналогичным тегами каталог

Вопросы работы сервиса StoreLand → Другие вопросы → Проблема Со Ссылками При Переходе На Товар Из Меню Автор Гость_Goosenic_* , 26 янв. 2021 ссылки меню, товары, каталог	1 Ответ 1 062 Просмотров	stasia 26 янв. 2021
характеристики Вопросы работы сервиса StoreLand → Дизайн → Шаблон Техно → Каталог товаров → Вывод Характеристик В Товарах Отображаемых Таблицей Автор Гость_metry_* , 06 дек. 2020 характеристики, каталог, товары	0 Ответов 1 120 Просмотров	metry 06 дек. 2020
Вопросы работы сервиса StoreLand → Дизайн → Шаблон Веган → Как Изменить Разделы Каталога И Добавить Подразделы? Автор Гость_lazar_* , 14 июня 2020 каталог	2 Ответов 794 Просмотров	lazar 14 июня 2020
Вопросы работы сервиса StoreLand → Дизайн → Шаблон Город → Каталог товаров → Выравнивание По Нижнему Краю И Названия Категорий Автор Гость_Максим Бакланов_* , 11 февр. 2020 каталог	3 Ответов 1 486 Просмотров	Vaccina 12 февр. 2020
Вопросы работы сервиса StoreLand → Дизайн → Шаблон Техно → Главная → Изменение Ссылок И Текста На Блоках. Автор Гость_Galz_* , 20 апр. 2019 Менюблоки, каталог, ссылки	1 Ответ 1 774 Просмотров	Mr.Nito 21 апр. 2019