кнопка наверх

Как сделать содержание (оглавление) статьи в WordPress

содержание страницыВсем доброго времени суток! Вчера побывали на выставке оптических иллюзий. Столько там всякой всячины: картинки разные, но которые долго смотришь и потом чудеса начинают вершиться:) Экскурсовод объяснял, почему это происходит, как работает наш мозг в данные мгновения, что нам начинает казаться то, чего на самом деле нет. Больше всего понравилась комната Эймса, фото смотрите в конце!

Сегодня мы рассмотрим, как сделать содержание для записи и страницы в WordPress.

Содержание статьи, в которой я научу вас делать такие содержания:

Зачем делать автоматическую прокрутку страницы

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

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

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

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

Создание и настройка содержания страницы

Для создания содержания страницы кодом HTML мы будем использовать якоря гиперссылок. Это две части HTML-кода: первая является ссылкой на якорь (вместо адреса вписываем решетку и названия якоря), вторая часть — сам якорь (тег а с параметром name, в который мы вписываем имя якоря). Имена якорей можно придумывать любые, лучше, чтобы они подходили по смыслу, но не страшно, если их имена будут и бессмысленными.

Попробуйте перейти в режим HTML (вкладка Текст) и добавить приведенный ниже код.

Пример

1
<a href="#name1">Первая часть кода</a>

oglav

1
<a name="name1"></a>Конец кода

oglav2

Первая часть HTML-кода – это сам подзаголовок в нашем оглавлении, а вторая – место в тексте, до которого автоматически будет прокручена страница.

Создавать такие ссылки можно неограниченное количество, но в каждом последующем случае необходимо задавать уникальное имя якоря (параметр name):

1
2
<a href="#name2">Ваш подзаголовок</a>
<a name="name2"></a>Место, до которого будет выполнена автоматическая прокрутка страницы

Очень важно следить, чтобы код был прописан не в визуальном редакторе, а в режиме HTML, иначе оглавление не будет работать.

В блоге на WordPress содержание статьи (записи или страницы) поможет быстрее сориентироваться посетителям в тексте этого поста. Они не потеряют драгоценного времени на поиск нужной информации в длинном тексте и интереса к вашему сайту. Поисковики также оценят эту фишку, что даст хорошие результаты в продвижении.

P.S. Теперь, как и обещала, фото. Еще одна оптическая иллюзия — комната Эймса. С виду обычная комнатка, а такие чудеса:)

комната Эймса


1 звезда2 звезды3 звезды4 звезды5 звезд (2 оценок, среднее: 5,00 из 5)
Загрузка...
like
Понравилось?
Подпишитесь на блог и получайте новые статьи!
Добавляйтесь в соц. сетях:
  1. Александра:

    Очень полезное нововведение на сайте! Спасибо большое, надо попробывать!

    Ответить
  2. Евгений Комиссаров:

    ухты, ну такой код уж очень полезный особенно если статья символов так тысяч на 6-7 🙂 Я вот часто вижу такие оглавления и достаточно удобно

    Ответить
  3. Сергей:

    спасибо большое! думал это плагином придется решать, а тут все так просто =)

    Ответить
  4. Александр:

    Добрый день, нужно или нет добавлять к ссылкам содержания статьи тег rel="nofollow". Спасибо за ответ.

    Ответить
    • Анна:

      Интересный вопрос. Не нужно. Но некоторые закрывают содержание в noindex, особенно, если анкоры его ссылок дублируют заголовки h2,h3.

      Ответить
  5. Татьяна:

    Здравствуйте! Надо ли ставить кавычки вокруг name2 ?

    <a href="#name2" rel="nofollow">Ваш подзаголовок</a>

    Место, до которого будет выполнена автоматическая прокрутка страницы

    В объяснениях эти кавычки есть, а на скриншотах вы их не ставите.

    Спасибо)

    Ответить
Ваш комментарий: