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

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

У цій статті:

• Кнопка плюс (+)
• Інструменти штучного інтелекту
• Формат – змінити стиль шрифту
• Жирний / Курсивний
• Лінія – додайте лінію
• Більше параметрів форматування
• Вирівнювання
• Колір тексту
• Список – Маркований / Нумерований
• Посилання – Додати посилання
• Зображення – додайте зображення
• Emoji
• Таблиця – додати таблиці
• Вставити зміст
• Якір
• Перегляд коду HTML
• Спеціальні параметри розділу

---

Додавання елементів за допомогою кнопки «+».

Одним із найбільших удосконалень у новому редакторі є кнопка «+» , яка відкриває меню з різноманітними елементами контенту, які можна вставляти в текстову область.

Елементи, доступні під кнопкою «+»:

• Інструменти ШІ: Використовуйте допомогу в написанні за допомогою штучного інтелекту, щоб генерувати ідеї щодо вмісту, переписувати текст або швидко створювати вміст. Детальніше.
• Тексти пісень: Додайте стандартний текст абзацу.
• Заголовок: Вставте різні рівні заголовків (H1, H2, H3 тощо.) для кращої ієрархії вмісту.
• Зображення: Завантажуйте та вставляйте зображення безпосередньо в текст.
  • Ви можете завантажити або вставити зображення, ввівши URL-адресу.
• Список справ: Створити контрольні списки з інтерактивними прапорцями.
• список: додавати кульові точки or нумеровані списки для структурованого вмісту.
• Вставити: Вставте зовнішній вміст, наприклад відео, карти, аудіофайли та iframe.
• Таблиця: Додайте таблиці для представлення структурованих даних. Під опцією таблиці ви знайдете такі додаткові параметри.
  • Додайте голову – Вставляє рядок заголовка у верхній частині таблиці, який можна використовувати для заголовків стовпців.
  • Додайте стовпець перед – Додає новий стовпець ліворуч від вибраного стовпця.
  • Додайте стовпець після – Додає новий стовпець праворуч від вибраного стовпця.
  • Додайте рядок нижче – Вставити новий рядок під вибраним рядком.
  • Додайте рядок вище – Вставити новий рядок над вибраним рядком.
  • Зняти голову – Вилучає рядок заголовка з таблиці.
  • Видалити стовпець – Видаляє вибраний стовпець.
  • Видалити рядок – Видаляє виділений рядок.
  • Видалити таблицю – Видаляє всю таблицю з редактора.
• Цитата: Виділіть текст як a блокова цитата для наголосу. Це створює окремий текстовий блок із вертикальною лінією ліворуч, яка візуально відокремлює його від решти вмісту, щоб виділити цитований текст.
• Фрагмент коду: Вставте та відформатуйте HTML, CSS, JavaScript або інші мови програмування в межах вмісту.
• Лінія: Додавати горизонтальний роздільник розділити розділи вмісту.

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

  • Кілька макетів стовпців: виберіть один, два, три або чотири стовпці, щоб упорядкувати вміст різними способами.
  • Настроювані коефіцієнти розподілу: виберіть попередньо визначені співвідношення, наприклад 60/40 або 40/60, щоб контролювати ширину кожної секції.
  • Вкладені блоки: ви можете вибрати блок і створити в ньому кілька окремих блоків для кращої організації.
• Обгортка: Згрупуйте кілька елементів разом для кращої організації.
• Вставити зміст: Створіть зміст на основі заголовків документів, що спростить навігацію. Це корисно для блогів, навчальних посібників та довгих статей, дозволяючи читачам швидко переходити до розділів.

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

---

Інструменти штучного інтелекту

Функція «Інструменти штучного інтелекту» в текстовому редакторі Pixpa дозволяє покращувати вміст за допомогою штучного інтелекту. Ось доступні варіанти:

• Перефразуйте – Змінити виділений текст, зберігаючи оригінальне значення. Це допомагає покращити читабельність або змінити формулювання речень для кращої ясності.
• Вкорочувати – Згорніть виділений текст, щоб зробити його більш лаконічним, зберігаючи ключову інформацію.
• Подовжити – Розширте виділений текст, додавши відповідні деталі, щоб зробити його більш описовим та інформативним.
• Спростити – Перепишіть текст, використовуючи більш просту мову, щоб полегшити його розуміння, зберігаючи початковий намір.
• Правильна граматика – Автоматично перевіряйте та виправляйте граматичні помилки у виділеному тексті, покращуючи його точність і читабельність.
• Перекласти – Перекладіть виділений текст на іншу мову, що дозволить вам легко створювати багатомовний вміст.

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

