Как работать с текстовыми блоками в Wagtail

В Wagtail-проектах могут использоваться разные редакторы текста. Чаще всего редактор сталкивается со стандартным rich text. В проектах CompanionAI также может использоваться Quill-редактор, если это заложено в интерфейс конкретного сайта. Quill это визуальный редактор форматирования текста, который может быть встроен в проект для более удобной работы с контентом.

Для кого эта статья

Эта статья для редакторов, контент-менеджеров, администраторов сайта и сотрудников компании, которые добавляют или редактируют текст на страницах Wagtail.

Материал также будет полезен руководителям. Он помогает понять, почему удобство работы с текстом зависит не только от CMS, но и от того, как проект настроен разработчиком.

Что важно знать перед началом

Интерфейс Wagtail может отличаться от проекта к проекту. На одном сайте текстовый блок может быть простым полем с несколькими кнопками. На другом — стандартным rich text с заголовками, списками и ссылками. На третьем — Quill-редактором с другой панелью инструментов.

Это нормально. Wagtail часто настраивают под конкретный сайт, структуру контента и задачи редакции.

Не все кнопки доступны всем пользователям и не во всех текстовых блоках. Иногда это связано с правами доступа. Иногда — с настройками конкретного поля. Иногда разработчик специально ограничивает возможности, чтобы сохранить единый стиль сайта.

Важно: если в редакторе нет кнопки выбора цвета, размера шрифта или сложного оформления, это не обязательно ошибка. Часто такие возможности отключают специально, чтобы страницы сайта выглядели единообразно.

Перед публикацией текст нужно проверять через предпросмотр. Админка показывает содержимое для редактирования, а сайт отображает его уже в реальном дизайне.

Главное правило простое: текстовый блок нужен для текста. Если внутри него регулярно приходится собирать сложные элементы — FAQ, карточки, кнопки, предупреждения, таблицы или врезки, — лучше обсудить и добавит отдельный управляемый блок.

Где в Wagtail встречаются текстовые блоки

Текстовый блок может находиться в разных местах страницы. Это зависит от того, как устроен конкретный Wagtail-проект.

Чаще всего текстовые блоки встречаются в основной области страницы: например, в статье, новости, описании услуги, разделе базы знаний или информационном материале.

Но текст может быть и внутри других элементов: в карточке услуги, блоке преимущества, описании раздела, FAQ, промо-блоке, вкладке, форме, врезке или другом настраиваемом блоке.

Для редактора это означает простую вещь: не всегда текст на странице редактируется в одном большом поле. Иногда страница собирается из нескольких блоков, и каждый блок отвечает за свою часть содержимого.

Например, у страницы услуги может быть отдельное поле для заголовка, отдельное поле для краткого описания, текстовый блок для основного описания, блок преимуществ, блок FAQ и CTA-блок с кнопкой. CTA-блок — это блок с призывом к действию, например «Оставить заявку», «Получить консультацию» или «Скачать материал».

Wagtail силён тем, что позволяет не сваливать всё в одно поле, а разделять содержимое по смыслу.

Обычное поле, rich text и отдельный блок: в чём разница

В админке Wagtail редактор может встретить разные типы полей и блоков. Важно не путать их между собой.

Обычное текстовое поле обычно не предназначено для сложного оформления. В него вводят короткие фразы: название, подпись, краткое описание, текст кнопки.

Rich text подходит для обычного форматированного текста. В нём можно работать с абзацами, подзаголовками, списками, ссылками и простыми выделениями.

Quill-редактор тоже используется для форматированного текста, но может иметь другой интерфейс и другую панель инструментов. В проектах CompanionAI он может применяться там, где редактору нужен более удобный или гибкий способ работы с текстом.

Отдельный контентный блок нужен для повторяемых элементов. Например, если на сайте часто используются врезки «Важно», FAQ, карточки преимуществ или CTA с кнопкой, лучше сделать их отдельными блоками. Так редактор заполняет понятные поля, а сайт сам показывает элемент в нужном дизайне.

Стандартный rich text Wagtail

Стандартный rich text в Wagtail — это редактор форматированного текста. Он позволяет не просто вводить текст, а задавать его базовую структуру.

Обычно через rich text можно оформлять абзацы, подзаголовки, списки, ссылки и отдельные выделения. В зависимости от проекта могут быть доступны цитаты, документы, изображения или встроенный контент.

Но конкретный набор возможностей зависит от настроек сайта. В одном проекте редактор увидит только несколько базовых кнопок. В другом — более широкий набор инструментов.

Это не всегда хорошо или плохо само по себе. Ограниченный редактор часто делает работу безопаснее. Чем меньше случайных вариантов оформления, тем проще сохранить единый вид сайта.

Что можно редактировать в стандартном rich text

В стандартном rich text чаще всего можно оформлять обычные абзацы, задавать подзаголовки, создавать маркированные и нумерованные списки, добавлять ссылки, выделять отдельные слова или фразы жирным и использовать курсив.

