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

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

Ну что, давайте я создам содержание, и мы сразу посмотрим, как оно будет выглядеть:

Содержание

1. Пункт содержания 1
2. Пункт содержания 2
3. Пункт содержания 3
4. Пункт содержания 4
5. Пункт содержания 5
6. Пункт содержания 6
7. Пункт содержания 7
8. Пункт содержания 8
9. Пункт содержания 9
10. Пункт содержания 10

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

Исходный код

<h2>Содержание</h2>
<ol>
	<li><a href="#snoska1">Пункт содержания 1</a></li>
	<li><a href="#snoska2">Пункт содержания 2</a></li>
	<li><a href="#snoska3">Пункт содержания 3</a></li>
	<li><a href="#snoska4">Пункт содержания 4</a></li>
	<li><a href="#snoska5">Пункт содержания 5</a></li>
	<li><a href="#snoska6">Пункт содержания 6</a></li>
	<li><a href="#snoska7">Пункт содержания 7</a></li>
	<li><a href="#snoska8">Пункт содержания 8</a></li>
	<li><a href="#snoska9">Пункт содержания 9</a></li>
	<li><a href="#snoska10">Пункт содержания 10</a></li>
</ol>

То есть, мы организовываем ссылку на «Якорь». По нажатию на такую ссылку, мы должны вернуться к нашему «Якорю», то есть разделу содержания. Теперь нам необходимо создать под каждый пункт содержания описание и присвоить ему «Якорь», у меня вышло вот так:

Пункт содержания 1

А здесь у нас уже идет описание пункта содержания 1. Пишите, что хотите дорогие пользователи.

Пункт содержания 2

А здесь у нас уже идет описание пункта содержания 2. Пишите, что хотите дорогие пользователи.

Пункт содержания 3

А здесь у нас уже идет описание пункта содержания 3. Пишите, что хотите дорогие пользователи.

Пункт содержания 4

А здесь у нас уже идет описание пункта содержания 4. Пишите, что хотите дорогие пользователи.

Пункт содержания 5

А здесь у нас уже идет описание пункта содержания 5. Пишите, что хотите дорогие пользователи.

Пункт содержания 6

А здесь у нас уже идет описание пункта содержания 6. Пишите, что хотите дорогие пользователи.

Пункт содержания 7

А здесь у нас уже идет описание пункта содержания 7. Пишите, что хотите дорогие пользователи.

Пункт содержания 8

А здесь у нас уже идет описание пункта содержания 8. Пишите, что хотите дорогие пользователи.

Пункт содержания 9

А здесь у нас уже идет описание пункта содержания 9. Пишите, что хотите дорогие пользователи.

Пункт содержания 10

А здесь у нас уже идет описание пункта содержания 10. Пишите, что хотите дорогие пользователи.

В итоге, возле каждого пункта меню, у вас должен появиться значок «Якоря», если перейти в режим визуального просмотра:

В виде HTML-кода, это выглядит следующим образом:

Исходный код

<h3><a id="snoska1"></a>Пункт содержания 1</h3>
А здесь у нас уже идет описание пункта содержания 1. Пишите, что хотите дорогие пользователи.
<h3><a id="snoska2"></a>Пункт содержания 2</h3>
А здесь у нас уже идет описание пункта содержания 2. Пишите, что хотите дорогие пользователи.
<h3><a id="snoska3"></a>Пункт содержания 3</h3>
А здесь у нас уже идет описание пункта содержания 3. Пишите, что хотите дорогие пользователи.
<h3><a id="snoska4"></a>Пункт содержания 4</h3>
А здесь у нас уже идет описание пункта содержания 4. Пишите, что хотите дорогие пользователи.
<h3><a id="snoska5"></a>Пункт содержания 5</h3>
А здесь у нас уже идет описание пункта содержания 5. Пишите, что хотите дорогие пользователи.
<h3><a id="snoska6"></a>Пункт содержания 6</h3>
А здесь у нас уже идет описание пункта содержания 6. Пишите, что хотите дорогие пользователи.
<h3><a id="snoska7"></a>Пункт содержания 7</h3>
А здесь у нас уже идет описание пункта содержания 7. Пишите, что хотите дорогие пользователи.
<h3><a id="snoska8"></a>Пункт содержания 8</h3>
А здесь у нас уже идет описание пункта содержания 8. Пишите, что хотите дорогие пользователи.
<h3><a id="snoska9"></a>Пункт содержания 9</h3>
А здесь у нас уже идет описание пункта содержания 9. Пишите, что хотите дорогие пользователи.
<h3><a id="snoska10"></a>Пункт содержания 10</h3>
А здесь у нас уже идет описание пункта содержания 10. Пишите, что хотите дорогие пользователи.

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