Структура статьи WordPress , тег h1 и h2 в шаблоне Wordpress

Опубликовано: 01.09.2018

Вступление

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

Основные элементы веб-страницы

Когда вы пишите свою очередную статью, вы должны понимать, что в Интернет ваш текст это набор определенных символов, причем закодированных, окруженный определенными элементами разметки языка HTML (тегами). Так как теги для поисковиков имеют приоритетную иерархию, то и текстовая структура статьи должна быть построена в соответствии с этой иерархией.

Заголовки статей

Структура статьи WordPress должна начинаться с главного элемента веб – страницы — заголовка. Заголовок статьи отражается в поисковой выдаче и отображается на самом видном месте (вверху) при открытии страницы. Кроме этого заголовок статьи это ссылка на ваш блог, при отражении в поисковой выдачи Интернет. Заголовок статьи должен быть обязательно обрамлен тегом title .

Cтруктура статьи WordPress – Тег H1

Вторым по значимости элементом веб-страницы является название страницы, обрамленное в тег h1 . Это обязательный тег веб-страницы. Причем важно отметить, этот тег в рамках открытой веб-страницы (не всего блога) должен быть единственным. Несколько тегов h1 «нервирует» поисковики и рано или поздно они эту страницу выкинут из поиска.

Теги H2-H6

Все содержание веб-страницы нужно разделить по смыслу на подзаголовки. Подзаголовки должны быть заключены в теги h2, h3, h4, h5, h6, h7, p. Текст статьи должен быть написан (выстроен) по следующей структуре показанной на фото:

Как видите в тексте один элемент h1, а все остальные выстроены в понятную древовидную структуру.

Структура статьи WordPress: как выстроить

Структура статьи WordPress может быть выстроена двумя способами.

Первый . Писать статью на языке HTML, что требует не только знаний языка, но и серьезной практики. Второй вариант , более простой. Формировать структуру статей WP в его визуальном редакторе. Покажу как это делается. Входим в Консоль →Записи → Добавить запись. В любом визуальном редакторе, который установлен в вашем блоге WordPress, есть кнопка : Абзац. С помощью этой кнопки формируется структура статьи WordPress, «угодная» поисковым машинам.

Но это редактирование относится только к содержанию статьи и никак не затрагивает заголовок статьи. Обрамление заголовка статьи в теги title и h1 определены в шаблонах тем WordPress. А так как шаблоны верстают люди, то и исправлять их ошибки приходится вручную.

В чем же может быть ошибка в шаблонах WordPress по отношению к тегам title и h1. Разберем это подробнее.

Теги title и h1 в шаблонах WordPress

Во многих шаблонах wordpress вообще не заложено использование тега h1.

Кстати: Проверить, обрамлены ли ваши заголовки статей тегами h1 можно следующим образом. Откройте любой свой пост в WP блоге. Правой кнопкой мыши кликните по странице и откройте «Код страницы». При открытом коде, нажмите Ctrl + F (это поиск на странице) и поищите h1. В зависимости от того, найдется тег h1, относящейся именно к содержанию поста, или нет, будут зависеть ваши дальнейшие шаги.

И здесь еще одно замечание. Я знаю много блогов WP, которые работают без тегов h1 в шаблонах. При этом имеют прекрасную поисковую выдачу. На это скажу только одно. Поисковики «любят» тег h1. Он является основой всей разметки статьи. И это, несомненно, положительно влияет на ранжирование блога WP. Так что вам решать, использовать h1 в своем блоге WP или нет. Здесь важно одно. С тегами h1 нужно не переусердствовать. На странице должен быть один тег h1.

Как вставить тег h1 в шаблон блога WordPress

Прежде, чем рассказать, как вставить тег h1 в шаблон блога WordPress остановлюсь на файлах тем WP. Файлы шаблона верстаются для каждой темы отдельно.

Редактировать файлы шаблона можно непосредственно на сервере в каталоге WP, соединившись с ним по FTP. Или проще, войти в административную панель , далее Консоль → Внешний вид → Редактор. Справа в открывшемся окне, будут видны все файлы шаблона вашей темы WP.

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

В этой статье нас интересуют два файла для редактирования:

Файл главной страницы. Возможно index.php или loop.php Файл отдельно открытой статьи: Возможно single.php или loop-single.php.

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

Исправляем тег h1 в файле отдельного поста

Для редакции файлов используем текстовой редактор типа Notepad++. Также имеем под рукой копию сайта, на случай фатальных ошибок.

Заходим в Консоль → Внешний вид → Редактор → Файл отдельно открытой статьи. Ищем код, который отвечает за вывод заголовка. Кусок шаблона:

/* Часть шаблона loop-single <?php /** * Файл single.php для отображения содержимого в шаблоне * * */ ?> <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>> <nav id="nav-single"> <h3 class="assistive-text"><?php _e( 'Post navigation', 'admired' ); ?></h3> <span class="nav-previous"><?php previous_post_link( '%link', __( '<span class="meta-nav">←</span> Previous', 'admired' ) ); ?></span> <span class="nav-next"><?php next_post_link( '%link', __( 'Next <span class="meta-nav">→</span>', 'admired' ) ); ?></span> </nav> <header class="entry-header"> <h2 class="entry-title"><?php the_title(); ?></h2> <?php if ( 'post' == get_post_type() ) : ?> <div class="entry-meta"> <?php admired_posted_on(); ?> </div> <?php endif; ?> </header>

И меняем в нем теги h2 на теги h1 :

Если есть в коде ссылка, заголовка самого на себя, ссылку убираем.

Выглядит ссылка так:

<a href="<?php echo get_permalink() ?>" rel="bookmark" title="Постоянная ссылка: <?php the_title(); ?>">

Остается чистый код заголовка обрамленного тегами h1.

Далее нужно убрать другие теги h1 с этой страницы. Для этого открываем шаблон header.php и ищем код, который выводит название всего блога.

Ищите: <?php bloginfo('name');?> или site-name или site-title. Если тег h1 находится внутри div, то его просто удаляем. Если теги h1></h1 сами обрамляют код, то меняете их на div></div. Тем самым мы делаем заголовок блога без тегов, а оставляем тег h1 только для заголовка статьи.

Вставляем тег h1 на главную страницу блога WP

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

Для этого открываем в редакторе файл: index.php или loop.php; Ищем код выводящий название статей на главной странице; И меняем, тег h1 на тег h2. Не забываем сохраниться. <div id="post-<?php the_ID(); ?>" <?php post_class(); ?>> <h2 class="post-title"><a href="<?php the_permalink() ?>" rel="bookmark"><?php the_title(); ?></a></h2> <div class="postmeta"><?php do_action('themezee_display_postmeta_index'); ?></div> <div class="entry"> <?php the_post_thumbnail('thumbnail', array('class' => 'alignleft')); ?> <?php the_content(__('» Read more..', 'themezee_lang')); ?> <div class="clear"></div> <?php wp_link_pages(); ?> </div> <div class="postinfo"><?php do_action('themezee_display_postinfo_index'); ?></div> </div> /* Главная страница,Шаблон:index.php или loop.php <h1 class="post-title"><a href="<?php the_permalink() ?>" rel="bookmark"><?php the_title(); ?></a></h1> /*меняем на <h2 class="post-title"><a href="<?php the_permalink() ?>" rel="bookmark"><?php the_title(); ?></a></h2>

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