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


Вывод Товара В Виде Таблици

Автор nkzserg, 14 янв. 2012 18:03

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

#21 Vaccina

Vaccina

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

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

Отправлено 13 Апрель 2012 - 22:07

Проблема  в том, что у Вас весь блок идет в tr.
то есть сейчас Вам нужно этот код:
<!-- Список товаров. Список -->
<div style="border-radius:8px;background:#ccc;padding:5px;">
	  <table cellspacing="1" cellpadding="5" width="100%">
	   {% FOR goods %}

	   <tr>
			   <td style="vertical-align: top;border:1px solid #999;padding:2px;"><div class="goodsListItemImage"><a href="{goods.URL}"><img src="{% IF goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-small.png{% ELSE %}{goods.IMAGE_SMALL}{% ENDIF %}" alt="{goods.NAME}" /></a></div></td>
			   <td style="border:1px solid #999;padding:2px;">
				  <h3 class="goodsListItemName"><a href="{goods.URL}">{goods.NAME}</a></h3>
				  <div>{goods.DESCRIPTION_SHORT}</div>
			   </td>
			   <td style="vertical-align: top;border:1px solid #999;padding:2px;font-size:12px;"><a href="{goods.URL_MIN_PRICE_NOW}">{goods.MIN_PRICE_NOW | money_format}</a></td>
			   <td style="vertical-align: top;border:1px solid #999;padding:2px;font-size:12px;verti">
			   <div class="goodsListItemPriceNew">
				   <a href="{goods.URL_MIN_PRICE_NOW}">{goods.MIN_PRICE_NOW | money_format}</a>
				</div>
			   <div>
			  <form action="{CART_ADD_GOODS_MODIFICATION_URL | url_amp}" method="post" id="goodsListFormId{goods.MIN_PRICE_NOW_ID}" class="goodsListForm">
				<p>
				  <input type="hidden" name="hash" value="{HASH}" />
				  <input type="hidden" name="form[goods_from]" value="{goods.GOODS_FROM}" />
				  <input type="hidden" name="form[goods_mod_id]" value="{goods.MIN_PRICE_NOW_ID}" />
				  <a onclick="$('#goodsListFormId{goods.MIN_PRICE_NOW_ID}').submit(); return false;" href="{CART_ADD_GOODS_MODIFICATION_URL | url_amp}?hash={HASH | url_amp}&form%5Bgoods_from%5D={goods.GOODS_FROM}&form%5Bgoods_mod_id%5D={goods.MIN_PRICE_NOW_ID}" title="Положить &laquo;{goods.NAME}&raquo; в корзину">Положить в корзину</a>
			   </p>
			  </form>
			  </div>
		   </td>
		</tr>
	  {% ENDFOR goods %}
	  </table>
</div>
	  <!-- /Список товаров. Список -->
обернуть в <td></td> будет выглядеть вот так:
<td><!-- Список товаров. Список -->
<div style="border-radius:8px;background:#ccc;padding:5px;">
	  <table cellspacing="1" cellpadding="5" width="100%">
	   {% FOR goods %}

	   <tr>
			   <td style="vertical-align: top;border:1px solid #999;padding:2px;"><div class="goodsListItemImage"><a href="{goods.URL}"><img src="{% IF goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-small.png{% ELSE %}{goods.IMAGE_SMALL}{% ENDIF %}" alt="{goods.NAME}" /></a></div></td>
			   <td style="border:1px solid #999;padding:2px;">
				  <h3 class="goodsListItemName"><a href="{goods.URL}">{goods.NAME}</a></h3>
				  <div>{goods.DESCRIPTION_SHORT}</div>
			   </td>
			   <td style="vertical-align: top;border:1px solid #999;padding:2px;font-size:12px;"><a href="{goods.URL_MIN_PRICE_NOW}">{goods.MIN_PRICE_NOW | money_format}</a></td>
			   <td style="vertical-align: top;border:1px solid #999;padding:2px;font-size:12px;verti">
			   <div class="goodsListItemPriceNew">
				   <a href="{goods.URL_MIN_PRICE_NOW}">{goods.MIN_PRICE_NOW | money_format}</a>
				</div>
			   <div>
			  <form action="{CART_ADD_GOODS_MODIFICATION_URL | url_amp}" method="post" id="goodsListFormId{goods.MIN_PRICE_NOW_ID}" class="goodsListForm">
				<p>
				  <input type="hidden" name="hash" value="{HASH}" />
				  <input type="hidden" name="form[goods_from]" value="{goods.GOODS_FROM}" />
				  <input type="hidden" name="form[goods_mod_id]" value="{goods.MIN_PRICE_NOW_ID}" />
				  <a onclick="$('#goodsListFormId{goods.MIN_PRICE_NOW_ID}').submit(); return false;" href="{CART_ADD_GOODS_MODIFICATION_URL | url_amp}?hash={HASH | url_amp}&form%5Bgoods_from%5D={goods.GOODS_FROM}&form%5Bgoods_mod_id%5D={goods.MIN_PRICE_NOW_ID}" title="Положить &laquo;{goods.NAME}&raquo; в корзину">Положить в корзину</a>
			   </p>
			  </form>
			  </div>
		   </td>
		</tr>
	  {% ENDFOR goods %}
	  </table>