Иногда редактор также позволяет добавлять цитаты, документы, изображения или встроенный контент. Но это зависит от конкретного проекта.

Использовать эти инструменты нужно не ради украшения, а ради смысла.

Подзаголовок помогает разделить текст на части. Список помогает показать перечисление или порядок действий. Ссылка помогает перейти к связанному материалу. Жирное выделение помогает обратить внимание на важную мысль.

Если форматирование не помогает читателю, оно лишнее.

Почему набор кнопок может отличаться

В Wagtail разработчик может настроить, какие возможности будут доступны в текстовом редакторе.

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

Если редактору действительно нужен новый формат, это лучше решать не ручным обходом, а настройкой проекта. Иногда достаточно добавить возможность в редактор. Иногда правильнее сделать отдельный блок.

Например, если редактору нужно один раз выделить важное предупреждение, можно обойтись обычным текстом. Но если предупреждения появляются на десятках страниц, лучше сделать отдельный блок «Важно». Тогда все такие элементы будут выглядеть одинаково, а редактору не придётся каждый раз собирать оформление вручную.

Quill-редактор в проектах CompanionAI

В проектах CompanionAI для работы с текстом также может использоваться Quill-редактор.

Quill — это визуальный редактор форматированного текста. Редактор видит панель инструментов и может оформлять текст без знания HTML: выбирать заголовки, делать списки, добавлять ссылки, цитаты, выделения и другие элементы, если они включены в конкретном проекте.

Для пользователя это выглядит просто: вместо стандартного rich text он видит другой редактор с другой панелью и другим поведением при работе с текстом.

Зачем может использоваться Quill

Quill может использоваться в проектах, где нужен более удобный или гибкий редакторский интерфейс.

Например, Quill может быть полезен, если редакторам важно быстро работать с форматированным текстом, видеть понятную панель инструментов, использовать настроенные форматы и меньше зависеть от технических деталей.

Команда CompanionAI может использовать Quill там, где стандартного интерфейса недостаточно по удобству или где проекту нужен другой сценарий редактирования текста.

При этом всё зависит от конкретного сайта. В одном проекте Quill может быть уместен. В другом достаточно стандартного rich text Wagtail. Хороший редакторский интерфейс выбирают под задачу, а не ради модного названия.

Что меняется для редактора, если используется Quill

Если в проекте используется Quill, для редактора меняется прежде всего интерфейс.

Может иначе выглядеть панель инструментов. Может отличаться поведение при вставке текста. Могут быть другие кнопки для заголовков, списков, ссылок, цитат или других элементов.

Но общий принцип остаётся тем же: текст нужно структурировать, а не вручную собирать внутри одного поля мини-лендинг.

Если в Quill есть кнопка списка, список нужно оформлять через неё. Если есть формат заголовка, заголовок нужно назначать через редактор, а не делать жирным текстом. Если есть инструмент ссылки, ссылку лучше добавлять через него, а не вставлять голый URL в середину абзаца.

Как правильно вставлять текст

Текст для сайта часто готовят заранее: в Word, Google Docs, Notion, Яндекс Документах или другом редакторе. Это нормально. Проблемы начинаются, когда вместе с текстом в Wagtail попадает лишнее форматирование.

При вставке могут переноситься шрифты, размеры, цвета, отступы, скрытые стили, странные пробелы и переносы. В админке это может выглядеть терпимо, а на сайте внезапно проявиться как разный размер текста, кривые списки или лишние расстояния.

Поэтому после вставки текст нужно привести в порядок средствами Wagtail или Quill.

Вставка из Word и Google Docs

Если вы копируете текст из Word или Google Docs, проверьте его после вставки.

Чаще всего проблемы возникают со списками, подзаголовками, ссылками, пустыми строками и выделениями. Например, список может вставиться как обычные строки с дефисами. Подзаголовок может стать просто жирным абзацем. Ссылка может выглядеть как ссылка, но вести не туда или не работать.

Безопасный подход такой: вставить текст без лишнего форматирования, а затем оформить его уже внутри редактора Wagtail или Quill.

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

Заголовки, абзацы и списки

Хороший текстовый блок держится не на количестве кнопок в редакторе, а на нормальной структуре.

Редактору важно следить за тремя вещами: заголовками, абзацами и списками. Если они оформлены аккуратно, текст читается легче, страница выглядит спокойнее, а пользователю проще понять содержание.

Как использовать подзаголовки

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

Не стоит использовать заголовок только потому, что «так крупнее». Размер, цвет и внешний вид заголовка задаются стилями сайта. Редактор выбирает не внешний вид, а уровень и смысл.

На странице обычно уже есть основной заголовок H1. Внутри текстовых блоков чаще используются H2, H3 или другие уровни, если они доступны в проекте. Поэтому H1 внутри текстового блока обычно не нужен: он уже отвечает за название всей страницы.

Плохой подход — сделать обычную фразу жирной и считать её заголовком.

Лучший подход — выбрать нужный уровень заголовка через редактор, если такая возможность есть.

Так текст становится понятнее не только визуально, но и структурно.

