Картинки во всю ширину
Проблема - картинки по умолчанию помещаются в теги p. На выходе получается такая конструкция:
<p> <img src='....'> </p>
Поскольку параграфы включают текст, а он должен быть уже, чем изображения, то придется от них избавится. Способы есть (
ссылка,
ещё ссылка); Далее задаем css:
img {max-width: 100%; height: auto);
Картинки растягиваются на всю ширину контейнера.
Текст отцентрован красиво
Задаем p, h1-h6, ul, ol (и прочие blackquote) стили нужной ширины и центруем. Например:
p {
max-width: 580px;
width: 100%;
margin-left: auto;
margin-right: auto;
}
Весь текстовый контент теперь имеет ширину 580px. Контейнер, допустим - 900px. Картинки растягиваются на всю ширину.
Разные шрифты
Можно задать параграфам - одни стили, заголовкам - другие. Соответсвенно, просто задайте разные шрифты.
Нужно более гибкое изменение - делаем shortcode для разных текстовых блоков. То же самое касается слайдера - лично я сделал бы его шорткодом.
"Красивые цитаты" делать шорткодом не требуется - просто сделайте стили для тега blackquote.