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

[ARGO]

shnafix это не вариант.
Надо так чтобы размер иконок увеличился эквивалентно освобожденному месту. не знаю как вам еще объяснить. так чтобы вместо 5 были 3 но чтобы они занимали столько же места. были крупней значит.

[Absolem]

Примените изменения от поста #60
Далее в Сайт->Редактор шаблонов найдите код -

<div class="goodsListItemBlock withBorder cornerAll">

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

<div class="goodsListItemBlock withBorder cornerAll" style="width:300px; height:300px;">

Далее зайдите в Настройки->Основные в пункте "Изображения товаров" измените Максимальный размер по высоте/ширине в пикселях для маленьких изображений

[ARGO]

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

[Koderhan]

s891432 (23 Сентябрь 2013 - 19:00) писал:

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

Сделать растягивающиеся блоки товара в зависемости от количетства товаров на странице к сожалению нельзя.
Можно вернуть отображение каталога в изначальное положение.

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

/* Страница категории. ячейки с товаром relative */
.goodsListItem {vertical-align:top;width:200px;overflow:hidden;padding:0px;} /* Размер в 200 пикселей сделан, чтобы и 2 и 5 товаров нормально смотрелись и была возможность увеличить разрешение до 1220 пикселей*/
.goodsListItemBlock {
background: #FFFFFF;
height: 200px;
margin: 5px;
overflow: hidden;
text-align: center;
position: relative;
}
.goodsListItemName {font-size:14px;text-align:center;max-height:3.8em;overflow:hidden;}
.goodsListItemImage {height:100px;margin-top: 1em}
.goodsListItemPrice {margin-top:10px;}
/* Страница категории. Текстовый блок*/

Заменить:

/* Страница категории. ячейки с товаром */
.goodsListItem {vertical-align:top;width:200px;overflow:hidden;padding:0px;} /* Размер в 200 пикселей сделан, чтобы и 2 и 5 товаров нормально смотрелись и была возможность увеличить разрешение до 1220 пикселей*/
.goodsListItemBlock {height:200px;margin:5px;text-align:center;overflow:hidden;}
.goodsListItemName {font-size:14px;text-align:center;max-height:3.8em;overflow:hidden;}
.goodsListItemImage {height:100px;margin-top: 1em}
.goodsListItemPrice {margin-top:10px;}
/* Страница категории. Текстовый блок*/

Код:

.goodsListItemImage							  {height:100px;margin-top:  1em}

Заменить:

.goodsListItemImage							  {height: 230px;margin-top:  1em}

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

[ARGO]

сопли

Скрытый текст

Спасибо! все указанное Вами внес вроде полегче, только вот размеры внутри блока у товаров разные. Не учто никак нельзя их сделать одинаковыми? Ну исключая вариант заливать все одинакового размера?

надо создавать черновой сайтик у вас и там эксперементировать. теперь хочу вернуть все обратно а там ужас. надеюсь куки но хз

1) текста с названием товара и ценой вообще нет.
2) картинки и при пяти в ряд не равномерные (как раньше) (первая больше вторая менше)

PS: делаю как было но не то получается

Вернуло вообщем как было остался вопрос к Кодерхану.

.goodsListItemBlock {
background: #FFFFFF;
height: 200px;
margin: 5px;
overflow: hidden;
text-align: center;
position: relative;
}

.goodsListItemBlock {height:200px;margin:5px;text-align:center;overflow:hidden;}

первый на второй для чего менять? что изменится кроме фона не пойму?  картинки будут быстрей грузится? или лаг с полоской будет мультилагом с мелкими картинками?

и
.goodsListItemImage    {height:230px;margin-top:  1em}

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

[ARGO]

Если чуш спрашиваю ткните где почитать (ветка форума или еще где)
заранее благодарен!

Тоесть не реально сделать по три товара вряд вместо пяти? чтобы это нормально смотрелось на любом экране (планшет). Большие картинки больше привлекают покупателей

[Vaccina]

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

.goodsListItemBlock {
background: #FFFFFF;
height: 200px;
margin: 5px;
overflow: hidden;
text-align: center;
position: relative;
}

и

.goodsListItemImage	{height:230px;margin-top:  1em}

во втором классе задается внешний отступ в размере 1em. В первом классе убирается фон, задается выравнивание по центру внутри блока (text-align: center;) и задается относительное позиционирование внутри блока (position: relative;).

В вашем случае наверно лучше сделать блоки динамическими относительно сетки. Т.е чтобы в ряд помещалось такое количество товаров - какое это возможно для блока. Когда возможно помещается 3 на строку, или 5, 6, 7 товаров в строку в зависимости от ширины экрана. Своеобразное подобие резины.

[Koderhan]

s891432 (23 Сентябрь 2013 - 21:57) писал:

Если чуш спрашиваю ткните где почитать (ветка форума или еще где)
заранее благодарен!

Тоесть не реально сделать по три товара вряд вместо пяти? чтобы это нормально смотрелось на любом экране (планшет). Большие картинки больше привлекают покупателей

Можно сделать заполнение всего блока товарами переделав таблицу в список.
В файле "Товары" код:

