Розділ заголовка

Можна додати a Headline розділ to your сторінка безпосередньо, щоб ви могли додати опис сторінки. Якщо ви хочете відобразити зображення та відповідний текст навпроти нього, ви можете використовувати цей розділ.

Завантажене тут зображення не підтримує режим лайтбокс. Його можна змінити, перетягнувши кути зображення.

Цей розділ можна в основному використовувати для сторінки «Про мене/нас». Ви також можете зв’яжіть зображення з будь-якою сторінкою, яку ви бажаєте.

У цій статті:

  1. Додайте розділ заголовка
  2. Управління вмістом
  3. Керування елементами
  4. Змінити макет
  5. Автопідбір тексту
  6. Макет розділу обкладинки
  7. Параметри стилю

Додайте розділ заголовка:

  • До сторінки можна додати розділ. Ви можете або додати розділ до вже існуючої сторінки, або створити нову сторінку на вашому веб-сайті.
  • На вашій сторінці, натисніть на синій + значок додати а Новий розділ на свою сторінку.

  • Тепер ви побачите категорії розділів на лівій стороні.
  • Виберіть Розділи героїв (1) опція та виберіть Headline (2) .

  • Виберіть будь-який макет розділу (3) і натисніть на нього, щоб додати його на свою сторінку.
  • Коли розділ додається, ви можете редагувати текст і завантажувати будь-яке зображення.

Управління вмістом

Після додавання розділу: 

  • Натисніть на Редагувати вміст (1) кнопка.

  • Це відкриє вікно Панель заголовків (2).

Звідси ви можете:

  • Завантажте основне зображення (1) для блоку Headline.
  • Завантажте додаткове зображення (2) для блоку Headline (лише на вибраних макетах).

  • Додавати назва (3), Підзаголовок (4), та Опис (5) блоку Заголовок. Перш ніж додати опис, перевірте цю статтю.

  • Додайте будь-який тип посилання (6) до розділу заголовка. Ви можете додати кнопку/посилання на зображення/іконку соціальної мережі/текстове посилання. Детальніше.
  • Зберегти (7) ваші зміни.


Керування елементами

Розділ заголовка містить Вкладка «Елементи». що дозволяє легко керувати видимістю різних елементів у розділі. Використовуючи прості перемикачі, ви можете ввімкнути або вимкнути певні елементи, не видаляючи чи змінюючи самі елементи.

  • Натисніть Редагувати вміст (1) кнопка.

  • Виберіть Елементи (2) вкладка.
  • Після внесення змін натисніть Зберегти (3) кнопка.

Параметри елементів

  1. Показати зображення: перемикання видимості зображень.
  2. Показати заголовок: керування відображенням заголовка.
  3. Показати субтитри: увімкнення або вимкнення субтитрів.
  4. Показати опис: керування видимістю описів предметів.
  5. Показати кнопки: Вирішіть, чи мають відображатися кнопки для окремих елементів.


Змінити макет

  • Натисніть на Редагувати вміст (1) кнопка.

  • Виберіть макет (2) вкладка.
  • Оберіть LВихід (3) для вашого розділу та Зберегти (4) зміни.

Про Раду

Щоб створити розділ на всю ширину, виберіть будь-який макет у діапазоні від 11 до 16.


Автопідбір тексту

Розділ Autofit Text — це потужний інструмент для створення динамічного та адаптивного текстового вмісту на вашому веб-сайті Pixpa.

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


Додайте розділ Autofit на сторінку

  • Натисніть на синій + значок додати а Новий розділ на свою сторінку.

  • Виберіть Розділи героїв (1) категорію та натисніть на Headline (2) вкладка.

  • З доступних макетів у розділі «Заголовок» прокрутіть донизу та виберіть будь-який з макетів, позначених на скріншоті відповідно до ваших уподобань.


Редагувати розділ Autofit

  • Натисніть на Редагувати блок тексту автопідбору у верхньому правому куті розділу.
  • Відповідно до зміст Ви можете вказати текстовий вміст для розділу за допомогою 1-го, 2-го та 3-го текстові поля.
  • Розмір шрифту тексту буде автоматично налаштовано відповідно до розміру екрана та довжини тексту. нарешті, Зберегти (4) зміни.

