Выделение части текста (+видео)

Словарь

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

Блок выделяющий – тег, с помощью которого можно выделить заранее настроенным стилем часть текста в текстовом редакторе.

Назначение

С помощью блоков можно выделить часть текста в редакторе.

Работа с блоками

Имеется возможность задать цвета и размеры текста, заголовков в таком блоке. Для этого пройдем в «Редактирование дизайна сайта» через верхнее меню редактирования (Рисунок 1).

Верхнее меню сайта. редактировать дизайн сайта

Рисунок 1 - Верхнее меню сайта. Редактировать дизайн сайта

Здесь, через меню редактирования дизайна сайта, пройдем в пункт «Редактировать цвета сайта» (Рисунок 2).

Редактирование дизайна сайта. Изменить цвета сайта

Рисунок 2 — Редактирование дизайна сайта. Изменить цвет сайта

Здесь можно настроить цвета и размеры текста в выделяемом блоке. В нижней части страницы становятся доступны для настройки следующие поля (Рисунок 3):

  • Цвет заголовка h1 в выделенном блоке;

  • Цвет заголовка h2 в выделенном блоке;

  • Цвет заголовка h3 в выделенном блоке;

  • Цвет текста в выделенном блоке;

  • Цвет заднего фона в выделенном блоке;

  • Размер заголовков h1 в выделенном блоке, в px;

  • Размер заголовков h2 в выделенном блоке, в px;

  • Размер заголовков h3 в выделенном блоке, в px;

  • Размер текста в выделенном блоке, в px.

Настройка цветов и размеров стиля блока

Рисунок 3 - Настройка цветов и размеров стиля блока

Настраиваем эти поля. Там, где надо выбрать цвет, выбираем цвет из выскакивающей палитры. Там, где надо указать размер шрифта, указываем размер в px цифрами. Сохраняем установленные цвета и размеры (Рисунок 4).

Настройка цветов и размеров стиля блока. Заполнено

После настройки цветов и размеров текста в выделяющем блоке мы сможет применять его к тексту везде, где есть текстовый редактор. Например, завернем часть текста в текстовом блоке не главной странице. Для этого, выделяем нужный текст, затем нажимаем на кнопку «div» в редакторе. Сохраняем сделанные изменения (Рисунок 5).

 

Выделение части текста настроенным стилем

Рисунок 5 - Выделение части текста настроенным стилем

Желаемый блок сразу выделится и к нему применится те цвета и размеры, которые мы настраивали ранее. Мы увидим результат не только после сохранения, но и в текстовом редакторе (Рисунок 6).

Выделенная часть текста

Рисунок 6 - Выделенная часть текста

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

Варианты использования модуля

Используя выделяющие блоки можно:

  • Акцентировать внимание пользователя на определенном тексте;

  • Украсить сайт с длинным текстом, сделать его более приятным и удобным для прочтения.

Вернуться к разделу