<!-- Если есть товары -->
		  {% ELSE %}
			{% FOR goods %}
			<td class="goodsListItem"> 
				<div class="goodsListItemBlock withBorder cornerAll">
				<div class="goodsListItemImage"><a href="{goods.URL}"><img class="goods-image-small" src="{% IF goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-small.png{% ELSE %}{goods.IMAGE_SMALL}{% ENDIF %}" alt="{goods.NAME}" /></a></div>
				<h3 class="goodsListItemName"><a href="{goods.URL}">{goods.NAME}</a></h3>
				<div class="goodsListItemPriceNew">
				  <a href="{goods.URL_MIN_PRICE_NOW}">{goods.MIN_PRICE_NOW | money_format}</a>
				</div> 
				<div class="goodsListItemPriceOld">
				  {% IF goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT>goods.MIN_PRICE_NOW %}
					  <a href="{goods.URL_MIN_PRICE_NOW_WITHOUT_DISCOUNT}" class="lineThrough">{goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT | money_format}</a>
					{% ELSEIF goods.MIN_PRICE_OLD>goods.MIN_PRICE_NOW %}
					  <a href="{goods.URL_MIN_PRICE_OLD}" class="lineThrough">{goods.MIN_PRICE_OLD | money_format}</a>
					{% ENDIF %}
				</div>
				</div>
			  </td>
			{% IFNOT goods.last %}{goods.index | is_divided("5","</tr><tr>","")}{% ENDIF %}
		   {% ENDFOR goods %}
		 {% ENDIF %}

Заменить:

<!-- Если есть товары -->
		  {% ELSE %}
			<td>
			<ul class="list-tovar">
			{% FOR goods %}
			<li class="goodsListItem"> 
				<div class="goodsListItemBlock withBorder cornerAll">
				<div class="goodsListItemImage"><a href="{goods.URL}"><img class="goods-image-small" src="{% IF goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-small.png{% ELSE %}{goods.IMAGE_SMALL}{% ENDIF %}" alt="{goods.NAME}" /></a></div>
				<h3 class="goodsListItemName"><a href="{goods.URL}">{goods.NAME}</a></h3>
				<div class="goodsListItemPriceNew">
				  <a href="{goods.URL_MIN_PRICE_NOW}">{goods.MIN_PRICE_NOW | money_format}</a>
				</div> 
				<div class="goodsListItemPriceOld">
				  {% IF goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT>goods.MIN_PRICE_NOW %}
					  <a href="{goods.URL_MIN_PRICE_NOW_WITHOUT_DISCOUNT}" class="lineThrough">{goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT | money_format}</a>
					{% ELSEIF goods.MIN_PRICE_OLD>goods.MIN_PRICE_NOW %}
					  <a href="{goods.URL_MIN_PRICE_OLD}" class="lineThrough">{goods.MIN_PRICE_OLD | money_format}</a>
					{% ENDIF %}
				</div>
				</div>
			  </li>
		   {% ENDFOR goods %}
			</ul>
			</td>
		 {% ENDIF %}

В файле "main.css".
Добавить в конец файла код:

.goodsListItem {
	float: left;
}

[ARGO]

.goodsListItem {
float: left;
}


с этим кодом товары идут
4
1
4
1
без кода идут по одному, но размер остается прежний, а увеличить картинку и сделать по одной в ряд можно и с помощью способов предложенных предыдущими ораторами.

Vaccina


Это разные размеры будут у товаров? так это ужас же.

Скрытый текст

(очень хочется сделать по три и чтобы хорошо вот и накрыла вторая волна меня)

[Vaccina]

Размеры будут одинаковые, просто товары будут заполнять собой сетку.

Цитата

без кода идут по одному, но размер остается прежний

Пожалуйста, приведите пример использования вами кода из сообщения модератора http://forum.storela...__60#entry91388
Возможно не хватает каких-то стилей для выравнивания блоков.

[ARGO]

Vaccina

Ура Вы меня правильно поняли и теперь то что надо. Осталось только цену чуть ниже опустить.
Вопрос снят. опустил пониже сам.

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

• 

[ARGO]

Сопутствующие по три сделал а как теперь их раширить аналогично каталогу?

[ne_yana]

Добрый вечер, найдите в файле main.css

.goodsListItem {
vertical-align: top;
width: 200px;
overflow: hidden;
padding: 0px;
}

и изменяйте свойство width.

Чтобы изменить высоту, найдите

.goodsListItemBlock {
background: #FFFFFF;
height: 200px;
margin: 5px;
overflow: hidden;
text-align: center;
position: relative;
}

и изменяйте height.

[ARGO]

ne_yana


Спасибо! Разжевали.

[ARGO]

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

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

• 

[Vaccina]

Попробуйте обновить кэш в вашем браузере.

[ARGO]

Vaccina

Да проблема решилась. Спасибо!

[ARGO]

Внимание! Отсутствует тег META NAME=SUBJECT. Используйте этот тег для описания тематики своего сайта для поисковых систем.
Внимание! Отсутствует тег META NAME=ABSTRACT. Используйте этот тег для описания своего сайта для поисковых систем.
Внимание! Отсутствует тег META NAME=ROBOTS. Используйте этот тег для управления индексацией в поисковиках.
Вот что написали на одном из анализаторов. Критично отсутствие этих тэгов?

[CrazyCat]

s891432 (07 Октябрь 2013 - 00:02) писал:

Внимание! Отсутствует тег META NAME=SUBJECT. Используйте этот тег для описания тематики своего сайта для поисковых систем.
Внимание! Отсутствует тег META NAME=ABSTRACT. Используйте этот тег для описания своего сайта для поисковых систем.
Внимание! Отсутствует тег META NAME=ROBOTS. Используйте этот тег для управления индексацией в поисковиках.
Вот что написали на одном из анализаторов. Критично отсутствие этих тэгов?

Добрый день!
По этому вопросу предлагаю Вам ознакомится со следующей статьей

[ARGO]

CrazyCat

Благодарствую!