Розділ автопідгонки стилю

Налаштуйте стиль розділу з стиль вкладка. Тут ви знайдете такі варіанти:

  1. Висота рядка: укажіть відстань по вертикалі між рядками тексту.
  2. Максимальний розмір шрифту: установіть максимальний розмір шрифту, якого може досягати текст.
  3. Вирівнювання тексту: вирівнювання тексту по горизонталі в межах розділу.
  4. Сімейство шрифтів: виберіть сімейство шрифтів, як-от заголовок 1, заголовок 2, абзац тощо.

Примітка:

Розмір тексту не відповідатиме розміру, зазначеному в розділі дизайну, а регулюватиметься залежно від доступного простору та довжини тексту.


Макет розділу обкладинки

Макет розділу «Обкладинка» можна використовувати, якщо потрібно додати текст, кнопку та фон до розділу. Розділ «Обкладинка» – це найпростіший макет, який можна дуже легко налаштувати.

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

Додати макет розділу «Обкладинка» до сторінки:

  • Тепер ви побачите категорії розділів на лівій стороні.
  • Виберіть Розділи героїв (1) категорію та натисніть на Headline (2) вкладка.

  • З доступних макетів у розділі «Заголовок» прокрутіть донизу та виберіть макет, позначений на скріншоті.

Дізнатися більше про додавання та редагування фрагментів у макеті розділу «Обкладинка».


Параметри стилю

  • Натисніть на Редагувати вміст (1) кнопка.

  • Виберіть стиль (2) вкладка.
  • Змініть стиль для елементів розділу та Зберегти (3) ваші зміни.


Ви матимете кілька варіантів стилю для розділу: 

  1. Параметри стилю зображення
  2. Форма Маска
  3. Параметри межі зображення
  4. Вирівнювання та колір
  5. Параметри інтервалу
  6. Розмір шрифту
  7. Кнопки та посилання

зображень 

  1. Виберіть Imвік Урожай для зображення. Зображення можна встановити як квадратне, коло, альбомне, портретне та динамічне.
  2. Виберіть загальний радіус кута або інший радіус кута для кожної сторони елементів списку та встановіть число (у пікселях) для Кутовий радіус зображень елементів списку.
    Використання кутовий радіус можна створювати різні форми зображення. Якщо ви вкажете тут 500 пікселів, зображення відображатиметься у формі кола.
    Якщо ви вибрали розділені кути, ви можете встановити різний радіус кута для кожного кута. Дізнайтеся більше. 
  3. Виберіть Анімація зображень при наведенні натиснувши на Так.
  4. Вибирайте з різного Стиль анімації для зображень при наведенні.

Коли застосовується макет «Заголовок на всю ширину», ви побачите цю додаткову опцію:

  • Вкажіть колір накладання: Це дозволяє вам застосувати кольорове накладання по всьому розділу заголовка. Ви можете вибрати будь-який колір за допомогою палітри кольорів та керувати його прозорістю за допомогою повзунка непрозорості, що допоможе вам покращити видимість тексту або створити певний візуальний настрій.


Форма Маска

  1. Форма маски: Увімкніть цей перемикач, щоб застосувати маску фігури до зображення в розділі «Заголовок». Після ввімкнення вибрана фігура візуально обріже зображення в цю форму.
  2. Виберіть форму: Вибирайте з різних попередньо визначених форм, щоб застосувати їх до свого зображення. Це дозволяє творчо стилізувати ваш вміст, відображаючи зображення в унікальній формі, як-от заокруглене, ромбоподібне, краплеподібне тощо.

примітки

  • Параметр Shape Mask залежить від макета – Він може не відображатися під макетами, де текст, наприклад заголовок або підзаголовок, відображається поверх зображення.
  • Налаштування Stretch залежить від багатьох факторів – включаючи налаштування розміру зображення, вирівнювання та обрізання, визначені на вкладці «Стиль».
  • Якщо для параметра Обрізання зображення встановлено значення Оригінал, фактичні розміри зображення визначатимуть, чи буде воно розтягнуто вертикально чи горизонтально.


