Одна из особенностей CMS WordPress это возможность изменить WordPress шаблон под себя. Иногда такую доработку шаблона WordPress называют тонкой настройкой. В этой статье: проверка верстки шаблона правилам SEO.
В создании сайта для себя или своей компании, есть несколько возможных путей. Во-первых, сделать сайта самостоятельно. Довольно быстро это можно сделать на популярной CMS, однако качественный веб ресурс потребует серьёзного изучения. Ещё больше времени потребуется на изучение самостоятельно вёрстки сайта. Срок обучения от года и это не может устраивать, тех, кто хочет и может зарабатывать здесь и сейчас. В этом случае выход для вас купить готовый сайт вашего направления. Например, готовый агрегатор доставки еды. Несмотря на столь «грозное» название — это сайт, который позволит за 5-7 дней в уникальном функционале и дизайне начать бизнес по доставки еды клиентам.
В этой статье мы продолжаем работать над сайтами WordPress и редактируем готовые шаблоны.
После того, как вы выбрали шаблон для установки на свой сайт WordPress, стоит проверить его верстку на соответствие основным правилам SEO (оптимизации). Например, коробочный шаблон «Twenty Fourteen» сверстан так, что заголовки виджетов выводятся в тегах <h1></h1>, что может отрицательно сказаться на продвижении сайта. Бывают другие недочеты верстки шаблонов, от которых нужно избавиться до наполнения сайта материалами и его открытия для поисковиков.
Чрезвычайно трудно найти готовый шаблон WordPress полностью удовлетворяющий своим потребностям. Довольно часто, подобранный шаблон нравится, но не устраивает его цветовая гамма или не нравится расположение сайдбара, заголовка, шрифт, и т.д. На платформе WP есть все возможности изменить WordPress шаблон под себя.
Для примера изменим коробочный шаблон WordPress под названием «Twenty Fourteen». Этот шаблон выступит практичным примером, на котором можно посмотреть все нюансы тонкой и не только тонкой настройки шаблонов WordPress.
Перед любыми работами с кодом WordPress, в том числе изменении рабочего шаблона, нужно сделать и иметь под рукой:
Шаблон должен быть предварительно настроен на вкладке Внешний вид→Настройка.
Примечание: Чтобы сделать не сбрасываемые изменения в шаблоне, нужно перейти на дочернюю тему. Работа на дочерней теме WordPress позволяет обновлять шаблон без потери сделанных изменений.
Я постараюсь показать принцип изменения шаблона, что позволит делать свои изменения любого шаблона WordPress.
Итак, задача: Есть шаблон «Twenty Fourteen» фото 1, делаем пользовательские изменения в шаблоне, заодно, проверяем верстку шаблона для соответствия правилам SEO оптимизации.
Примечание: Отмечу, что авторы многих шаблонов создают перенастраиваемые настройки своего шаблона, выводя интерфейс настроек на отдельную вкладку. Работая с такими шаблонами, вы легко, без изменения в коде шаблона можете выставить пользовательские настройки шаблона. Это не вариант, описанный в этой статьи.
Разберемся сначала с версткой шаблона. Перед проверкой выставляем предусмотренные настройки шаблона.
Примечание: Мы не ищем ошибки кода шаблона. Это можно сделать на специальных сервисах проверки валидности кодов. Например, тут: validator.w3.org.
Для проверки верстки на соответствие правил SEO нам понадобится:
Шаг 1. Проверка главной страницы
1. Открываем домашнюю страницу сайта. Любой браузер имеет инструменты разработчика. Простое управление инструментами находим на правой кнопке мыши, для браузера Chrom «Посмотреть код».
2. На домашней странице сайта (страница последних записей) смотрим код на заголовке сайта. Если это текст, то он должен быть в тегах h1. Если это картинка, то она НЕ должна быть в тегах h1.
Важно! На любой странице сайта не должно быть больше двух тегов h1. Один открывающий h1, второй закрывающий /h1.
3. Чтобы не «тыкать» все заголовки на странице, на правой кнопке мыши смотрим «Код страницы» и, открыв поиск по странице (кнопки ctrl+F) ищем «h1». Если поиск находит больше двух тегов h1, смотрим, что они обрамляют, и пытаемся это исправить. Исправление чуть ниже.
4. Анонсы статей, в нашем примере это одна тестовая статья. Заголовок анонса должен быть в тегах h2. Если заголовки анонсов статей в тегах h1 или h3 нужно исправить. Исправление чуть ниже.
5. Все заголовки виджетов должны быть в тегах h3 или h4. Этот сайт сверстан так, что заголовки виджетов обернуты в тегах h1, это нужно исправить. Исправление чуть ниже.
На любой странице сайта не должно быть больше двух тегов h1. Один открывающий h1, второй закрывающий /h1.
Шаг 2. Проверка страницы тестового поста
После главной страницы сайта, открываем тестовый пост сайта. Здесь проверяем, чтобы тегами h1 обертывался только заголовок поста. Проверку делаем аналогично посту сайта. Нужно, чтобы тегами h1 обертывался только заголовок страницы.
Шаг 3. Проверка виджетов
Аналогично, смотрим теги заголовков виджетов в сайдбаре и футере.
В результате проверка верстки шаблона, на этом шаблоне, обнаружили, что заголовки виджетов в футере и сайдбаре сайта, обернуты в теги h1. Это нужно исправить.
1. Для исправления идем в каталог шаблона и открываем для редактирования файл functions.php. Под словами «идем в каталог шаблона», понимаем копирование нужного файла (можно из редактора консоли) и правки его в текстовом редакторе типа Notepad++.
2. В файле functions.php ищем, как задан вывод виджетов в шаблоне. Для этого шаблона видим, что заголовки виджета в тегах h1. Меняем h1 на h3.
3. Если в файле functions.php не задан вид заголовка виджета, идем в файл footer.php и смотрим, как в этом файле обернут заголовок виджетов в футере. Меняем h1 на h3.
Если мы нашли, что на главной странице анонсы статей выводятся в тегах h1, то есть на странице последних записей, есть несколько заголовков в h1, читаем статью Структура статьи WP , тег h1 и h2 в шаблоне и устраняем эту SEO ошибку верстки.
Тема статьи оказалась больше, чем я ожидал, поэтому придется изменить WordPress шаблон под себя, а именно изменить его внешний вид, будем в следующей статье. Предварительно, можно почитать статьи: Правила верстки файла каскадных стилей WordPress.
©www.wordpress-abc.ru
Практическое руководство из 10 пунктов, как увеличить конверсию вашего сайта. Читать дальше
Варианты проверки работы клавиатуры компьютера. Читать дальше
Что такое системы управления ERP и для чего они нужны. Читать дальше
Чем занимается ИТ отдел коммерческой компании, его структура, аудит и развитие. Читать дальше
Всё что нужно знать про поведенческие факторы ПФ для продвижения сайта. Читать дальше
В этой статье обсудим продвижение телеграм канала, популярные методы и мероприятия продвижения. Читать дальше