Как оформлять абзацы

Абзац — это отдельная мысль. Если в одном абзаце смешаны вводная часть, инструкция, предупреждение и вывод, читать такой текст тяжело.

Но обратная крайность тоже плоха. Не нужно переносить каждое предложение на новую строку просто ради воздуха. Текст начинает выглядеть рваным, а смысл распадается.

Лучше придерживаться простой логики: один абзац — одна небольшая мысль или связанная группа мыслей.

Плохо: один огромный абзац на пол-экрана, где говорится обо всём сразу.

Лучше: несколько коротких абзацев, каждый раскрывает отдельную часть темы.

Как использовать списки

Списки нужны, когда есть перечисление, набор условий, характеристики или порядок действий.

Если вы описываете шаги, используйте нумерованный список. Если перечисляете равноправные пункты, подходит маркированный список.

Но списки не должны заменять нормальное объяснение. Если статья состоит почти только из списков, она начинает напоминать склад запчастей: всё вроде полезное, но собрать из этого смысл должен сам читатель.

Хороший список помогает быстро увидеть структуру. Плохой список просто дробит текст на куски.

Если пунктов слишком много, подумайте: возможно, часть информации лучше оформить абзацами, таблицей или отдельным блоком.

Ссылки и выделения в текстовом блоке

Ссылки и выделения помогают читателю ориентироваться в тексте. Но ими легко злоупотребить.

Задача редактора — выделять важное, а не превращать страницу в набор акцентов, где всё кричит одновременно.

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

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

Не нужно выделять жирным целые абзацы. Если выделено всё, не выделено ничего. Это не новый закон физики, но в редактуре работает безотказно.

Курсив стоит использовать осторожно. Он может подойти для уточнений, терминов или коротких смысловых выделений, но в больших объёмах ухудшает читаемость.

Жирный текст не должен заменять заголовки. Если фраза является заголовком раздела, используйте формат заголовка, если он доступен в редакторе.

Ссылки

Ссылка должна быть понятной по тексту.

Лучше писать не «нажмите здесь», а «откройте инструкцию по добавлению ссылок» или «перейдите к статье о публикации страниц».

Голые URL внутри обычного текста чаще всего не нужны. Вместо этого лучше выделить понятный фрагмент текста и добавить к нему ссылку через инструмент редактора.

После добавления ссылки её нужно проверить в предпросмотре. Особенно если ссылка ведёт на внутреннюю страницу, документ или внешний сайт.

Подробную работу со ссылками лучше вынести в отдельную инструкцию. В этой статье достаточно запомнить принцип: ссылка должна помогать читателю, а не просто присутствовать в тексте для галочки.

Когда текстовый блок лучше заменить отдельным блоком

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

Например, если редактор каждый раз вручную пишет «Важно», выделяет это слово жирным, добавляет вокруг пустые строки и вставляет пояснение, это явный кандидат на отдельный блок «Важное примечание».

Такой блок можно настроить один раз. После этого редактор будет заполнять понятное поле, а сайт сам покажет врезку в правильном дизайне.

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

Это одна из сильных сторон Wagtail. CMS позволяет не заставлять редактора каждый раз вручную повторять оформление, а сделать нормальный инструмент под задачу.

Пример эксплуатации

Допустим, редактор подготовил текст для страницы услуги в Google Docs.

Сначала он открывает нужную страницу в админке Wagtail и находит текстовый блок. Затем вставляет текст, проверяет абзацы и удаляет лишние пустые строки.

После этого редактор назначает подзаголовки через инструменты редактора, оформляет преимущества услуги списком, добавляет ссылку на связанную услугу и сохраняет черновик.

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

Если в проекте используется Quill, логика остаётся такой же. Редактор работает через панель Quill: выбирает формат заголовка, список, ссылку или другое доступное действие. Но он всё равно не управляет дизайном вручную. Внешний вид текста задаётся сайтом.

Если после такой проверки видно, что редактору регулярно не хватает нужного формата, это повод не мучить rich text, а обсудить отдельный блок или настройку редактора.

Когда обращаться к разработчику

Обращение к разработчику — это не признак того, что редактор не справился. В Wagtail это нормальная часть эксплуатации сайта.

К разработчику стоит обратиться, если в редакторе нет нужной кнопки, текстовый блок не поддерживает нужный формат или после сохранения текст на сайте выглядит неправильно.

Также помощь нужна, если требуется добавить Quill, изменить его панель инструментов, ограничить лишние возможности редактора или, наоборот, добавить полезные форматы.

Отдельный повод для обращения — повторяемые элементы. Если редакторы регулярно вручную собирают FAQ, CTA, предупреждения, цитаты, карточки, таблицы или похожие блоки, это сигнал, что интерфейс нужно доработать.

Правильная логика такая: если задача повторяется, её лучше превратить в нормальный управляемый блок.

Так Wagtail становится удобнее не только для разработчика, но и для редактора. Редактор заполняет понятные поля, сайт показывает результат в едином стиле, а команда меньше тратит времени на исправление случайного оформления.