Стиль подзаголовков для Blogger

Поисковые системы в своих руководствах для вебмастеров регулярно напоминают о важности заголовков всех уровней (от h1 до h6) для успешной поисковой оптимизации.

Stil podzagolvkov v Blogger

Но при этом, никто не говорит о внешнем виде подзаголовков в статье.

Если подзаголовки отдельных частей статьи просто заключать в теги <h2>, то в Blogger для читателей блога такое выделение будет выглядеть достаточно убого.

Предлагаю воспользоваться стилем, предложенным автором замечательного франкоязычного блога LeBlogger.

Вот, как будут выглядеть подзаголовки, если вы уделите их внешнему виду 30 секунд вашего внимания.

Стиль подзаголовков для Blogger

Если есть желание — можно посмотреть на стиль подзаголовков в моём новом блоге после применения действий, описанных ниже.

Изменяем стиль подзаголовков h2 в Blogger
1. Заходим в Панель управления — Дизайн — Изменить HTML

2. Сохраняем резервную копию на жёсткий диск компьютера

3. С помощью комбинации Ctrl + F находим строчку:

]]></b:skin>

и сразу перед ней вставляем такой код стиля:

.blog-posts h2 {
  border-bottom: 3px solid #9C0303;
  color: #9C0303;
  font: 2.5em/1.33em Helvetica,Arial,Helvetica,sans-serif;
  margin-bottom: 18px;
  padding: 10px 0 3px;
}

4. Для адаптации стиля подзаголовков под дизайн вашего блога в предложенный код можно внести следующие изменения:

  • Цвет
  • Размер шрифта
  • Расстояние между строк
  • Семейство шрифтов
5. Сохраняем шаблон.
Теперь, заключая подзаголовки в такую конструкцию:

<h2>Ваш подзаголовок</h2>

мы увидим не только повышенную лояльность со стороны поисковых систем, но и красивый внешний вид статей, что, надеюсь, оценят ваши читатели!
Доброй охоты всем нам!
Ваш Retliff


0 комментариев к “Стиль подзаголовков для Blogger”

  1. Добрый день!

    Вы пишите "Теперь, заключая подзаголовки в такую конструкцию: ……… мы увидим не только повышенную лояльность со стороны поисковых систем, но и….

    Вопрос: у меня в блоге есть дата и заголовок статьи. Если я вставляю указанный в статье код, то дата начинает выглядеть ужасно (большие красные буквы). Как сделать так, чтобы заголовок оптимизировать? Или это нужно в коде шаблона где-то менять и указывать, где заголовок и где подзаголовок? Я запутался короче совсем :).

    Ответить
  2. @Лев
    Очевидно, что в тегах <…2> у Вас находятся основные заголовки.
    Попробуйте заменить в коде …2 на …3.
    ТОгда и конструкция для подзаголовков должна выглядеть так: <…3>Подзаголовок
    А лучше всего воспользоваться рекомендациями Кати Тарасовой из этой статьи: http://amateurblogger.ru/2011/01/kak-pomenyat-zagolovki-blogger-blogspot.html

    Ответить
  3. Здравствуйте Сергей! Скажите пожалуйста, как увеличить межстрочное расстояние в сообщении в Blogger?
    Строчки очень близко к друг другу.Не могу никак сделать, наверно что-то недопонимаю.
    Если можно напишите именно как вставлять в шаблон.
    Спасибо. Марина

    Ответить

Оставьте комментарий