Перейти к содержанию
Lifeamove

Отображение под-под категорий

Рекомендуемые сообщения

Замысел такой поменять на более адекватное отображение под-под категорий... на скрин-шотах всё поймёте...

Подскажите как лучше / адекватнее реализовывать данную задачу.

Что имеем (на данный момент):

ссылка на изображение, размер: 33.2 кбайт, 1024 x 375 точек

 

Реализуем.

Вариант 1.

ссылка на изображение, размер: 49.1 кбайт, 1024 x 375 точек

Вариант 2.

ссылка на изображение, размер: 54.1 кбайт, 1024 x 375 точек

 

P.S. Начинаю ковыряться в html кодах, думаю как нибудь переместить ссылки к категориям на ленту (может быть можно сделать как-то более элементарнее / адекватнее)...

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Кажется   нашёл более простое и адекватное решение. Только как его массово реализовать (под все категории) не знаю, может поможете?

До       13126752m.jpg

 

 

После 13130848m.jpg

Изменено пользователем Lifeamove
опечатка

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Первый вариант-неверный. Там место для хлебных крошек.

Вариант второй реализуется почти элементарно

Надо смотреть в /product/category.tpl

Там подкатегории выводятся в div-е  с классом col-sm-3. Да и еще условие проверяется. 

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

      <?php if ($categories) { ?>
      <h3><?php echo $text_refine; ?></h3>//Это начало блока подкатегорий
      <?php if (count($categories) <= 5) { ?>
      <div class="row">
        <div class="col-sm-3">
          <ul>
            <?php foreach ($categories as $category) { ?>
            <li><a href="<?php echo $category['href']; ?>"><?php echo $category['name']; ?></a></li>
            <?php } ?>
          </ul>
        </div>
      </div>
      <?php } else { ?>
      <div class="row">
        <?php foreach (array_chunk($categories, ceil(count($categories) / 4)) as $categories) { ?>
        <div class="col-sm-3">
          <ul>
            <?php foreach ($categories as $category) { ?>
            <li><a href="<?php echo $category['href']; ?>"><?php echo $category['name']; ?></a></li>
            <?php } ?>
          </ul>
        </div>
        <?php } ?>
      </div>
      <?php } ?>
      <?php } ?>

Можно поменять или совсем убрать условия, поменять col-sm-3 на col-lg-12

И выставить элементам li подменю стили inline-block, а потом задать border, background, margin, padding  и остальные "прибамбасы"

Скрытый текст
#content li {
  1. display: inline-block;
  2. padding: 5px 10px;
  3. border: 1px solid #aaa;
  4. margin: 2px 5px;
  5. background: #BBDEFB;
}

А после этого нелишне проверить, как смотрится на малых экранах.

Красота, это-страшная сила!

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

58bc7d13894f7_.thumb.jpg.00b0557cbb81aa0c7bf791fb489bb823.jpg

P.S. так смотрится, если условия вывода не менять.. Если их убрать, будет идти сплошным блоком до края.

Изменено пользователем jaffagold
  • +1 1

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

jaffagold, спасибо... буду пробовать...

Кстати у меня почему то на сайте нету этих стилей у <li>, как у вас на последнем скрин-шоте:

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

inspector.stylesheet:5

#content li

{

display: in...

padding...

border...

margin

background....

}

 

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

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

Их надо вносить в конец файла stylesheet.css

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

  • +1 1

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

jaffagold, может быть легче сделать через фильтры, а в /product/category.tpl удалить:

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

<h3>Уточнить поиск</h3>
<div class="row">
        <div class="col-sm-3">
          <ul>
                        <li><a href="apple-iphone/iphone-7-plus/iphone-7-plus-32gb/">32Gb</a></li>
                        <li><a href="/apple-iphone/iphone-7-plus/iphone-7-plus-128gb/">128Gb</a></li>
                        <li><a href="/apple-iphone/iphone-7-plus/iphone-7-plus-256gb/">256Gb</a></li>
                      </ul>
        </div>
      </div>

И тем самым категории останутся, но отображаться не будут, или просто их под низ закинуть:

763cfbe6b777db3d1ea3e7652dd51c6f-prev.jp

А сверху останутся красивые фильтры:

9f71c1ca41c7aacdecb50e0ecf141970-prev.jp

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

в product.tpl блок вывода подкатегорий убрал. а он вылазит , сво****ч. где ещё может находится вызов подкатегорий. ну очень надо.....

1.bmp

Изменено пользователем Fiziktroya

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для публикации сообщений создайте учётную запись или авторизуйтесь

Вы должны быть пользователем, чтобы оставить комментарий

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти

  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу

×

Важная информация

На нашем сайте используются файлы cookie и происходит обработка некоторых персональных данных пользователей, чтобы улучшить пользовательский интерфейс. Чтобы узнать для чего и какие персональные данные мы обрабатываем перейдите по ссылке. Если Вы нажмете «Я даю согласие», это означает, что Вы понимаете и принимаете все условия, указанные в этом Уведомлении о Конфиденциальности.