Как изменить заголовки записей в Wordpres

Всем привет, с вами снова Дмитрий. Этот пост решил посвятить тому как изменить заголовки статей. Красивые заголовки пол успеха.

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

Например вам хочется, чтобы записи выглядели по другому.

Ранее я написал статьи

Эта статья так же будет относиться к серии статей по видоизменению записей WordPress.

Как изменить шрифт, цвет заголовков записей?

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

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

При смене на не стандартные шрифты, вам надо закачать новые шрифты на ваш сервер и подключить их.

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

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

Для блога я использовал файлы из архива с расширением woff2.

Далее в файле style.css нужно подключить эти шрифты

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

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

Для начала изменим базовый шрифт для сайта, а именно в стиле body пишем следующее

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

Для этого с помощью поиска по файлу style.css  ищем строчки с font-family и заменяем на следующие.

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

Например для заголовков это h1-h6, но может быть и др!!!

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

Для h3 я задал размер в 19px.

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


zagolovok2


А на странице где полная запись заголовок больше.


zagolovok


 

На этом серию статей по изменению записей не заканчиваю, в следующей статье поговорим

(как изменить отображение даты и автора)