Створення власної теми дизайну для shop-script - mdash; webasyst

Тема дизайну для Shop-Script повинна містити наступний набір основних шаблонів вітрини:

  • checkout.html
  • checkout.contactinfo.html
  • checkout.shipping.html
  • checkout.payment.html
  • checkout.confirmation.html
  • checkout.success.html
  • checkout.error.html

1. Формування структури теми дизайну

index.html

Шаблон index.html формує основну структуру сторінок вітрини за допомогою елементів , , і .

усередині елемента можуть формуватися основне навігаційне меню (наприклад, за допомогою методу apps ()>, як це зроблено в темі дизайну «Дефолт»), бічні панелі, нижня панель ( «футер») і тому подібні структурні блоки сторінки, загальні для всіх сторінок вітрини.

category.html

списки товарів

Порада: код для відображення списку товарів, що використовується в шаблоні category.html, може бути використаний і на інших сторінка вітрини, наприклад, на сторінці з результатами пошуку, тому зручно винести цей код в окремий шаблон, назвавши його, наприклад, product-list. html. Підключити такий додатковий шаблон в шаблоні category.html можна за допомогою Smarty-функції:

У темі дизайну «Дефолт» для цієї ж мети використовуються 2 різних шаблону: list-table.html і list-thumbs.html - для формування списків товарів з різним оформленням в різних місцях вітрини.

product.html

Шаблон product.html використовується для формування основного вмісту сторінки товару. Зазвичай на цій сторінці відображаються найменування, опис, характеристики товару і кнопка «В кошик».

Інформація про товар міститься у вигляді примірника класу shopProduct в змінної.

Вихідний код класу shopProduct знаходиться в файлі wa-apps / shop / lib / classes / shopProduct.class.php.

Крім відображення інформації про товар, важливою функцією сторінки товару є можливість додати товар в корзину, щоб потім перейти до оформлення замовлення. Форма додавання товару в корзину може бути створена у вигляді тега

, дані якої повинні відправлятися методом POST на URL, що повертається конструкцією getUrl ( '/ frontendCart / add')>.

Шаблон cart.html використовується для відображення сторінки зі списком товарів, доданих до кошика. Як правило, на такій сторінці можна змінити кількість замовлених одиниць товарів, видалити окремі товари з кошика або відразу перейти до оформлення замовлення.

Інформація про поточну купівельному кошику міститься у змінній у вигляді асоціативного масиву з наступними елементами:

  • items - список товарів, доданих до кошика
  • total - загальна сума цін замовлених одиниць товарів з урахуванням обраних артикулів і варіантів послуг
  • count - загальна кількість замовлених одиниць товарів

error.html

Якщо при запиті сторінки вітрини виникає помилка (наприклад, «Сторінку не знайдено» або «Внутрішня помилка сервера»), то для відображення інформації про це використовується шаблон error.html. Змінні, доступні в цьому шаблоні:

  • $ Error_message - повідомлення про помилку, що генерується магазином
  • $ Error_code - код відповіді сервера, наприклад, 404 або 500

3. Підтримка плагінів

Базові теми дизайну Shop-Script (наприклад, тема «Дефолт») мають вбудовану підтримку плагінів. Ця підтримка полягає в тому, що в шаблонах теми дизайну присутні спеціальні вставки (хукі), які дозволяють автоматично додавати на вітрину магазину додатковий вміст (наприклад, список брендів товарної продукції і т. П.). Приклад хука в шаблоні product.html:

Для того щоб ваша тема дизайну підтримувала відображення додаткового вмісту за допомогою плагінів, скопіюйте подібні фрагменти з однієї з базових тим дизайну (наприклад, «Дефолт») до відповідних шаблони вашої власної теми.

Підключення загальних файлів фреймворка

Підключення власних файлів теми

Підключаються в такому прикладі файли style.css і script.js слід додати в папку з усіма іншими шаблонами теми.

5. Створення файлу-маніфесту

Для того щоб Shop-Script сприймав набір створених шаблонів як складові частини певної теми дизайну, необхідно вказати всі файли створеної вами теми в спеціальному файлі-маніфесті theme.xml. Приклад файлу-маніфесту і опис його елементів дивіться в статті «Інтеграція з додатком" Сайт "».

Важливо: ідентифікатор (id) вашої теми дизайну, вказаний у файлі-маніфесті theme.xml, не повинен збігатися з ідентифікаторами інших тим, встановлених в магазині!

6. Завантаження на сервер

Перед завантаженням файлів теми на сервер їх необхідно разом з файлом-маніфестом запакувати в архів формату TAR.GZ. Упакувати потрібно тільки файли - без папки, в якій ви їх створювали на вашому комп'ютері! Файл-архіву не має значення. Архів необхідно додати по посиланню «Завантажити тему» ​​в розділі «Вітрина».

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