- blog.hotlist.biz
- Оновлення та новини платформи для створення інтернет-магазинів Hotlist.biz
Нова функція: вибір типу сторінки для Schema.org
У панелі адміністратора з’явився новий параметр, який дозволяє вибрати тип сторінки для Schema.org. Параметр доступний лише для сторінок і статей.
Це допоможе пошуковим системам краще розпізнавати структуру сайту та правильно індексувати контент.
Доступні типи сторінок:
- WebPage – Загальна сторінка. Використовується для будь-якої сторінки без специфічного контенту.
- Article – Стаття. Для публікацій, новин, блог-постів.
- BlogPosting – Блог-пост. Для сторінок із публікаціями блогу.
- NewsArticle – Новинна стаття. Для новинних публікацій.
- AboutPage* – Сторінка «Про нас». Потрібно вручну заповнити поля
headline
,author
, можливоimage
. - ContactPage* – Сторінка контактів. Бажано додати
headline
іauthor
. - CollectionPage* – Сторінка колекції товарів або контенту. Потрібно вказати
headline
іauthor
. - ProfilePage* – Сторінка профілю користувача/автора. Потрібно
headline
іauthor
.
Приклад використання в HTML-коді:
<div id="page_content" itemscope itemtype="https://schema.org/WebPage">...</div>
Параметр можна вказати під час створення або редагування сторінки чи статті.
Тепер у спливаючих вікнах доступний новий функціонал:
- Атрибут
data-dialog-callback
дозволяє викликати будь-яку користувацьку функцію одразу після відкриття вікна. - Атрибут
data-dialog-button-callback
дає можливість додавати кілька кнопок і призначати для кожної окрему функцію.
Детальніше — на сторінці генерації спливаючих вікон.
Ми раді представити нову функціональність для магазинів. Тепер ви можете легко додавати додаткову суму до підсумкової вартості замовлення в кошику.
За допомогою прихованого поля «form_price_append» можна враховувати різні надбавки:
- чайові;
- додаткові послуги;
- ексклюзивні товари;
- будь-які інші важливі елементи, які потрібно додати до підсумкової ціни.
Поле можна створити двома способами:
- Через редактор форми в налаштуваннях магазину на вкладці «Оформлення замовлення», у розділі «Додати поля до форми замовлення».
- Програмно за допомогою скриптів, які динамічно змінюють його значення (рекомендовано).
Це спрощує процес управління додатковими сумами та гарантує правильне відображення підсумкової вартості для користувача.
Приклад скрипта для додавання суми до підсумкової вартості замовлення
В API Commerce додано повне керування категоріями, виробниками та колекціями. Тепер ви можете створювати, оновлювати та видаляти ці сутності через захищені запити.
Докладніше в інструкції: https://hotlist.biz/ua/user_guide.html#hotengine-CommerceAPI
Докладніше в інструкції: https://hotlist.biz/ua/user_guide.html#hotengine-CommerceAPI
Додано можливість відображення сусідніх категорій того ж рівня
- Опцію можна включити індивідуально для кожної категорії або в загальних налаштуваннях сайту.
- Для зміни перейдіть у розділ: Налаштування → Магазин → Категорії.
- При включенні опції елемент списку категорій буде з класом «
hotengine-categories-sibling-list
».
- Налаштування можна задати індивідуально для кожної категорії або в загальних налаштуваннях сайту.
- Для зміни перейдіть у розділ: Налаштування → Магазин → Категорії.
- При зміні опції відображення для головного елемента списку категорій «hotengine-categories-list» додається клас «hotengine-categories-list-style-X», де «X» відповідає обраному стилю відображення.
- Список доступних стилів відображення:
- «Як у загальних налаштуваннях сайту»
- «Стандартний (блоки з назвою та зображенням)»
- «Скорочений (зображення) [якщо є товари в категорії]»
- «Скорочений (тільки заголовок) [якщо є товари в категорії]»
- «Скорочений (зображення)»
- «Скорочений (тільки заголовок)»
Додана нова функція, яка дозволяє використовувати кілька варіантів одночасно та комбінувати їх в один із автоматичним перерахунком остаточної ціни.
Комбінація формується з вибраних компонентів: заголовок та артикул об’єднуються через «+», а ціна розраховується на льоту з актуальних цін обраних варіантів.
Якщо серед компонентів є фіксована ціна, вона береться за основу, до неї додаються або віднімаються дельти («+» або «-»).
Приклади:
— =100 та +20 → остаточна ціна =120.
— +10 та +15 → результат +25 до основної вартості товару.
— =200, =150, +20 → результат =220 - береться найбільша вартість варіанту.
Обмеження у відображенні та поведінці:
Комбінований варіант розглядається як єдиний для кошика та при збереженні замовлення.
Ця функція дозволяє створювати більш складну та розширену ієрархію товару, об’єднуючи одночасний вибір кольору, ваги, розміру та інших параметрів. Покупець може зручно комбінувати кілька характеристик в одному варіанті, а система автоматично перераховує остаточну ціну на основі актуальних значень вибраних варіантів.
Для одного товару можна створювати до 50 різних комбінацій, що забезпечує гнучкість вибору без перевантаження інтерфейсу.
Комбінація формується з вибраних компонентів: заголовок та артикул об’єднуються через «+», а ціна розраховується на льоту з актуальних цін обраних варіантів.
Якщо серед компонентів є фіксована ціна, вона береться за основу, до неї додаються або віднімаються дельти («+» або «-»).
Приклади:
— =100 та +20 → остаточна ціна =120.
— +10 та +15 → результат +25 до основної вартості товару.
— =200, =150, +20 → результат =220 - береться найбільша вартість варіанту.
Обмеження у відображенні та поведінці:
- При множинних групах деякі способи відображення варіантів можуть бути обмежені.
- Кожен підваріант не може мати власну кнопку «Додати в кошик».
Комбінований варіант розглядається як єдиний для кошика та при збереженні замовлення.
Ця функція дозволяє створювати більш складну та розширену ієрархію товару, об’єднуючи одночасний вибір кольору, ваги, розміру та інших параметрів. Покупець може зручно комбінувати кілька характеристик в одному варіанті, а система автоматично перераховує остаточну ціну на основі актуальних значень вибраних варіантів.
Для одного товару можна створювати до 50 різних комбінацій, що забезпечує гнучкість вибору без перевантаження інтерфейсу.
Порівняння платформ для електронної комерції: Hotlist.biz vs WooCommerce vs OpenCart
Вибір правильної платформи — ключ до успіху будь-якого інтернет-магазину. У цьому огляді ми проведемо детальне порівняння трьох популярних рішень: SaaS-платформи Hotlist.biz, плагіна WooCommerce для WordPress та OpenCart з відкритим кодом. Ми розглянемо їх функціонал, унікальні переваги, реальні вигоди та допоможемо визначити, яке рішення найкраще підійде для вашого бізнесу.
Скорочено поле для імпорту характеристик товарів
Тепер при імпорті характеристик товарів доступні два формати:
- Розширений формат – кожна характеристика зазначається в окремій комірці, що дозволяє точніше задати значення і бачити всі можливі варіанти.
- Стиснений формат – всі характеристики зазначаються в одній комірці. У цьому випадку необхідно вказати тип товару у першому рядку, а кожну характеристику – з нового рядка.
Такий підхід спрощує імпорт і дозволяє гнучко працювати з різними типами товарів та їх характеристиками, зберігаючи коректність даних у базі.
Неможливе можливе: як ми досягли майже 100% у Google PageSpeed
У сучасному веб-світі швидкість завантаження сайту — один із ключових факторів успіху. Нещодавно нам вдалося зробити справжній прорив і підняти показники Google PageSpeed до практично 100% за всіма найважливішими метриками! Це результат комплексної і ретельної оптимізації, у яку ми вклали максимум знань та досвіду.
https://pagespeed.web.dev/analysis?url=https%3A%2F%2Fhotlist.biz%2Fru%2F
Що допомогло досягти такого результату?
1. Оптимізація завантаження скриптів і стилів
Ми впровадили відкладене завантаження JavaScript і CSS, щоб критично важливі для відображення сторінки ресурси завантажувалися першими, а всі інші — асинхронно і лише за потреби. Більшість скриптів на платформі завантажується безпосередньо під час взаємодії з користувачем. Завдяки цьому користувачі бачать контент миттєво, а браузер не блокується зайвими викликами.
2. Стиск і мінімізація даних
Всі скрипти, стилі та зображення були максимально стиснуті і оптимізовані. Використання сучасних форматів зображень WebP/SVG, а також мініфікація CSS і JavaScript значно зменшили загальний обсяг завантажуваних даних.
3. Ефективне кешування та CDN
Ми налаштували кешування на сервері та використали мережу доставки контенту (CDN), що дозволило доставляти файли ближче до користувачів і зменшувати час відповіді сервера.
4. Розумна робота із зображеннями
Для всіх картинок реалізовано адаптивне завантаження — різні розміри і формати для різних пристроїв та роздільних здатностей. Використовуються техніки lazy loading, що дозволяє не завантажувати зображення, поки користувач до них не дійде.
5. Оптимізація шрифтів
Підключення шрифтів виконано з параметром font-display: swap, що знижує час відображення тексту без затримок через завантаження шрифтів.
6. Покращення рендерингу та DOM
Ми зменшили кількість зайвих елементів, оптимізували структуру HTML, прибрали непотрібні перерисовки та повторні обчислення стилів, що дозволило пришвидшити перше відображення і зробити інтерфейс чуйним.
Усі ці заходи дозволили нам практично досягти максимальних значень у Google PageSpeed Insights — а отже, сайт завантажується швидко, плавно та зручно на будь-яких пристроях і мережах.
Неможливе стало можливим завдяки увазі до деталей і комплексному підходу до оптимізації. Це відкриває нові горизонти для покращення користувацького досвіду і підвищення конверсії.
Всі ці переваги ви отримаєте, якщо оберете платформу Hotlist.biz для створення сайтів та інтернет-магазинів.
Додано сторінки виробників за країнами
На платформі Hotlist.biz з’явилася нова сторінка зі списком країн виробників. Тепер відвідувачі ваших інтернет-магазинів зможуть швидко знаходити товари за країною їхнього виробництва.
Крім того, у картці товару назва країни виробника стала активним посиланням. Натиснувши на нього, ви потрапите на сторінку з усіма товарами з тієї ж країни, що й вибраний товар.
Це оновлення зробить пошук і вибір товарів ще зручнішим і допоможе швидше знаходити продукцію потрібного походження.
На платформу Hotlist.biz додано Price Range Swiper — слайдер вибору діапазону цін у пошуковому фільтрі. Тепер користувачі можуть зручно встановлювати мінімальну та максимальну ціну за допомогою повзунків «Від» та «До», які відображаються зверху форми пошуку. Це покращує зручність і точність підбору товарів за ціною.
Для встановлення цього коду виконайте наступні кроки:
- Перейдіть у розділ «Сторінки» → «Віджети HTML».
- У пункті «Price range swiper - Слайдер вибору діапазону цін у пошуковому фільтрі» скопіюйте код JavaScript.
- Створіть блок меню та вставте в нього скопійований код.
- Встановіть позначку «JavaScript / CSS style».
- У появленому полі з параметрами оберіть «Javascript - async».
Для підключення стилів:
- Скопіюйте CSS стиль зі сторінки інструкцій зі створення «Price Range Swiper».
- Вставте його в редактор дизайну у вкладці «CSS стилі».
Код доступний за посиланням: #Price_range_swiper
Оновлення продуктивності сайту: оптимізація JavaScript та відкладене завантаження
Ми провели масштабну оптимізацію JavaScript на сайті для підвищення швидкості завантаження та покращення користувацького досвіду. Тепер більшість бібліотек завантажуються відкладено — лише тоді, коли це справді необхідно.
Всі скрипти винесені в окремі файли і підвантажуються виключно на тих сторінках, де вони використовуються, або коли користувач взаємодіє з відповідними елементами.
В результаті покращена робота наступних функцій:
- Перемотування товарів та статей
- Зміна кількості товарів при додаванні до кошика
- Взаємодія з різновидами товарів
- Додавання товарів до обраного
- Відображення та приховування заповнених значень у пошуковому фільтрі
- Мобільне меню
- Скрипт слайд-меню
- І інші...
Це оновлення значно пришвидшує завантаження сторінок і робить роботу сайту більш плавною та комфортною. Дякуємо, що обираєте нас!
Додано підтримку CSS-файлів у блоках/меню.
Тепер на Hotlist.biz ви можете створювати не лише кешовані JavaScript-файли, а й CSS-файли стилів — прямо в тексті блоків/меню.
Що це дає:
Для створення CSS-файлу вкажіть у параметрах блоку/меню — CSS.
Вставте в текст Блоку/Меню свій CSS-стиль і вкажіть сторінки, на яких його відображати.
Тепер на Hotlist.biz ви можете створювати не лише кешовані JavaScript-файли, а й CSS-файли стилів — прямо в тексті блоків/меню.
Що це дає:
- 🔧 Можливість підключення кастомних стилів лише на потрібних сторінках;
- 📁 Стилі зберігаються в окремому кешованому файлі, а не на самій сторінці;
- ⚡ Забезпечується чисте та швидке завантаження сторінок без вбудованого CSS.
Для створення CSS-файлу вкажіть у параметрах блоку/меню — CSS.
Вставте в текст Блоку/Меню свій CSS-стиль і вкажіть сторінки, на яких його відображати.
У систему додано оновлені сигнали та події для Google Tag Manager і Google Analytics 4 (GA4).
Налаштування виконано з урахуванням вимог GA4 — для максимальної сумісності з новими звітами та автоматичного відстеження конверсій. Підтримку застарілої версії Google Analytics Universal повністю скасовано.
Налаштування виконано з урахуванням вимог GA4 — для максимальної сумісності з новими звітами та автоматичного відстеження конверсій. Підтримку застарілої версії Google Analytics Universal повністю скасовано.
Додано спеціальний CSS-стиль для покращеного відображення таблиці товарів у кошику на мобільних пристроях та екранах шириною менше 450 пікселів. Стиль завантажується лише на сторінці перегляду кошика і не впливає на інші розділи сайту. Тепер оформлення кошика стало зручнішим та зрозумілішим на смартфонах і маленьких екранах.
Тепер на Hotlist.biz реалізована можливість асинхронного імпорту товарів — це означає, що ви можете завантажувати великі обсяги даних без оновлення сторінки та без тимчасового відключення сайту для вас.
🔹 Раніше: під час імпорту сайт ставав тимчасово недоступним для адміністратора, доки не завершиться весь процес. Це було незручно — особливо при великій кількості товарів.
🔹 Тепер: ви можете продовжувати роботу з сайтом, у той час як імпорт проходить у фоні. Процес імпорту більше не блокує інтерфейс, а рядки з файлу обробляються та відображаються в реальному часі прямо на екрані.
💡 Наприклад, при завантаженні 5000 товарів, що містять десятки зображень кожен, час обробки може займати десятки хвилин. Асинхронний імпорт повністю вирішує цю проблему — сайт залишається доступним, а ви бачите хід виконання.
🔹 Раніше: під час імпорту сайт ставав тимчасово недоступним для адміністратора, доки не завершиться весь процес. Це було незручно — особливо при великій кількості товарів.
🔹 Тепер: ви можете продовжувати роботу з сайтом, у той час як імпорт проходить у фоні. Процес імпорту більше не блокує інтерфейс, а рядки з файлу обробляються та відображаються в реальному часі прямо на екрані.
💡 Наприклад, при завантаженні 5000 товарів, що містять десятки зображень кожен, час обробки може займати десятки хвилин. Асинхронний імпорт повністю вирішує цю проблему — сайт залишається доступним, а ви бачите хід виконання.
Ви можете включити опцію «Асинхронний імпорт», щоб завантажувати великі обсяги даних у фоновому режимі.
Переваги:
- Імпорт виконується у фоні — ви можете продовжувати роботу з сайтом під час обробки.
- Браузер не перевантажується, а ви бачите прогрес в реальному часі.
Важливо:
- Якщо ви не використовуєте асинхронний режим, сайт стане тимчасово недоступний особисто для вас на час імпорту. Однак для інших користувачів він продовжить працювати в звичайному режимі.
- Під час асинхронного імпорту детальний лог по кожному товару недоступний — ви не побачите, які конкретно поля були змінені у кожної позиції в реальному часі.
- Після завершення імпорту буде доступний короткий зведений звіт з переліком оновлених, пропущених, видалених та проблемних товарів і різновидів.
Історія доступна в пунктах - «Показати результат попереднього імпорту» або «Попередній процес імпорту».
У системі додано API Commerce, яке дозволяє: отримувати статистику замовлень, додавати, оновлювати та видаляти замовлення, переглядати та керувати категоріями, виробниками, колекціями та товарами. Усе це доступно через захищені запити.
Можливе масове додавання або оновлення товарів, категорій, виробників і колекцій, включаючи характеристики та варіанти.
Детальніше в інструкції: https://hotlist.biz/ua/user_guide.html#hotengine-CommerceAPI
Можливе масове додавання або оновлення товарів, категорій, виробників і колекцій, включаючи характеристики та варіанти.
Детальніше в інструкції: https://hotlist.biz/ua/user_guide.html#hotengine-CommerceAPI