WordPress заголовки

Оптимизируем WordPress заголовки.

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

Перед нами стоит задача оптимизировать заголовки в WordPress, таким образом, чтобы главный заголовок на странице всегда находился в теге h1, а дальше в тегах h2, h3, h4,…

Знакомясь с блогами оптимизаторов, я видел, что многие пишут про оптимизацию заголовков, а взглянув на их заголовки, с удивлением обнаруживал, что у них самих ничего не оптимизировано…

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

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

Не буду больше отнимать ваше время, и так приступим.

 

Оптимизируем заголовок блога на WordPress.

Мы должны сделать так чтоб заголовок блога на главной странице располагался в тегах <h1>Ваш заголовок</h1> и не был ссылкой. Зачем ссылаться на самого себя?

А на всех остальных страницах, он должен находится в обычном текстовом теге <p>Ваш заголовок</p> и быть ссылкой на главную страницу блога.

Сначала узнаем стили, прописанные для заголовка вашей темы, чтоб создать такой же только для обычного текстового тега <p>.

Это можно сделать очень легко в браузере Google Chrome. Наведите курсор на ваш заголовок кликните правой кнопкой и в выпавшем меню выберите пункт «Просмотр кода элемента». Снизу появится окно с кодом выбранного заголовка, а справа описание его стиля прописанного в файле style.css.

Помните, что темы у всех разные, но алгоритм для всех один. Просто будьте внимательны, ваш код может отличаться. Вы увидите свой заголовок в теге <h1> и <div> контейнер, в котором он находится. У меня это <div id=»header»>.

Теперь переходим в редактор на вкладке «Внешний вид» в панели управления блогом и открываем файл style.css для редактирования. Обратите внимание, чтоб вы могли редактировать файлы, снизу должна быть синяя кнопочка «сохранить изменения». Если ее нет, значит у файла не выставлены права на запись. Вам необходимо будет изменить их на 777 через любой FTP клиент и обновить страницу.

Внимание! Сохраните ваш файл стилей перед изменением на свой компьютер! Если что-то пойдет не так вы всегда сможете вернуть все в исходное состояние.

После этого найдите в нем стиль, прописанный для вашего контейнера, у меня это был header

Примерно вы увидите что-то такое:

#header h1 {
	position:absolute;
	width:600px;
	left:38px;
	top:40px;
	margin:0;
	padding:0;
	font: bold 34px/38px Georgia, "Times New Roman", Times, serif;
}

Вам необходимо скопировать этот стиль, заменить h1 на p, а после этого вставить новый стиль в файл стилей. У вас должно получиться вот так:

#header p {
position: absolute;
width: 600px;
left: 38px;
top: 40px;
margin: 0;
padding: 0;
font: bold 34px/38px Georgia, "Times New Roman", Times, serif;
text-decoration: none;
}

После этого сохраните свой файл, нажав на кнопку «сохранить изменения».

Теперь переходим к редактированию файла header.php. Найдите код, который примерно будет выглядеть вот так:

<div id="header">
  <h1><a href="<?php echo get_settings('home'); ?>/">
    <?php bloginfo('name'); ?>
    </a></h1>
  <p class="tagline">
    <?php bloginfo('description'); ?>
  </p>

Вам надо заменить все, что идет сразу после <div id=»header»>, но до кода <p class=»tagline»>.

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

 

Итак, меняем наш код на этот:

<?php if (is_home ()){ ?>
<h1><?php bloginfo ('info'); ?></h1>
<?php } else {?>
<p><a href="<?php bloginfo ('url'); ?>"><?php bloginfo ('info'); ?></a></p>
<?php } ?>

Этот код делает так, что, если вы на главной странице блога, то ее заголовок находится в теге <h1> и не является ссылкой. На всех остальных страницах заголовок будет находиться в текстовом теге <p> и являться ссылкой на главную страницу.

Не забудьте сохранить редактируемый файл.

Теперь Ваш заголовок блога на WordPress оптимизирован!

В следующем посте я расскажу про оптимизацию заголовков постов.

Удачи вам и процветания!