Модуль дозволяє:

• Вивести серед товарів, і підкатегорій банери з довільним розташуванням в сітці - після n-го товару, або підкатегорії.
• Банери можна вивести серед товарів (підкатегорій) на всю ширину, або частина ширини сторінки, розмістивши поруч довільне число товарів.
• Вивести слайдер, або одиночне зображення на сторінці категорії
• Можна задати свої CSS класи і оформити в таблиці стилів
• Є версія з підтримкою багатомовності

установка

Стандартно, через ocmod. В процесі установки в БД додається таблиця "category_images".

Панель управління (admin /)

Версія 1:

Всі банери додаються в картці категорії (все русифіковане, тестовий сайт без перекладу):

Для кожного банера можна задати заголовок, опис, посилання, розміри, CSS класи.

В полях "Після категорії" і "Після товару" - задається порядковий номер підкатегорії / товару на сторінці, після якого буде відображатися банер. Якщо визначення від'ємного значення, банер буде виведений на самому початку. Якщо залишити полі не заповненим ( "0") - буде відображено або одиночне зображення вгорі, або слайдер (залежить від кількості зображень).

Після однієї категорії, товару можна додати тільки один банер. До категорій, товарів може бути додано скільки завгодно банерів (спочатку будуть виведені банери в порядку сортування, потім товари, категорії).

версія 2

Тільки у версії 2:

Банером може бути як окреме зображення, так і заздалегідь підготовлені банери в "Дизайн-> Банери"

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

Для кожного банера можна вказати сторінки для виведення

приклад:

Тут перший банер буде виведений у верхній частині сторінки, окремо. Бажано поставити йому розміри. Якщо розмір не заданий, буде використаний повний розмір зображення (як є).

Другий банер буде виведений після третього товару, з заголовком, посиланням, описом. Якщо розміри не задані, будуть використані стандартні для товара

Третій баннер буде виведений після третьої категорії в списку. Розміри зображення або довільні, або буде використаний розмір зображення категорії (з налаштувань).

Розміри зображень категорій окремо поставити не можна, але можна використовувати для цього заданий розмір будь-якого баннера, досить відзначити чекбокс "+ для категорій" (+ to img category), якщо нічого не зазначено - використовуються розміри зображення категорії.

Призначена для користувача частина (catalog /)

Модифікації піддаються: модель, контролер і шаблон категорії.

Зміни в контролер і шаблон (особливо шаблон) рекомендую вносити вручну, для більшої гнучкості.

До того ж, якщо в контролері будь-які проблеми пов'язані з конфліктом модифікаторів, або помилки малоймовірні, то в шаблоні може бути безліч інших змін (швидше за все є), а відповідно можлива некоректна модифікація.

Модифікатор перевірений з використанням стандартного шаблона - все працює.

У шаблоні додається два блоку спочатку, там де йде перевірка на наявність підкатегорій. Банери можна виводити незалежно від того, чи є дочірні категорії, якщо ж для категорії не вказано жодного банера в підкатегоріях, їх висновок буде стандартним.

У блоці товару так само є невеликі зміни - якщо на місці товару виведений банер, то ховаються стандартні кнопки і при наявності посилання з'являється "докладніше". Якщо посилання не задана - вона оббирає з заголовка і зображення.

Власних таблиць стилів модифікатор не містить (що б не погіршити швидкість завантаження сторінки). Для більш-менш коректного відображення рекомендую додати в .css файл теми наступне:

. cat-list. item {height: 300px; overflow: hidden; text-align: center; position: relative; background: #fff; margin-bottom: 15px; box-shadow: 0px 2px 7px # b5b5b5; border-radius: 4px;}. cat-list. item img {position: relative; z-index: 1;}. cat-list. item. title {text-decoration: none; color: # 000; font-size: 15px;}. cat-list. item. desc {position: absolute; z-index: 2; background: # f7f5f5a6; padding: 10px; left: 0px; bottom: 0px; width: 100%; box-sizing: border-box;}. cat-list. float. item {padding-left: 0px; text-align: center;}. cat-list. float. item. desc {background: none; position: static; text-align: right;}. cat-list. item. count {position: absolute; top: 0px; right: 0px; font-size: 14px; background: # 5a5a5a; color: #fff; height: 20px; line-height: 20px; width: 20px; text-align: center; border-radius: 20px;}. cat-list. float. item img {float: left; margin-right: 10px;}. button-group. btp-href {background-color: #eee; color: # 888; line-height: 38px; font-weight: bold; border: 0px; text-transform: uppercase; display: block; text-align: center;}

Клас "float" можна використовувати для широких банерів, де зліва буде зображення, праворуч текст.

За модифікації блоку товару в шаблоні категорії. Відразу після

<? php foreach ($ products as $ product) {?>

додається перевірка - товар це, або банер. Трохи вище пагінацію перевірка закінчується. Для пошуку використовується ось такий спосіб:

<Search> <! [CDATA [<? php echo $ pagination; ?>]]> </ Search> <add position = "before" offset = "3">

У стандартному шаблоні місце вставки виглядає так:

Якщо у вас є розбіжність, можна отримати або помилку 500, або з'їхала верстку.

В іншому все повинно бути нормально, якщо що - можна виправити.

Починаючи з версії 1.0 банери серед товарів можна виділяти в окремі контейнери, куди так само можна додавати і товари (розрив в списку товарів). Як це працює - на відео:

ОСОБЛИВОСТІ для Opencart 1.5

У опенкарт 1.5 скрипти на сторінці категорії працюють з '.product-list> div' і '.product-grid> div', тому для блоку з банером використовував тег "section".

В CSS де зустрічається .product-list> div і .product-grid> div потрібно додати section, що б вийшло:

.product-list> div, .product-list> section {.......} .product-list> div + div, .product-list> section + div {.......} .product -grid> div, .product-grid> section {.......} # column-left + # column-right + #content .product-grid> div, # column-left + # column-right + # content .product-grid> section {.......}

DEMO

Приклад категорії, з банером серед товарів, банерами серед категорій, а так само слайдшоу вгорі

Панель управління

Логін / пароль: demo / demo

ОПИС БУДЕ ДОПОВНЕНО