Moushe.ru

Блог обо всём

OpenCart изменяем каталог товаров (1 часть)



Сегодня мы с вами изменим вывод товаров при нажатии на категорию/ подкатегорию товаров.

До:                                                      После:

15

P.S. В прошлом уроке, если вы помните мы добавили товару краткое описание, сегодняшний урок является продолжением предыдущего, хотя если есть желание прошлый урок можно пропустить, но тогда карточка товара будет пустовата. Улыбка

1. Откроем файл category.tpl (..\catalog\view\theme\default\template\product) и изменим эту строку (46):

<table class="list">

на эту:

<table class="list2">

ниже изменим эти строки(47-49):

<?php for ($i = 0; $i < sizeof($products); $i = $i + 4) { ?>
<tr>
<?php for ($j = $i; $j < ($i + 4); $j++) { ?>

на эти:

<?php for ($i = 0; $i < sizeof($products); $i = $i + 1) { ?>
<tr class="list2">
<?php for ($j = $i; $j < ($i + 1); $j++) { ?>

(это изменение выведет наш товар не по четыре товара в ряд, а по одному)

Смотрим результат:

2

Меняем эти строки (50-68):

<td width="25%"><?php if (isset($products[$j])) { ?>
<a href="<?php echo $products[$j]['href']; ?>"><img src="<?php echo $products[$j]['thumb']; ?>" title="<?php echo $products[$j]['name']; ?>" alt="<?php echo $products[$j]['name']; ?>" /></a><br />
<a href="<?php echo $products[$j]['href']; ?>"><?php echo $products[$j]['name']; ?></a><br />
<span style="color: #999; font-size: 11px;"><?php echo $products[$j]['model']; ?></span><br />
<span style="color: #666; font-size: 12px;"><?php echo $products[$j]['mini_description']; ?></span><br />
<?php if ($display_price) { ?>
<?php if (!$products[$j]['special']) { ?>
<span style="color: #900; font-weight: bold;"><?php echo $products[$j]['price']; ?></span>
<?php } else { ?>
<span style="color: #900; font-weight: bold; text-decoration: line-through;"><?php echo $products[$j]['price']; ?></span> <span style="color: #F00;"><?php echo $products[$j]['special']; ?></span>
<?php } ?>
<a class="button_add_small" href="<?php echo $products[$j]['add']; ?>" title="<?php echo $button_add_to_cart; ?>" >&nbsp;</a>
<?php } ?>
<br />
<?php if ($products[$j]['rating']) { ?>
<img src="catalog/view/theme/default/image/stars_<?php echo $products[$j]['rating'] . '.png'; ?>" alt="<?php echo $products[$j]['stars']; ?>" />
<?php } ?>
<?php } ?></td>

на эти:

<td width="25%"><?php if (isset($products[$j])) { ?>
<a href="<?php echo $products[$j]['href']; ?>"><img src="<?php echo $products[$j]['thumb']; ?>" title="<?php echo $products[$j]['name']; ?>" alt="<?php echo $products[$j]['name']; ?>" /></a><br />
</td>
<td>
<b><span style="color: #000; font-size: 11px;"><?php echo $products[$j]['model']; ?></span>
<a href="<?php echo $products[$j]['href']; ?>"><?php echo $products[$j]['name']; ?></a></b>
<br />
<span style="color: #666; font-size: 12px;"><?php echo $products[$j]['mini_description']; ?></span><br />
</td>
<td>
<?php if ($display_price) { ?>
<?php if (!$products[$j]['special']) { ?>
<span style="color: #900; font-weight: bold;"><?php echo $products[$j]['price']; ?></span>
<?php } else { ?>
<span style="color: #900; font-weight: bold; text-decoration: line-through;"><?php echo $products[$j]['price']; ?></span> <span style="color: #F00;"><?php echo $products[$j]['special']; ?></span>
<?php } ?>
<br />
<a href="<?php echo $products[$j]['add']; ?>" title="<?php echo $button_add_to_cart; ?>" >В корзину</a>
<?php } ?>
<br />
<a href="<?php echo $products[$j]['href']; ?>" title="Полное описание товара" >Подробнее</a>
<br />
<?php if ($products[$j]['rating']) { ?>
<img src="catalog/view/theme/default/image/stars_<?php echo $products[$j]['rating'] . '.png'; ?>" alt="<?php echo $products[$j]['stars']; ?>" />
<?php } ?>
<?php } ?>
</td>

Смотрим что же у нас получилось:

3

на мой взгляд не плохо. Улыбка

 

2. Продолжим ковырять код, откроем stylesheet.css (..\catalog\view\theme\default\stylesheet) и вставим в него такой код:

.list2 {
margin-bottom: 10px;
width: 100%;
border: 1px solid #ddd;
border-collapse: collapse;
}
.list2 td {
text-align: left;
vertical-align: top;
padding: 10px 10px 10px 10px;
}
.list2 a {
color: #1B57A3;
font-weight: bold;
font-size: 13px;
text-decoration: none;
}
.list2 a:hover{
padding-top: 2px;
color: #de7622;
font-weight: bold;
font-size: 13px;
text-decoration: none;
}

Результат:

4

Заполним нормально товары и страница начнёт выглядеть так:

5

В одном из следующих уроков мы доработаем эту страницу до конца.

36 Комментариев

  1. Алексей

    25.12.2011 at 18:16

    Владислав, скажите: Вы не планируете рассказать нам как править opencart_v1.5. ? Футер, например, там уже не поправишь таким же образом, как в Ваших публикациях. Да и много что по мелочам хотелось бы сделать по подобию тем Ваших уроков.

    • Владислав Храмцов
      vkontakte.ru Владислав Храмцов

      25.12.2011 at 22:32

      Я планирую сделать ещё несколько уроков по OpenCart 1.4.9 и перейти на уроки по OpenCart 1.5.1 🙂

  2. Татьяна

    25.12.2011 at 23:40

    Владислав, а можете подсказать, как снежинки падающие разместить на сайте? 🙂

  3. kvartnikstroy.ru

    31.12.2011 at 10:09

    Татьяна! На http://maxzon.ru/ есть тема про снежинки…

  4. Дешево же Вы цените «человека»… всего 100р.))))))))))(шутка)
    Спасибо за уроки, доходчиво и по_шагово. Расскажите, плз, в какую версию опенкарта воткнется шаблон Comp4you и пути файлов из его архива. (что куда распихивать)

    • Владислав Храмцов
      vkontakte.ru Владислав Храмцов

      13.01.2012 at 20:26

      Шаблон сделан для OpenCart’а 1.4.9, а файлы нужно закинуть в первую папку вашего сайта (туда где лежат папки admin, catalog, download, export, image, system).

    • Спасибо!

    • Владислав Храмцов
      vkontakte.ru Владислав Храмцов

      13.01.2012 at 23:18

      Пожалуйста 🙂

  5. Скажи пожалуйста Владислав почему коряво отображается «корзина» и «подробнее», а так же ошибка описания ругается вот так Notice: Undefined index: mini_description in и далее адрес.Помоги пожалуйста

    • Владислав Храмцов
      vkontakte.ru Владислав Храмцов

      23.01.2012 at 21:23

      Откройте category.tpl текстовым редактором (notepad/notepad++) и сохраните файл в кодировке utf8 / utf8 без Bom, и проблема исчезнет, если ругается на mini_description значит не правильно скопировали текст — я его проверял несколько раз ошибок быть не должно. 🙂 Попробуйте воспользоваться стандартным блокнотом.

    • Корзина и подробнее изменил дело в кодировке, а вот mini_description никак,и стандартным пробовал безрезультатно.Что еще может быть? 😥

    • Владислав Храмцов
      vkontakte.ru Владислав Храмцов

      23.01.2012 at 22:48

      Прошлый урок без ошибок сделан ? В контроллер всё верно вставлено ?

  6. Влад у меня нет в стандартном файле такой строчки <?php echo $products[$j]['mini_description']; почему?

  7. спасибо все решил.Нужно было просто первый урок смотреть

  8. подскажет пожалуста как сделать чтоб при заходе в категорию были видны не только названия под категорий но и картинки относящиеся к ним
    к примеру вот тут
    http://agu-men.ru/index.php?route=product/category&path=64
    1,5,1,3
    заранее спасибо

    • Владислав Храмцов
      vkontakte.ru Владислав Храмцов

      09.02.2012 at 20:15

      Поставьте модуль расширенные категории

  9. Алексей

    16.02.2012 at 22:49

    Влад! Дай я тебя расцелую =) Спасибо!
    но не заработало, за место текста выдаёт
    Notice: Undefined index: mini_description in /home/sexmannr/public_html/catalog/view/theme/default/template/product/category.tpl on line 54
    mini_description- создал в админке мускула

    • Владислав Храмцов
      vkontakte.ru Владислав Храмцов

      16.02.2012 at 23:38

      Вы установили мою сборку OpenCart’a или просто заменили свои файлы моими ?
      Если первое то базу данных ковырять не нужно! Просто установить и всё, если же заменяли свои файлы моими то посмотрите в админке версию своего опенкарта, я делал свою модификацию на последней сборке OcStore 0.2.2. 🙂

  10. Алексей

    17.02.2012 at 00:11

    У меня то же 0.2.2 сборка. Всё получилось =) я прям счастлив. Косяки были во мне, поторопился, запаниковал =) Спасибо за помощь!

    • Владислав Храмцов
      vkontakte.ru Владислав Храмцов

      17.02.2012 at 00:46

      Не за что

  11. Алексей

    17.02.2012 at 00:18

    Вопрос =) выгружаю товары при помощи excel как сделать так что бы столбец mini_description то же выгружался?

    • Владислав Храмцов
      vkontakte.ru Владислав Храмцов

      17.02.2012 at 00:47

      Нужно изменять модуль выгрузки, открываете его контроллер и изучаете код.

  12. Денис Сабуров

    03.04.2012 at 17:03

    Владислав над 1.5 то вы как не пробовали тоже самое просто уже месяца 3 прошло уже поджимает спасибо за ранее…

    • Владислав Храмцов
      vkontakte.ru Владислав Храмцов

      03.04.2012 at 21:15

      На оф форуме создавали тему и там был подробный ответ, не вижу смысла создавать такой же урок по 1.5.1

  13. подскажите как вывести где описание модель и опции?

    • Владислав Храмцов
      vkontakte.ru Владислав Храмцов

      08.01.2014 at 00:15

      Не знаю, я уже давно не работаю с этой версией Опенкарта.

  14. я извиняюсь забыл указать версию ocstore 1.5.5.1

    • Владислав Храмцов
      vkontakte.ru Владислав Храмцов

      08.01.2014 at 18:01

      В файле ../catalog/view/theme/default/template/product/product.tpl 29 строка (строка с кодом $model) 57-81 строки ($options) переносите под 230 строку ($tab_description)

  15. Причем здесь product.tpl ?
    Речь вроде идёт о выводе в списке каталога товаров.
    значит надо редактировать как минимум category.php и category.tpl

    • Владислав Храмцов
      vkontakte.ru Владислав Храмцов

      09.01.2014 at 22:02

      Тьфу блин, вам нужно взять указанные мною коды из product.tpl и да, вставить в category.tpl

  16. Автозеркала

    09.04.2016 at 02:15

    Подскажите. Как сделать каталог товаров на опенкатс?

Добавить комментарий

Your email address will not be published.

*

CAPTCHA image
*

© 2016 Moushe.ru При копировании материалов, ссылка на нас обязательна!

Вверх ↑



Яндекс.Метрика