Главная / Инструкции / Рекомендации / Работа с текстом / Оформление текста / Расширенные возможности

Расширенные возможности оформления текста

Корректировка цвета | Корректировка размера | Создание списков | Специальные символы | Расширенные возможности

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

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

Мы подготовили для Вас различные варианты, готовые к применению на сайте.

Как это работает

Любая страница сайта размечена тегами HTML, которые, в свою очередь, имеют индивидуальное оформление, заданное через таблицу стилей (CSS). Ровно также и текст, который вы вводите через визуальный редактор WYSIWYG, имеет свою структуру тегов и применяемое к ним оформление.

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

В ввиде кода страницы это выглядит так:

<h1>Заголовок раздела</h1> 
   <p>Абзац с текстовым содержимым, в котором что-либо описывается.</p>
   <p>Еще один абзац со словом, <strong>выделенное жирным</strong>.</p>
   <p>....</p>

И так далее...

Естественно, помимо заголовков и абзацев, другие, размещенные объекты внутри текста - таблицы, картинки, ссылки имеют свое обозначение и выделяются соотвествующиме тегами.

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

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

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

Чтобы получить доступ к HTML форматированию страницы, перейдите в редактирование раздела и выберите на панели инструментов функцию «Исходный код».

В открывшемся окне, вам необходимо найти участок текста - абзац, который необходимо выделить.

Начало и конец абзаца выделяются тегами - <p>....</p> (открывающий тег и закрывающий). Если необходимо выделить несколько абзацев, то началом будет открывающий тег <p> у первого абзаца, а закрывающим будем считать </p> у последнего. Все, что находится между ними будет оформленно в том виде, который Вы установите.

Готовые варианты оформления

Перед открывающим тегом <p> необходимо разместить HTML-тег с выбранным оформлением, а в конце, после закрывающего тега <p> необходимо разместить другой закрывающий тег - </div>.

Таким образом, у Вас должна получиться следующая конструкция:

<div>
   <p>Абзац с текстовым содержимым, в котором что-либо описывается.</p>
   <p>Еще один абзац со словом, <strong>выделенное жирным</strong>.</p>
</div>

Открывающий <div> (первый) необходимо заменить в соответствии с тем, какой стиль оформления больше подойдет для Вашего сайта.

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

Белый фон, серая рамка, черный шрифт

Пример:

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

Серый фон, темно-серая рамка, черный шрифт

Пример: