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


Товары вертикально в папке сравнеия. Как?


  • Вы не можете ответить в тему
Сообщений в теме: 10

#1 m0skit

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

  • Пользователи
  • PipPip
  • 27 сообщений
Репутация: 0
Начинающий

Отправлено 30 September 2014 - 03:48 AM

Сегодня обнаружил (и это после нескольких лет использования ShopCMS) что в папке сравнения товары выводятся горизонтально.
Если товара 2-3, то выводятся нормально. А вот если товаров больше, то таблица с товарами начинает вылазить за границы шаблона, растягивая окно (появляется полоса прокрутки) на всю ширину этой страницы.

Подскажите, пожалуйста, как сделать чтобы товары выводились вертикально, т.е. каждый новый товар в папке выводился не в столбце, а в строке.
А то, как-то очень это не красиво.

Буду очень признателен за советы и подсказки.
  • 0

#2 badisoft

    Продвинутый пользователь

  • Assistent vsupport.club
  • PipPipPip
  • 5075 сообщений
Репутация: 786
Мастер

Отправлено 30 September 2014 - 10:40 AM

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

А СРАВНИВАТЬ как будете? :)
При горизонтальном расположении сравниваемых товаров одноименные характеристики находятся на одной линии.
Уберите из товаров в таблице сравнения картинку и описание, обычно именно они занимают максимальное место по ширине, а сравнивают все равно по характеристикам.

Я бы делал следующим образом:
1. название товара расположил вертикально.
2. сделал изначально ширину столбцов фиксированной и мелкой, но с кнопкой "плюс/минус", увеличивающей ширину столбца так, чтобы влезало все содержимое.
3. краткое описание при "мелкой" ширине показывал бы в виде всплывающего окошка (по наведению мышкой, используя имеющийся в ShopCMS highslide), аналогично и картинку. Или вообще оба сразу - картинка плюс описание.

При таком раскладе столбцы по ширине будут занимать очень немного, а если уж кто-то хочет раскрыть по ширине все три десятка набросанных в сравнение товаров, то какая разница, по вертикали ему скроллить таблицу или по горизонтали? :)
  • 0
http://cpu.badisoft.ru (тестовый сайт), http://badisoft.ru (модули)

#3 m0skit

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

  • Пользователи
  • PipPip
  • 27 сообщений
Репутация: 0
Начинающий

Отправлено 03 October 2014 - 03:06 AM

А СРАВНИВАТЬ как будете?

Точно так же как и по горизонтали. В шапке таблицы будут указаны: название товара, фото, цена, характеристики. А под ними в ряд, в каждой новой сроке товар.

Я бы делал следующим образом: 1. название товара расположил вертикально. 2. сделал изначально ширину столбцов фиксированной и мелкой, но с кнопкой "плюс/минус", увеличивающей ширину столбца так, чтобы влезало все содержимое. 3. краткое описание при "мелкой" ширине показывал бы в виде всплывающего окошка (по наведению мышкой, используя имеющийся в ShopCMS highslide), аналогично и картинку. Или вообще оба сразу - картинка плюс описание.


Ну, я не программист, для меня это не так просто.

При таком раскладе столбцы по ширине будут занимать очень немного, а если уж кто-то хочет раскрыть по ширине все три десятка набросанных в сравнение товаров, то какая разница, по вертикали ему скроллить таблицу или по горизонтали?


Да, разницы нет. Только при вертикальном расположении не ломался бы шаблон и все это выглядело бы намного гармониченее и не так убого как по умолчанию.
Если честно, вообще не понимаю о чем думали разработчики, когда сделали таблицу горизонтальной.
  • 0

#4 badisoft

    Продвинутый пользователь

  • Assistent vsupport.club
  • PipPipPip
  • 5075 сообщений
Репутация: 786
Мастер

Отправлено 03 October 2014 - 08:30 AM

В шапке таблицы будут указаны: название товара, фото, цена, характеристики. А под ними в ряд, в каждой новой сроке товар.

Хм... Т.е. несколько товаров в сравнении "ломают шаблон", а название, фото и несколько характеристик - не будут? :)

Если честно, вообще не понимаю о чем думали разработчики, когда сделали таблицу горизонтальной.

Скорее всего, о том, что это проще реализуется :).

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

Собственно, я и в вертикальной реализации особых проблем не вижу. Просто поменять местами в циклах вывода вертикаль таблицы и горизонталь, т.к. товары и характеристики.
  • 0
http://cpu.badisoft.ru (тестовый сайт), http://badisoft.ru (модули)

#5 m0skit

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

  • Пользователи
  • PipPip
  • 27 сообщений
Репутация: 0
Начинающий

Отправлено 03 October 2014 - 08:57 AM

Хм... Т.е. несколько товаров в сравнении "ломают шаблон", а название, фото и несколько характеристик - не будут?

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

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


Это я и иимел в виду. Вернее я понимаю что нужно поменять настройки цикла, только вот где и как именно, знаний н ехватает. Поэтому и спрашиваю тут :(
  • 0

#6 zrom

    Продвинутый пользователь

  • Download User
  • PipPipPip
  • 69 сообщений
Репутация: 16
Начинающий

Отправлено 03 October 2014 - 10:01 AM

ненадо там настройки цикла менять, достаточно легкое знание html. и хоть чуточку smarty. все намного проще чем кажется.

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

типа так?

Прикрепленные файлы


  • 0

#7 badisoft

    Продвинутый пользователь

  • Assistent vsupport.club
  • PipPipPip
  • 5075 сообщений
Репутация: 786
Мастер

Отправлено 03 October 2014 - 12:01 PM

ненадо там настройки цикла менять, достаточно легкое знание html. и хоть чуточку smarty. все намного проще чем кажется.

Ага. Не надо. Правда, Вы именно это и сделали - сменили настройки циклов Smarty :).
И забыли цикл по [j] для {$products[j][i]}

PS. Но топикстартер этого не увидит, т.к. не может скачивать файлы, как я понимаю. :)
  • 0
http://cpu.badisoft.ru (тестовый сайт), http://badisoft.ru (модули)

#8 zrom

    Продвинутый пользователь

  • Download User
  • PipPipPip
  • 69 сообщений
Репутация: 16
Начинающий

Отправлено 03 October 2014 - 11:36 PM

ненадо там настройки цикла менять, достаточно легкое знание html. и хоть чуточку smarty. все намного проще чем кажется.

Ага. Не надо. Правда, Вы именно это и сделали - сменили настройки циклов Smarty :).
И забыли цикл по [j] для {$products[j][i]}

PS. Но топикстартер этого не увидит, т.к. не может скачивать файлы, как я понимаю. :)

для меня менять настройки цикла, это когда надо в section сменить последовательность атрибутов вывода. когда же 5 (или сколько там) раз выводится в шаблоне 1 и та же секция без атрибутов, вместо 1, это не настройки а повторение 1 и той же информации.
  • 0

#9 m0skit

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

  • Пользователи
  • PipPip
  • 27 сообщений
Репутация: 0
Начинающий

Отправлено 11 October 2014 - 02:03 AM

типа так? Прикрепленные файлы Прикрепленный файл comparison_products.tpl.html 1,73К


Спасибо, но как верно заметил badysoft, у меня нет прав на скачивание файлов :(

И забыли цикл по [j] для {$products[j][i]}


Это какая-то ошибка?
  • 0

#10 badisoft

    Продвинутый пользователь

  • Assistent vsupport.club
  • PipPipPip
  • 5075 сообщений
Репутация: 786
Мастер

Отправлено 11 October 2014 - 01:40 PM

Спасибо, но как верно заметил badysoft, у меня нет прав на скачивание файлов


Вот оно, но чуть подровняно и добавлен вышеописанный цикл:

{include file="header.tpl.html" header=$smarty.const.STRING_PRODUCT_COMPARISON}
<table cellspacing="0" cellpadding="0" width="100%">
<tr>
<td class="hmin">
<table cellspacing="1" cellpadding="0" width="100%" class="gre">
{section name=i loop=$products}
<tr>
<td class="lt pad" align="left" valign="middle" width="5%" nowrap="nowrap">{$smarty.const.TABLE_PRODUCT_NAME}</td>
<td class="pad" valign="middle" align="left" width="{math equation="round(95 / $products_count)"}%"><a href='product_{$products[i].productID}.html'><b>{$products[i].name}</b></a></td>
</tr>
<tr>
<td class="lt pad" valign="middle" align="left">{$smarty.const.ADMIN_PRODUCT_PICTURE}</td>
<td class="pad" valign="middle" align="left">{if $products[i].picture}<img src="data/small/{$products[i].picture}" alt="{$products[i].name}">{else}{if $smarty.const.CONF_DISPLAY_NOPHOTO eq 1}<img src="data/empty.gif" alt="">{else}-{/if}{/if}</td>
</tr>
<tr>
<td class="lt pad" valign="middle" align="left">{$smarty.const.STRING_PRODUCT_PRICE}</td>
<td class="pad price" valign="middle" align="left">{$products[i].PriceWithUnit}</td>
</tr>
<tr>
<td class="lt pad" valign="middle" align="left">{$smarty.const.STRING_PRODUCT_BRIEF_DESC}</td>
<td class="pad" valign="middle" align="left">{if $products[i].brief_description}{$products[i].brief_description}{else}-{/if}</td>
</tr>
{section name=j loop=$definedOptions}
<tr>
<td class="lt pad" valign="middle" align="left">{$definedOptions[j].name}</td>
<td class="pad" valign="middle" align="left">{$products[i][j]}</td>
</tr>
{/section}
{/section}
</table>
</td>
</tr>
</table>

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

PS. Если шаблон фиксированной ширины то, на мой взгляд, куда проще вставить после <td class="hmin"> строку
<div style="width:870px;overflow-x:scroll;">
а перед последним тэгом </td> вставить </div>
Ну и ширину скролла в 870px подобрать под свой шаблон.
  • 0
http://cpu.badisoft.ru (тестовый сайт), http://badisoft.ru (модули)

#11 m0skit

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

  • Пользователи
  • PipPip
  • 27 сообщений
Репутация: 0
Начинающий

Отправлено 12 October 2014 - 01:57 AM

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


Спасибо большое. Буду пробовать. Посмотрю что получится.
Возможно, вы и правы и в результате оставлю стандартный варинат :)
  • 0