---

Формат – змінити стиль шрифту

Ви можете використовувати різні типи стилів шрифтів на своєму веб-сайті (одночасно), які будуть вказані в розділі «Дизайн» . Це поширений стиль дизайну, який використовується на всьому веб-сайті.

Усі стилі шрифтів зазначено в розділі дизайну . Ви також можете натиснути «Керування шрифтами» , що є останньою опцією у випадаючому списку після натискання кнопки «Текст» . Тепер ви можете переглянути та налаштувати такі шрифти, а також редагувати стиль шрифту, розмір, колір, товщину, висоту рядка та інтервал між літерами:

• Heading 1
• Heading 2
• Heading 3
• Heading 4
• Текст абзацу (малий і великий)
• Заголовок 1 дуже великий

Ось знімок екрана стилю Заголовок 1. Тут також можна редагувати інші шрифти абзаців заголовків.

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

---

Жирний/курсив

• Сміливий – Виділений текст стане жирним, якщо натиснути цю кнопку. У HTML для цього використовується тег.
• курсивний – Виділений текст стане курсивом, коли його клацнути. У HTML для цього використовується

---

Лінія – додайте лінію

Редактор дозволяє додати горизонтальну лінію. Натискання цієї піктограми додасть лінію до місця розміщення курсору.

---

Більше параметрів форматування

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

• код – Форматує виділений текст як вбудований код або фрагмент коду. Це корисно для відображення програмного або технічного вмісту.
• Підкреслення – Додає підкреслення до виділеного тексту для виділення.
• Якір – Додає іменований анкор до вибраного тексту, що дозволяє створювати внутрішні посилання, які ведуть безпосередньо до цього конкретного розділу на тій самій сторінці. Корисно для створення змісту або внутрішньосторінкової навігації.
• Верхній індекс – Відображення виділеного тексту трохи вище базової лінії звичайного тексту (наприклад, X²). Зазвичай використовується для математичних виразів і виносок.
• Індекс – Відображення виділеного тексту трохи нижче базової лінії звичайного тексту (наприклад, H₂O). Корисно для хімічних формул та інших спеціальних позначень.
• Виділіть – Виділяє виділений текст фоновим кольором, щоб привернути увагу до важливого вмісту.
• Віддалений – Закреслює виділений текст, щоб позначити видалення або виправлення.
• Очистити всі стилі – Видаляє все застосоване форматування з виділеного тексту, відновлюючи його стиль за замовчуванням.

---

Вирівнювання

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

---

Колір тексту

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

Окрім цього, ви також можете вказати колір фону для виділеного тексту тут.

Примітка: Ви можете вказати будь-який інший власний колір, недоступний у палітрі кольорів, у параметрі «Встановити колір» , ввівши шістнадцятковий код кольору.

---

список

Ви можете легко перетворити текст на списки з відступами, щоб упорядкувати їх.

• Список маркерів – Виділений текст буде відформатовано як маркований список. У HTML для цього використовується набір і теги.
• пронумерований список – Виділений текст буде відформатовано як нумерований список. У HTML для цього використовується набір і теги.

---

Посилання – додайте посилання до тексту

Редактор дозволяє вставляти посилання на будь-який текст. Ви можете підключити наявні сторінки веб-сайту або будь-який інший веб-сайт/блог/файли PDF тощо.

Виділення тексту та натискання цієї кнопки відкриє невелике модальне вікно, де ви можете ввести цільову URL-адресу, вибрати, чи відкривати в новому вікні, або вибрати посилання на іншу сторінку на власному сайті. У HTML використовується тег Link Text

---

Зображення – додайте зображення

Ви можете легко додавати зображення до свого вмісту за допомогою опції «Додати зображення» в текстовому редакторі Pixpa. Незалежно від того, чи бажаєте ви завантажити зображення зі свого пристрою чи вставити їх за допомогою URL-адреси, ця функція забезпечує бездоганний спосіб покращити ваші публікації візуальними елементами.

