n-wp.ru — блог о WordPress
Как настроить стиль цитат в темах WordPress | n-wp.ru

Как настроить стиль цитат в темах WordPress

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

WordPress позволяет выделить содержимое поста, как цитируемое — для этого есть специальная кнопка на панели инструментов редактора. Цитирование добавляет HTML-код, для которого можно задать специальное оформление.

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

Классическое оформление блока цитаты с большой кавычкой, выполненной шрифтом.

Тот же самый блок цитаты с классическим оформлением, только кавычка выполнена картинкой.

Простое оформление блока цитаты с фоном и пунктирной линией слева.

Модное оформление блока цитаты с голубым фоном, белым текстом и оранжевой линией слева.

Пример оформления блока цитаты с помощью шрифта Droid Serif, загружаемого из онлайновой библиотеки шрифтов Google web fonts.

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

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

Для оформления блока цитаты вы можете заполнить его фоновым рисунком.

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

Источник: How To Customize Blockquotes Style in WordPress Themes

Комментировать

/* ]]> */