Изменить стиль вывода Zoo Item в Teaser

Тема в разделе "Внешний вид, шаблоны, графика", создана пользователем slavikrovno, 04.02.2014.

  1. Offline

    slavikrovno Недавно здесь

    Регистрация:
    01.12.2012
    Сообщения:
    12
    Симпатии:
    0
    Пол:
    Мужской
    Доброго времени суток!
    Вот хочу изменить вывод спецификаций Teaser’а.
    Может не доступно выражаюсь, вот выводится медиа в категории таким образом:
    1.jpg
    А хотелось бы вот так как на фото ниже. Что бы спецификации не выводились в столбик.
    Не списком все вниз, а что бы колонка итема была ограничена по высоте, и спецификации что не влазят переходили бы в другой столбик, как то так.
    2.jpg
     
  2.  
  3. CB9T
    Offline

    CB9T Преподаватель по J! Команда форума

    Регистрация:
    21.05.2010
    Сообщения:
    2 462
    Симпатии:
    303
    Пол:
    Мужской
    и? :)

    Код (CODE):
    1. /media/zoo/applications/Ваше приложение/templates/catalog/renderer


    это примерный путь.

    0_8a70b_8df52f06_orig.png


    Далее например каталог product:

    0_8a70c_a81f6795_orig.png

    0_8a70d_7003af2f_orig.png


    Размечаем позиции:
    0_8a70e_5c2ba55b_orig.png


    Далее размечаем условия:
    0_8a70f_e088c219_orig.png

    И далее применяем правила в CSS
    [!] Вперед и с песнями :dance:
     
    Последнее редактирование модератором: 25.11.2014
    Istraweb, OlegM и slavikrovno нравится это.
  4. Offline

    slavikrovno Недавно здесь

    Регистрация:
    01.12.2012
    Сообщения:
    12
    Симпатии:
    0
    Пол:
    Мужской
    Можно хоть на каком то примере по поводу "Применяем правила в CSS" немножко подробнее.
    В моем случае, условия описаны так:

    Код (PHP):
    1. <?php if ($this->checkPosition('specification')) : ?>
    2. <p class="pos-specification">
    3.     <?php echo $this->renderPosition('specification', array('style' => 'pipe')); ?>
    4. </p>
    5. <?php endif; ?>


    Параметры дергаются из класса "class="pos-specification"". Но в пхп я не особо силен.


    И где искать CSS-ый файл?
     
  5. CB9T
    Offline

    CB9T Преподаватель по J! Команда форума

    Регистрация:
    21.05.2010
    Сообщения:
    2 462
    Симпатии:
    303
    Пол:
    Мужской
    Вы можете найти CSS файл своего шаблона и внизу переопределить правила:

    Код (html):
    1. .pos-specification {color: red !important;}


    Это просто как пример...

    т.е. у Вас есть данные, а верстку (разметку) сделали уже в тизер.пхп (там хоть таблицу рисуйте), а уже в CSS высоту / ширину / позицию / отступы и так далее.

    Пример teaser.php:

    Код (PHP):
    1. <?php
    2. /**
    3. * @package   com_zoo
    4. * @author    YOOtheme http://www.yootheme.com
    5. * @copyright Copyright (C) YOOtheme GmbH
    6. * @license   http://www.gnu.org/licenses/gpl.html GNU/GPL
    7. */
    8.  
    9. // no direct access
    10. defined('_JEXEC') or die('Restricted access');
    11.  
    12. // init vars
    13. $params = $item->getParams('site');
    14.  
    15. ?>
    16.  
    17. <?php if (($params->get('template.teaseritem_media_alignment') == "above") && $this->checkPosition('media')) : ?>
    18. <div class="pos-media media-<?php echo $params->get('template.teaseritem_media_alignment'); ?>">
    19.     <?php echo $this->renderPosition('media', array('style' => 'block')); ?>
    20. </div>
    21. <?php endif; ?>
    22.  
    23. <?php if ($this->checkPosition('title')) : ?>
    24. <h1 class="pos-title">
    25.     <?php echo $this->renderPosition('title'); ?>
    26. </h1>
    27. <?php endif; ?>
    28.  
    29. <?php if ($this->checkPosition('meta')) : ?>
    30. <p class="pos-meta">
    31.     <?php echo $this->renderPosition('meta'); ?>
    32. </p>
    33. <?php endif; ?>
    34.  
    35. <?php if ($this->checkPosition('subtitle')) : ?>
    36. <h2 class="pos-subtitle">
    37.     <?php echo $this->renderPosition('subtitle'); ?>
    38. </h2>
    39. <?php endif; ?>
    40.  
    41. <?php if (($params->get('template.teaseritem_media_alignment') == "top") && $this->checkPosition('media')) : ?>
    42. <div class="pos-media media-<?php echo $params->get('template.teaseritem_media_alignment'); ?>">
    43.     <?php echo $this->renderPosition('media', array('style' => 'block')); ?>
    44. </div>
    45. <?php endif; ?>
    46.  
    47. <div class="floatbox">
    48.  
    49.     <?php if ((($params->get('template.teaseritem_media_alignment') == "left") || ($params->get('template.teaseritem_media_alignment') == "right")) && $this->checkPosition('media')) : ?>
    50.     <div class="pos-media media-<?php echo $params->get('template.teaseritem_media_alignment'); ?>">
    51.         <?php echo $this->renderPosition('media', array('style' => 'block')); ?>
    52.     </div>
    53.     <?php endif; ?>
    54.  
    55.     <?php if ($this->checkPosition('content')) : ?>
    56.     <div class="pos-content">
    57.         <?php echo $this->renderPosition('content', array('style' => 'block')); ?>
    58.     </div>
    59.     <?php endif; ?>
    60.  
    61. </div>
    62.  
    63. <?php if (($params->get('template.teaseritem_media_alignment') == "bottom") && $this->checkPosition('media')) : ?>
    64. <div class="pos-media media-<?php echo $params->get('template.teaseritem_media_alignment'); ?>">
    65.     <?php echo $this->renderPosition('media', array('style' => 'block')); ?>
    66. </div>
    67. <?php endif; ?>
    68.  
    69. <?php if ($this->checkPosition('links')) : ?>
    70. <p class="pos-links">
    71.     <?php echo $this->renderPosition('links', array('style' => 'pipe')); ?>
    72. </p>
    73. <?php endif;


    В нем есть разметка:

    Вывести заголовок:

    Код (PHP):
    1. <?php if ($this->checkPosition('subtitle')) : ?>
    2. <h2 class="pos-subtitle">
    3.     <?php echo $this->renderPosition('subtitle'); ?>
    4. </h2>
    5. <?php endif; ?>


    Вам по аналогии можно сделать:

    Код (html):
    1. <table border="1">
    2.    <tr><td> <?php if ($this->checkPosition('specification')) : ?>
    3. <p class="pos-specification">
    4.     <?php echo $this->renderPosition('specification', array('style' => 'pipe')); ?>
    5. </p>
    6. <?php endif; ?> </td><td>СЮДА другая переменная</td><td>СЮДА другая переменная</td></tr>
    7.   </table>
     
    Последнее редактирование: 05.02.2014
    OlegM нравится это.
  6. Offline

    slavikrovno Недавно здесь

    Регистрация:
    01.12.2012
    Сообщения:
    12
    Симпатии:
    0
    Пол:
    Мужской
    Емае.... Точно, я чето не додул что в пхп, то что размечено "дивами" это уже разметка.
    Вот спасибо Вам!!!! Очень сильно помогли! Плюсанул еще вчера) Спасибо!!!
     
  7. Istraweb
    Offline

    Istraweb Недавно здесь

    Регистрация:
    26.02.2015
    Сообщения:
    6
    Симпатии:
    1
    Пол:
    Мужской
    Привет всем! Благодаря вашим постам решил поставленною задачу, но столкнулся с другой в zoo http://nedwizh.istrawebdesign.ru/квартиры-в-подмосковье
    50da0-clip-127kb.jpg
    Код (CODE):
    1. <table class="tablelist">
    2. <tbody><tr class="trnorm">
    3.         <td class="numtable"><?php if ($this->checkPosition('dop1')) : ?><?php echo $this->renderPosition('dop1', array('style' => 'pipe')); ?><?php endif; ?></td>
    4.         <td class="otmkad"><?php if ($this->checkPosition('dop2')) : ?><?php echo $this->renderPosition('dop2', array('style' => 'pipe')); ?><?php endif; ?></td>
    5.         <td class="price"><?php if ($this->checkPosition('dop3')) : ?><?php echo $this->renderPosition('dop3', array('style' => 'pipe')); ?><?php endif; ?></td>
    6.         <td class="plosh"><?php if ($this->checkPosition('dop4')) : ?><?php echo $this->renderPosition('dop4', array('style' => 'pipe')); ?><?php endif; ?></td>
    7.         <td class="plosh"><?php if ($this->checkPosition('dop5')) : ?><?php echo $this->renderPosition('dop5', array('style' => 'pipe')); ?><?php endif; ?></td>
    8.         <td class="foto"><?php if ($this->checkPosition('dop6')) : ?><?php echo $this->renderPosition('dop6', array('style' => 'pipe')); ?><?php endif; ?></td>
    9.         <td class="opis"><?php if ($this->checkPosition('dop7')) : ?><?php echo $this->renderPosition('dop7', array('style' => 'pipe')); ?><?php endif; ?></td>
    10.         <td class="stage"><?php if ($this->checkPosition('dop8')) : ?><?php echo $this->renderPosition('dop8', array('style' => 'pipe')); ?><?php endif; ?></td>
    11.         <td class="komnat"><?php if ($this->checkPosition('dop9')) : ?><?php echo $this->renderPosition('dop9', array('style' => 'pipe')); ?><?php endif; ?></td>
    12.         <td class="gde"><?php if ($this->checkPosition('dop10')) : ?><?php echo $this->renderPosition('dop10', array('style' => 'pipe')); ?><?php endif; ?></td>
    13.         <td class="gde"><?php if ($this->checkPosition('dop11')) : ?><?php echo $this->renderPosition('dop11', array('style' => 'pipe')); ?><?php endif; ?></td>
    14.         </tr></tbody></table>

    9a686-clip-42kb.png

    Подскажи пожалуйста! Как можно скрыть пустые столбцы таблицы?
     
  8. CB9T
    Offline

    CB9T Преподаватель по J! Команда форума

    Регистрация:
    21.05.2010
    Сообщения:
    2 462
    Симпатии:
    303
    Пол:
    Мужской
    Назначьте разные классы для начала:

    7RNr5ZQ.png

    Затем можете через CSS скрыть колонки.
     
  9. Istraweb
    Offline

    Istraweb Недавно здесь

    Регистрация:
    26.02.2015
    Сообщения:
    6
    Симпатии:
    1
    Пол:
    Мужской
    Да с этим согласен! Делом в том, что мне нужен универсальный тизер, под разные категории, с другими классами, поэтому вот такой и большой мой тизер. Может есть какая либо переменная которая скрывает столбец при нуле инфы....может я что ни так называю))) просто я еще учусь писать код
    --- добавлено: 26.02.2015, первое сообщение размещено: 26.02.2015 ---
    Хотя, я и сам вижу что слишком все усложнил, много просто всего перепробовал за день
     
  10. CB9T
    Offline

    CB9T Преподаватель по J! Команда форума

    Регистрация:
    21.05.2010
    Сообщения:
    2 462
    Симпатии:
    303
    Пол:
    Мужской
    В Zoo есть типы - под разные каталоги можно разные типы.

    Если прям скрывать, то: у вас есть проверка php If this... Поставьте ее перед ячейкой, понятно?
     
  11. Istraweb
    Offline

    Istraweb Недавно здесь

    Регистрация:
    26.02.2015
    Сообщения:
    6
    Симпатии:
    1
    Пол:
    Мужской
    не совсем понял, если можно по подробнее
     
  12. CB9T
    Offline

    CB9T Преподаватель по J! Команда форума

    Регистрация:
    21.05.2010
    Сообщения:
    2 462
    Симпатии:
    303
    Пол:
    Мужской
    Измените тут, условие проверки до ячейки сделайте.
     

    Вложения:

    • image.jpg
      image.jpg
      Размер файла:
      157.2 КБ
      Просмотров:
      11
  13. Istraweb
    Offline

    Istraweb Недавно здесь

    Регистрация:
    26.02.2015
    Сообщения:
    6
    Симпатии:
    1
    Пол:
    Мужской
    74877-clip-99kb.jpg a0e3d-clip-29kb.png

    В общем сделал так в зоо, привязав к каждой вкладке свой шаблон, таким образом получил для каждого пункта меню свой уникальный тизер) может и с легка замороченно
    c2890-clip-34kb.png
     
    CB9T нравится это.

Поделиться этой страницей

Загрузка...