• Вставити зображення через URL – Ви можете вставити URL-адресу зображення та натиснути кнопку «Вставити», щоб додати його безпосередньо на сторінку.
• Завантажити зображення з пристрою – Ви можете перетягнути зображення в призначене поле для завантаження або клацнути всередині поля, щоб вибрати зображення зі свого пристрою.

---

Emoji

Параметр Emoji в текстовому редакторі Pixpa дозволяє покращити ваш вміст різними емодзі. Емодзі можна використовувати, щоб зробити ваш вміст більш виразним, підкреслити або передати емоції весело та творчо.

---

таблиця

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

Параметри редагування таблиці:

• Додати голову – Додає рядок заголовків у верхній частині таблиці, щоб виділити заголовки стовпців.
• Додати стовпець перед – Вставляє новий стовпець ліворуч від вибраного стовпця.
• Додати стовпець після – Вставляє новий стовпець праворуч від вибраного стовпця.
• Додайте рядок нижче – Вставляє новий рядок під вибраним рядком.
• Додайте рядок вище – Вставляє новий рядок над вибраним рядком.
• Зняти голову – Видаляє заголовок таблиці, якщо він доданий.
• Видалити стовпець – Видаляє вибраний стовпець із таблиці.
• Видалити рядок – Видалення виділеного рядка з таблиці.
• Видалити таблицю – Повністю видаляє таблицю з редактора.

---

Вставити зміст

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

---

Якір

Інструмент «Якір» дозволяє додавати унікальний HTML-ідентифікатор до розділу або абзацу вашої публікації. Це корисно для створення внутрішніх посилань на сторінки (посилань-стрибків), що дозволяє відвідувачам натискати на посилання та переходити безпосередньо до певної частини сторінки.

Як ним користуватися:

1. Клацніть будь-де в абзаці або розділі, який потрібно закріпити.
2. На панелі інструментів натисніть кнопку Значок якоря.
3. З’явиться спливаюче вікно з назвою «Якір».
4. Перейдіть на вкладку «Додати або змінити ідентифікатор» введіть унікальний ідентифікатор (наприклад, paragraph-2).
5. Натисніть Зберегти.

Важливі примітки:

• Ідентифікатор має бути в нижньому регістрі, містять відсутні пробіли, і використовувати дефіси якщо це необхідно.
• Після встановлення ви можете додати посилання на цей анкор за допомогою #your-id в кінці вашої URL-адреси.
  • приклад: https://yourwebsite.com/page#paragraph-2

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

---

Перегляд коду HTML

Вікно редактора може працювати як візуальний редактор (WYSIWYG) або як редактор HTML.

Однак ви можете перейти до редактора HTML, клацнувши його. Ви можете змінити будь-що з перегляду коду, якщо знаєте, як це зробити, або ви також можете надіслати запит команді підтримки Pixpa, якщо вам потрібна допомога.

---

Спеціальні параметри розділу

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

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

• Якір – Додає ідентифікатор прив’язки до блоку, щоб ви могли створювати посилання на сторінці, які ведуть безпосередньо до цього розділу.
• Переміщення вгору / переміщення вниз – Змініть положення розділу у вашому вмісті, перемістивши його вгору або вниз.
• Колір – Змінити колір тексту для вибраного блоку.
• Колір фону – Встановіть колір фону за текстом у блоці для виділення або контрасту.
• Кордон – Додайте або змініть рамки навколо розділу, щоб більш ефективно структурувати вміст.

• Відстань – Налаштовує відступи навколо блоку, включаючи верхній, нижній та бічні частини, що дозволяє точніше контролювати інтервали та макет.

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

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

---

Висновок

WYSIWYG-редактор Pixpa пропонує сучасний , багатофункціональний та інтуїтивно зрозумілий досвід редагування контенту. Завдяки покращеним елементам контенту, інструментам штучного інтелекту, вбудовуванню медіа та структурованому форматуванню створення захопливих сторінок та дописів у блогах тепер ефективніше, ніж будь-коли.

Використовуючи ці функції, ви можете покращити свій контент , підвищити залученість користувачів та створити безперебійний досвід користування веб-сайтом.