Ми оновили ефект Marquee (рухомий рядок), щоб розширити його функціональність для елементів. Тепер ви маєте ще більше способів додати вашому макету професійний та динамічний вигляд.
Ефект Marquee — це анімація безперервної прокрутки, яка дозволяє елементам плавно та циклічно ковзати по сторінці. Це ідеальний спосіб виділити логотипи клієнтів, відгуки або інші елементи довіри, привертаючи увагу відвідувачів завдяки плавному руху.
Як додати Marquee
Налаштування рухомого рядка починається з вибору правильного типу секції та зміни її макета.
Крок 1: Додайте нову секцію
Натисніть Додати розділ і перейдіть до розділу Макети у лівому меню. Виберіть відповідний макет і натисніть на нього, щоб додати на сторінку.
Крок 2: Відкрийте налаштування макета
Наведіть курсор на розділ. Зліва з’явиться панель керування. Натисніть на іконку макета (крайній правий символ на цій панелі), щоб відкрити налаштування.
Крок 3: Виберіть Marquee
У налаштуваннях натисніть на поточний Тип макета, який за замовчуванням зазвичай встановлений як "Стовпці", і виберіть Marquee в меню.
Налаштування структури
Коли ефект Marquee активовано, ви можете визначити, скільки колонок відображатиметься та якого розміру вони будуть.
Крок 1: Додайте блоки
Наведіть курсор на розділ, щоб знизу з’явилася кнопка "Додати". Натискайте її, щоб додати стільки блоків, скільки вам потрібно.
📌 Примітка: Ви можете почати додавати елементи (наприклад, зображення або текст) у ваші колонки відразу, щоб побачити, як вони виглядають у русі.
Крок 2: Редагуйте кількість колонок
Це налаштування визначає, скільки повних блоків буде відображено на екрані одночасно (від 2 до 6). Щоб змінити це, відкрийте налаштування макета та знайдіть розділ Колонки, щоб обрати бажану кількість.
Крок 3: Визначте ширину блока
Замість того, щоб усі блоки були однакового розміру, ви можете налаштувати ширину окремих блоків за допомогою сітки. За замовчуванням кожен блок має розмір 1x1.
Наведіть курсор на блок, поки не побачите кнопку 1x1 на його індивідуальній панелі керування. Натисніть на неї, щоб вибрати, чи має блок займати більше одиниць (2x, 3x тощо). Максимальна доступна ширина залежить від загальної кількості колонок, яку ви встановили в попередньому кроці.
Редагування анімації та руху
У налаштуваннях макета ви знайдете додаткові параметри для marquee. Давайте розглянемо найважливіші компоненти.
Швидкість: виберіть швидкість від 0 до 4.
Напрямок: За замовчуванням рухомий рядок рухається зліва направо. Активуйте цей перемикач, щоб спрямувати елементи у протилежному напрямку.
Згасання країв: Це створює м’який градієнтний перехід з лівого та правого боків секції. Завдяки цьому елементи плавно з’являються та зникають, а не різко обриваються на межі.
Пауза при наведенні: Якщо цей параметр увімкнено, анімація зупинятиметься щоразу, коли відвідувач наводитиме курсор на рухомий рядок. Це дозволить йому детальніше розглянути конкретний контент.
Стилізація фрейму (рамки)
Ви можете стилізувати рухомий рядок як єдине ціле або надати кожному стовпцю окремий вигляд.
Загальна рамка Marquee
Щоб додати рамку навколо всієї зони прокрутки, відкрийте Налаштування макета, перейдіть на вкладку Дизайн (символ пензлика) і виберіть між типами "Колір", "Лінія" та "Прозорий".
Ви також можете встановити загальний фон, використовуючи колір, градієнт, зображення або навіть відео. Ця опція доступна для типу "Колір".
Рамка для окремого стовпця
Щоб виділити конкретний блок, наведіть на нього курсор, щоб з’явилася його панель керування. Натисніть на символ пензлика, щоб застосувати унікальну рамку або фон саме до цього блоку.
Поширені питання та їх вирішення
Чи можу я поєднувати різні елементи в одному рухомому рядку?
Чи можу я поєднувати різні елементи в одному рухомому рядку?
Безумовно! Ви можете розміщувати текст, зображення, кнопки, іконки або будь-які інші елементи всередині блоків рухомого рядка так само, як і у звичайних колонках.
Чи є обмеження на кількість блоків, які можна додати?
Чи є обмеження на кількість блоків, які можна додати?
Обмеження немає, проте ми рекомендуємо дотримуватися розумної кількості блоків. Це забезпечить плавну роботу сайту та найкращий досвід для ваших відвідувачів.
💡Бажаєте залишити відгук до цієї статті? Будь ласка, напишіть у наш чат або за адресою support@onepage.io, і ми зможемо її покращити. Дякуємо!🙂