</div>
	  <!-- /Список товаров. Список --></td>

#22 romatex

romatex

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

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

Отправлено 14 Апрель 2012 - 08:17

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

#23 Vaccina

Vaccina

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

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

Отправлено 16 Апрель 2012 - 19:58

За подкаталоги отвечает код 

<!-- Блок навигации по категориям, вложенным в текущую категорию -->
				  <ul class="content_catalog_nested_categories">
					{% FOR nested_categories_list %}
					  <li>
						<div class="withBorder cornerAll" style="padding:1em">
						  <div><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"{% ELSE %}src="{nested_categories_list.IMAGE_MEDIUM}"{% ENDIF %} alt="{nested_categories_list.NAME}" /></a></div>
						  <a href="{nested_categories_list.URL}" title="Перейти к категории &laquo;{nested_categories_list.NAME}&raquo;">{nested_categories_list.NAME}</a>
						</div>
					  </li>
					{% ENDFOR %}
				  </ul>

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

Слайдер на странице у вас присутствует. Он сместился правее из-за разметки. А именно третьего
<td valign="top" align="left>
в таблице.

#24 romatex

romatex

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

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

Отправлено 17 Апрель 2012 - 08:48

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

#25 Vaccina

Vaccina

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

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

Отправлено 17 Апрель 2012 - 19:54

Так это выглядит в стандартном шаблоне "Мокко"

<p id="breadcrumb">Вы здесь: <a href="http://{NET_DOMAIN}/">Главная</a> 


<!-- Если отображаем полный каталог товаров, без указания категории -->
	  {% IF IS_FULL_CATALOG %}
		&gt; <strong>Каталог товаров</strong>
	  <!-- Если отображаем товары в категории -->
	  {% ELSE %}
		&gt; <a href="{CATALOG_URL}" >Каталог товаров</a> 
		{% FOR upper_navigation %}
		  {% IF upper_navigation.CURRENT %} &gt; <strong>{upper_navigation.NAME}</strong>{% ELSEIF upper_navigation.CURRENT_PARENT %} &gt; <a href="{upper_navigation.URL}" >{upper_navigation.NAME}</a>{% ENDIF %}
		{% ENDFOR %}
	  {% ENDIF %}
</p>

<h1>{CATEGORY_NAME}</h1>

<!-- Короткое SEO описание категории -->
{CATEGORY_SEO_DESCRIPTION_SHORT}

<table>
  
  <!-- Фильтры показываются только если есть товары в категории -->
  {% IFNOT goods_empty %}
	<!-- Дополнительная навигация для работы со списком товаров -->
	<tr>
	  <!-- Блок выбора параметра по которому производится сортировка списка товаров и возможность изменения лимитов выдачи -->
	  <td>
		<form action="">
		  <div>
			<!-- Список фильтров, которые сейчас действуют на результаты поиска -->
			{% FOR goods_filters %}
			  <input type="hidden" name="{goods_filters.NAME}" value="{goods_filters.VALUE}" />
			{% ENDFOR %}
	
			<!-- Поле выбора сортировки -->
			{% IF goods_show_order_fields %}
			  Сортировать по:
			  <select name="goods_search_field_id" onchange="this.form.submit();">
				{% FOR goods_order_fields %}
				  <option value="{goods_order_fields.ID}" {% IF goods_order_fields.SELECTED %}selected="selected"{% ENDIF %}>{goods_order_fields.NAME}</option>
				{% ENDFOR %}
			  </select>
			{% ENDIF %}
			
			<!-- Поле выбора лимитов -->
			{% IF goods_show_per_page %}
			  Показывать по:
			  <select name="per_page" onchange="this.form.submit();">
				{% FOR goods_per_page_list %}
				  <option value="{goods_per_page_list.LIMIT}" {% IF goods_per_page_list.SELECTED %}selected="selected"{% ENDIF %}>{goods_per_page_list.LIMIT}</option>
				{% ENDFOR %}
			  </select>
			{% ENDIF %}
		  </div>
		</form>
	  </td>
	  <!-- END Блок выбора параметра по которому производится сортировка списка товаров -->
	  
	  <!-- Страницы -->
	  <td class="alignRight">
		<div>
		  {% IF show_pages %}
		  <div class="square_pages">
			<span>Страницы: </span>
			  {% FOR goods_pages %}
				{% IF goods_pages.CURRENT %}
				  <b>{goods_pages.PAGE}</b>
				{% ELSE %}
				  <a href="{GOODS_PAGINATE_URL}&amp;page={goods_pages.PAGE}">{goods_pages.PAGE}</a>
				{% ENDIF %}
			  {% ENDFOR %}
		  </div>
		  {% ENDIF %}
		</div>
	  </td>
	  <!-- END Страницы -->
	</tr>
	<!-- END Дополнительная навигация для работы со списком товаров -->
  {% ENDIF %}
  <!-- END Фильтры показываются только если есть товары в категории -->
  
  <!-- Список товаров -->
  <tr>
	<td colspan="2">
	  <table style="padding:0px;margin:0px;">
		<tr>
		  
		  <!-- Если список товаров пуст -->
		  {% IF goods_empty %}
			<td>
			  <!-- Если не применено ни одного фильтра, значит в категории нет товаров -->
			  {% IF goods_filters_empty %}
			   
				<!-- Если в категории нет товаров, но есть категории, то отобразим их -->
				{%IFNOT nested_categories_list_empty %}
		  
				  <!-- Блок навигации по категориям, вложенным в текущую категорию -->
				  <ul class="content_catalog_nested_categories">
					{% FOR nested_categories_list %}
					  <li>
						<div class="withBorder cornerAll" style="padding:1em">
						  <div><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"{% ELSE %}src="{nested_categories_list.IMAGE_MEDIUM}"{% ENDIF %} alt="{nested_categories_list.NAME}" /></a></div>
						  <a href="{nested_categories_list.URL}" title="Перейти к категории &laquo;{nested_categories_list.NAME}&raquo;">{nested_categories_list.NAME}</a>
						</div>
					  </li>
					{% ENDFOR %}
				  </ul>
				  <br clear="all"/>

				<!-- Если в категории нет ни товаров, ни категорий то сообщим пользователю что ничего нет -->
				{% ELSE %}
				 <h3>Нет товаров в категории</h3>
				{% ENDIF %}
		  
			  <!-- Если производили фильтрацию товаров в категории -->
			  {% ELSE %}
				<h3>Нет товаров для выбранных условий</h3>
			  {% ENDIF %}
			</td>

		  <!-- Если есть товары -->
		  {% ELSE %}
			{% FOR goods %}
		  		<td class="goodsListItem">  
				<div class="goodsListItemBlock withBorder cornerAll">
		  			<div class="goodsListItemImage"><a href="{goods.URL}"><img 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("4","</tr><tr>","")}{% ENDIF %}
		  	{% ENDFOR goods %}
			{% ENDIF %}
		</tr>
	  </table>
	</td>
  </tr>
  <!-- END Список товаров -->
  
  <!-- Подвал таблицы со списком товаров -->
  <tr>
	<!-- Страницы -->
	<td colspan="2" class="alignRight">
	  <div>
		{% IF show_pages %}
		<div class="square_pages">
		  <span>Страницы: </span>
			{% FOR goods_pages %}
			  {% IF goods_pages.CURRENT %}
				<b>{goods_pages.PAGE}</b>
			  {% ELSE %}
				<a href="{GOODS_PAGINATE_URL}&amp;page={goods_pages.PAGE}">{goods_pages.PAGE}</a>
			  {% ENDIF %}
			{% ENDFOR %}
		</div>
		{% ENDIF %}
	  </div>
	</td>
	<!-- END Страницы -->
  </tr>
  <!-- END Подвал таблицы со списком товаров -->

