Skip to content

Як змінити дизайн вітрини ​

Візуальне оформлення вашого магазину безпосередньо впливає на довіру покупців та рівень конверсії. У розділі Дизайн на платформі Khyst ви можете повністю кастомізувати зовнішній вигляд вітрини в реальному часі.


1. Налаштування профілю кріейтора ​

Шапка вашої вітрини містить ваше ім'я, опис профілю (Bio), аватар та соціальні мережі.

  • Аватар, Назва магазину та Bio (Опис): Редагуються у розділі Магазин (основна інформація профілю) або Налаштування (фото профілю).
  • Соціальні мережі: Налаштовуються у розділі Дизайн у відповідному однойменному блоці. Додайте посилання на ваші профілі (Instagram, Telegram, TikTok, YouTube тощо), і відповідні іконки автоматично з'являться у шапці вашої вітрини.

Налаштування профілю кріейтора


2. Вибір фону вітрини ​

Ви можете налаштувати фон вашої вітрини у два способи:

  • Колір (Готові пресети): Оберіть один із готових колірних пресетів або градієнтів. Кожен пресет уже збалансований за контрастністю та автоматично змінює колір тексту для досягнення найкращої читабельності.
  • Фото (Власне зображення): Завантажте власне фонове зображення з комп'ютера або телефону, щоб зробити дизайн повністю унікальним.

Налаштування фону та колірних пресетів


3. Налаштування карток товарів ​

Виберіть, як саме товари будуть розміщені на вітрині. Доступні два формати карток:

  • Макет Hero: Велике та виразне зображення обкладинки (пропорція 3:4) розміщується зліва, а деталі (назва, короткий опис, ціна та кнопка) — справа. Цей макет чудово підходить, якщо у вас невелика кількість товарів (до 5) і кожна обкладинка має важливе значення.
  • Макет Compact: Картка займає всю ширину екрана з невеликим квадратним зображенням зліва та кнопкою покупки внизу. Ідеально підходить для великих каталогів товарів, оскільки економить місце на мобільних пристроях.

4. Шрифти та оформлення тексту ​

Ви можете налаштувати характер вашого бренду через типографіку. Khyst підтримує вибір перевірених шрифтів окремо для двох типів тексту:

  1. Шрифт заголовків — для назви вітрини та назв товарів.
  2. Шрифт основного тексту — для коротких описів, bio та тексту кнопок.

5. Стиль та форма кнопок ​

Кнопка покупки — це головний інтерактивний елемент сторінки. Налаштуйте її під свій стиль:

Форма кнопок: ​

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

Стиль відображення: ​

  • Заливка — класична кнопка з яскравим суцільним кольором.
  • Обведення — прозора кнопка з тонкою контрастною рамкою (мінімалізм).
  • Тінь — кнопка з м'якою тінню, що додає об'єму та ефекту натискання.

6. Кольорова гама магазину ​

Оберіть один акцентний колір для вашого магазину (наприклад, фірмовий колір вашого бренду). Цей колір буде використаний для кнопок, цін, активних вкладок та інших ключових елементів інтерфейсу.

Розумний дизайн: Khyst автоматично підбере гармонійні відтінки тексту та фону карток залежно від обраного вами фону або кольорової гами, щоб забезпечити 100% читабельність і відповідність стандартам доступності.


7. Живий перегляд (Live Preview) ​

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

На мобільних пристроях або планшетах для перегляду результату натисніть кнопку Відкрити прев'ю (на комп'ютерах симулятор відображається постійно у правій частині екрана).

Мобільний симулятор та інтерфейс налаштування дизайну


Наступні кроки ​

Тепер, коли вітрина виглядає неперевершено, налаштуйте прийом реальних оплат:

Маєш хист - монетизуй