Граблі, на які наступають

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

Гроші#

Сума без валюти друкується доларами. У тега {money} значення за замовчуванням — долар. Забули currency — у гривневому магазині ціна поїде з доларовим знаком. На тестовому магазині з валютою за замовчуванням помилки не видно зовсім.

{money amount=$product.price currency=$storefront.currency}

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

Замовлення не переоцінюється. У нього своя валюта і свій курс. Суми замовлення виводять з $order.currency, а не з валютою вітрини.

Порожні стани#

Порожній кошик віддає неповний набір ключів. Коли кошика ще немає, у $cart немає items_total і catalog_savings. Блок підсумків загортають у {if $items}, інакше шаблон полізе за неіснуючим ключем.

Відгуки можуть прийти одним ключем. Власник вимкнув відгуки — у $reviews тільки ознака «вимкнено». Звертатися до $reviews.items без перевірки {if $reviews.enabled} не можна.

Порожній залишок і нульовий залишок — різні речі. count і sku_count приходять порожніми, коли залишок у товару не рахують зовсім — послуги, товари під замовлення. Написати «залишилося 0 шт.» у цьому випадку не можна, а залишилося {$product.count} надрукує порожнечу замість числа.

Товар без фотографії — звична річ. Гілку із заглушкою пишуть одразу, інакше сітка роз'їдеться на першому ж магазині, де фотографії ще не завантажили.

Кеш#

«Поправив шаблон — на вітрині старе». Сторінки вітрини кешуються на добу. Правка файлу теми в редакторі кеш не скидає — файл пишеться повз базу.

Прийом: правте тему, залишаючись у панелі в сусідній вкладці. Співробітник магазину і пише повз кеш, і читає повз нього.

«Поправив CSS — браузер тримає старий файл». Файли теми віддаються з довгим кешем на місяць. Позначку версії отримують тільки ті, що підключені тегами {asset_css} і {asset_js}.

⚠️ Файл, підключений вручну, позначки не отримує зовсім і залипає в покупця на місяць:

{* не можна *}  <link rel="stylesheet" href="{$theme.assets}/css/my.css">
{* потрібно *}  {asset_css file="css/my.css"}

Кошик не можна вдруковувати в розмітку сторінки каталогу. Сторінки каталогу лежать у спільному кеші: одна й та сама йде всім покупцям, і наступний побачить чужий кошик. Тому кількість проставляє магазин уже в браузері, а тема тільки розмічає картку атрибутом data-in-cart.

Якщо без розмітки на сервері не обійтися, є {$shop->inCart()} — але він вимикає кеш для цієї сторінки.

Розмітка і атрибути#

Забутий мета-тег з ключем захисту ламає все. Без <meta name="csrf-token"> не працює ні додавання в кошик, ні перерахунок оформлення, ні надсилання відгуку. Помилка тиха: покупець натискає кнопку, і нічого не відбувається.

Імена полів оформлення міняти не можна. Перерахунок запускається за іменами — shipping, payment, coupon, bonus і все, що починається з address[. Перейменували coupon на promo — промокод перестав перераховувати замовлення.

data-recalc і data-required магазин не читає — він проставляє їх сам у тій розмітці, яку малює. Ставити їх у шаблоні безглуздо.

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

Не повідомили про свою зміну кошика — лічильник завмер. Будь-яка ділянка, що змінює кошик, зобов'язана надіслати подію cartix:cart-updated.

Без JavaScript оформлення замовлення не працює. І перерахунок, і створення замовлення відповідають даними, а не сторінкою. Заглушки в базовій темі немає.

Шаблони#

nofilter там, де виводиться готова розмітка. Екранування увімкнено завжди. Опис товару, вміст інформаційної сторінки і карта варіантів без nofilter виведуться текстом з <.

Одруківка в парному тегу роняє сторінку. Одиничний невідомий тег безпечний — він виводить порожнечу, тому тег вимкненого доповнення не ламає вітрину. А невідомий парний ({foo}…{/foo}) дає помилку збірки шаблону.

Незнайомий обробник значення безпечний, але тихий. Значення проходить наскрізь, ім'я йде в журнал. Перед викладенням у журнал варто заглянути.

Ключі та імена — тільки латиницею. {$theme.чого_нет} — це помилка розбору і білий екран, а не порожній рядок.

Відсутній шаблон — єдина помилка, через яку покупець бачить помилку замість сторінки. Те саме за {extends} і {include} на неіснуючий файл. Після перейменування шаблону пройдіться по вітрині очима.

Пагінатор Laravel у шаблон не віддається. Користуйтеся готовим pagination.

Налаштування теми#

Налаштування, не оголошеного в theme.json, не існує. Поки поля немає в схемі, значення в нього немає і бути не може — правка шаблону нічого не змінить. Так і з card_variants: у базової теми її в схемі немає, тому базова тема не показує варіанти купівлі на картках.

Ім'я налаштування не повинно збігатися з іменем групи. Налаштування лежать у $theme і плоско, і за групами: поле colors усередині групи catalog затре всю групу colors.

Переключилися на іншу тему, натиснули «Зберегти» — налаштування попередньої втрачені. Значення лежать одним набором на вітрину, а не окремо на кожну тему, і форма перезаписує весь набір своїми полями.

З того самого випливає, що нова тема може показати чужі значення: збіжні ключі (primary, per_page, container_width) переїжджають з теми в тему.

Перейменований між версіями ключ налаштування виглядає як зламане оновлення. Власник отримає значення за замовчуванням замість свого.

Мови#

Ключ, якого немає ні в темі, ні в магазині, виводиться сам. Сторінка не падає, але у верстці висить storefront.cart. Перед викладенням кожну мову потрібно пройти очима.

Написи, що їдуть у браузер, передає тема. Не передали data-text-* живому пошуку або data-l-* оформленню — на місці повідомлення буде порожнеча.

Довжина напису — частина верстки. Кнопка фіксованої ширини, зібрана на російському тексті, українською порветься.

Відмінювання перевіряють числами, а не на око. 21 товар і 22 товари — найчастіша помилка.

Файли і пакет#

Три файли магазин просить на кожній сторінці: assets/css/theme.css, assets/js/theme.js, assets/vendor/fontawesome/all.min.css. Їх немає — три помилки 404 в консолі.

Немає 404.html — покупець побачить стандартну сторінку без вашої шапки і підвалу.

Порожня папка в пакет не потрапляє — складається перелік файлів.

Файли за межами assets/ браузеру не віддаються — це захист, а не недоробка.

У базовій темі#

Дві речі, об які спотикаються, читаючи її як зразок.

Файли checkout/delivery.html, checkout/payment.html і checkout/confirm.html — мертві заготовки. Оформлення односторінкове, усе малює checkout/layout.html, а ці три файли ніхто не підключає. У своїй темі їх можна видалити.

README.md базової теми застарів. Він згадує тег {getList}, шаблон list.html і точки вбудовування header.end, home.after.lists, product.after.buy, checkout.fields — нічого цього не існує. Написаний у шаблоні {getList} мовчки виведе порожнечу. Орієнтуйтеся на цей довідник, а не на той файл.