</table>

<!-- Описание категории -->
<div class="htmlDataBlock">
  {CATEGORY_DESCRIPTION}
</div>

<!-- Полное SEO описание категории -->
<div class="htmlDataBlock">
  {CATEGORY_SEO_DESCRIPTION_LARGE}
</div>

Цитата

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

Вам необходимо удалить третий 

<td valign="top" align="left>

и перенести слайдер во второй. Далее можно через стили его немного отодвинуть правее. Например 

<div style="margin-left:40px;">код слайда</div>

#26 romatex

romatex

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

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

Отправлено 19 Апрель 2012 - 15:18

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

#27 Vaccina

Vaccina

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

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

Отправлено 19 Апрель 2012 - 21:54

Пожалуйста, приведите ваш полный шаблон "Товары" со всеми изменениями.

#28 romatex

romatex

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

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

Отправлено 20 Апрель 2012 - 07:21

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

#29 Vaccina

Vaccina

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

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

Отправлено 20 Апрель 2012 - 23:12

Проверила ваш шаблон "Товары". Он корректно работает. Т.е под категории выводятся нормально. Возможно проблема в чем-то другом. Пожалуйста, приведите ваш полный код шаблона "HTML". Так же проверьте правильность настроек в разделе Настройки -> Основные.

#30 mnbv2005

mnbv2005

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

  • Пользователи
  • PipPipPipPip
  • 201 сообщений
  • ГородМосква

Отправлено 22 Октябрь 2012 - 09:11

Добрый день!
Как сделать, чтобы товары выводилимь только таблицей, а вариант "списком" вообще удалить?

#31 Vaccina

Vaccina

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

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

Отправлено 22 Октябрь 2012 - 12:22

Вам необходимо удалить код выбора режима отображения 

<!-- Переключатель режима просмотра -->
			{% IF GOODS_VIEW_TYPE=2 %}
			  <strong title="Список товаров сейчас отображается в виде таблицы, по 2 товара на строку">Таблица</strong>&nbsp;
			  <a href="?goods_view_type=1" title="Отображать список товаров в виде списка">Список</a>
			{% ELSE %}
			  <a href="?goods_view_type=2" title="Отображать список товаров в виде таблицы с 2мя товарами на одну строку">Таблица</a>&nbsp;
			  <strong title="Список товаров сейчас отображается в виде списка, где один товар занимает одну строку">Список</strong>
			{% ENDIF %}
			<!-- /Переключатель режима просмотра -->

далее найти 

{% IF GOODS_VIEW_TYPE=1 %}

и заменить на 

{% IF GOODS_VIEW_TYPE=3 %}

После этого всегда будет идти отображение в виде таблицы.

#32 mnbv2005

mnbv2005

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

  • Пользователи
  • PipPipPipPip
  • 201 сообщений
  • ГородМосква

Отправлено 22 Октябрь 2012 - 21:11

хочу сделать товары по 4 в ряд, как это сделать я знаю, как ячейки и текст внутри тоже, а вот как уменьшить размер картинки не знаю! Пробовала через основные- не получается((
Как можно уменьшить картинки?

#33 Vaccina

Vaccina

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

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

Отправлено 23 Октябрь 2012 - 13:21

Картинки изменяются через раздел Настройки -> Основные, другое дело если необходимо изменить размер блока с изображением - это делается уже в файле стилей main.css в классе 

.goodsListItemImage {
	border-collapse: collapse;
	border-spacing: 0;
	height: 185px;
	margin-top: 0;
	width: 100%;
}

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

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

изменить уже ширину

#34 mnbv2005

mnbv2005

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

  • Пользователи
  • PipPipPipPip
  • 201 сообщений
  • ГородМосква

Отправлено 24 Октябрь 2012 - 17:46

Скрин прилагаю!Это всё не то(
Мне надо поменять размер картинки первоначально! Почитав на форумах, я поняла, что это делается через настройки, основные! Пыталась поменять все значения, но толку ноль(
Скрин прилагаю!

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

  • Безимени-1.jpg

#35 Vaccina

Vaccina

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

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

Отправлено 25 Октябрь 2012 - 14:24

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


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

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

  1. Форум владельцев интернет-магазинов
  2. → Вопросы работы сервиса StoreLand
  3. → Дизайн
  4. → Другие вопросы дизайна
  5. Privacy Policy