Параметри межі зображення

  1. Увімкнути/вимкнути рамку навколо зображень, перемикаючи перемикач.
  2. Виберіть мати a спільний кордон на всіх сторонах зображень або ви можете вказати межі окремо для кожної сторони.
  3. Вкажіть ширина кордону. Якщо встановлено значення 0, то межа не з’явиться. У вас також є можливість встановити ширину рамки окремо для кожної сторони зображення.
  4. Оберіть виділяє колір із засобу вибору кольорів.
  5. Виберіть потрібний Прикордонний стиль з випадаючого.
  6. Визначте ширина рамки для мобільних пристроїв пристроїв, вирівнявши його за шириною, вибраною для робочого столу.


Вирівнювання та колір 

  1. Вирівняти контент у розділі Заголовок по горизонталі. Ви можете встановити вирівнювання по лівому краю, правому краю або по центру.
  2. Вирівняти контент у розділі Заголовок вертикально. Ви можете налаштувати його вирівнювання вгорі, внизу або по центру.
  3. Виберіть, якщо ви хочете зберегти Базовий колір (колір фону текстового поля) на Стандартний або Спеціальний.
  4. Якщо ви вибрали індивідуальні умови для базового кольору ви можете вибрати виберіть колір фону. Ви також можете вказати помутніння базового кольору.


Розмір і простір 

  1. Вкажіть Зображення ширини для зображення блоку заголовка.
  2. Вкажіть Ширина вмісту для тексту блоку заголовка.
  3. Вкажіть Пробіл або накладання між текстовою карткою та зображенням (у %).
  4. Вкажіть Пробіл під заголовком (у %).
  5. Вкажіть Пробіл під підзаголовком (у %).


текст 

  1. Натисніть на Змінити стиль тексту кнопку, щоб відвідати Дизайн розділ і керуйте розмірами та стилями шрифтів. 
  2. Встановіть назва стиль шрифту для розділу блоку заголовків.
  3. Встановіть Субтитр стиль шрифту для розділу блоку заголовків.
  4. Встановити за замовчуванням Опис стиль шрифту для розділу блоку заголовків.
  5. Увімкніть цю опцію, щоб анімувати будь-які числа присутні в назва та Субтитр поля. Після ввімкнення числові значення відображатимуться з динамічною анімацією підрахунку, що зробить їх візуально привабливішими.


Кнопки та посилання 

Ви можете додавати різні типи кнопок до розділу «Заголовок». Вони такі:

  • Звичайна кнопка (1) Кнопка зображення (2), і Кнопка піктограми (3).

  1. Вкажіть Відстань між різними кнопками / посиланнями.
  2. Вкажіть Пробіл над кнопкою / посилання всередині текстової картки.
  3. Встановіть Ширина кнопки всередині текстової картки.

Розмір кнопки 

  1. Встановіть розмір Звичайна кнопка. Ви можете вибрати один із трьох варіантів: малий, середній і великий.
  2. Вкажіть Висота кнопки зображення у пікселях.
  3. Встановіть Розмір значка кнопки у пікселях.

  1. Встановіть Тип піктограми для кнопки значка.
  2. Виберіть Кольоровий стиль для значка всередині кнопки. Ви можете вибрати фірмовий колір значка або вказати будь-який колір на ваш вибір.
  3. Встановіть Колір значка кнопки значка. Ви побачите цей параметр, лише якщо його ввімкнути Вибраний колір (28).
  4. Якщо ви вибрали індивідуальні умови на попередньому кроці (29) ви можете встановити свій бажаний колір для значка всередині кнопки.
  5. Оберіть Колір фону для кнопки значка.


Подивіться, як працює кутовий радіус: 


Не можете знайти те, що шукаєте?

Зв’яжіться з експертом Pixpa.

Pixpa Studio щойно оновлено. Ми зараз оновлюємо всі скріншоти довідкових статей.