Перевірка верстки шаблону правилам SEO

Навіщо редагувати шаблон
Підготовка до редагування шаблону
Як змінити WordPress шаблон «Twenty Fourteen» під себе
Перевірка верстки шаблону для правил SEO
Кроки перевірки верстки шаблону для правил SEO
Підсумки перевірки верстки

Навіщо редагувати шаблон

Після того, як ви вибрали шаблон для установки на свій сайт WordPress, варто перевірити його верстку на відповідність основним правилам SEO (оптимізації). Наприклад, коробковий шаблон «Twenty Fourteen» зверстаний так, що заголовки віджетів виводяться в тегах <h1> </ h1>, що може негативно позначитися на просуванні сайту. Бувають інші недоліки верстки шаблонів, від яких потрібно позбутися до наповнення сайту матеріалами і його відкриття для пошукових систем.

Надзвичайно важко знайти готовий шаблон WordPress повністю задовольняє своїх потреб. Досить часто, підібраний шаблон подобається, але не влаштовує його колірна гамма або не подобається розташування сайдбара, заголовка, шрифт, і т.д. На платформі WP є всі можливості змінити WordPress шаблон під себе.

Для прикладу змінимо коробковий шаблон WordPress під назвою «Twenty Fourteen». Цей шаблон виступить практичним прикладом, на якому можна подивитися всі нюанси тонкої і не тільки тонкої настройки шаблонів WordPress.

Підготовка до редагування шаблону

Перед будь-якими роботами з кодом WordPress, в тому числі зміні робочого шаблону, потрібно зробити і мати під рукою:

Шаблон повинен бути попередньо налаштований на вкладці Зовнішній вигляд → Налагодження.

Примітка: Щоб вдіяти не скидаються зміни в шаблоні, потрібно перейти на дочірню тему . Робота на дочірньої темі WordPress дозволяє оновлювати шаблон без втрати зроблених змін.

Як змінити WordPress шаблон «Twenty Fourteen» під себе

Я постараюся показати принцип зміни шаблону, що дозволить робити свої зміни будь-якого шаблону WordPress.

Отже, завдання: Є шаблон «Twenty Fourteen» фото 1, робимо зміни користувача в шаблоні, заодно, перевіряємо верстку шаблону для відповідності правилам SEO оптимізації.

Примітка: Зазначу, що автори багатьох шаблонів створюють перенастроювати настройки свого шаблону, виводячи інтерфейс налаштувань на окрему вкладку. Працюючи з такими шаблонами, ви легко, без зміни в коді шаблону можете виставити призначені для користувача настройки шаблону. Це не варіант, описаний в цій статті.

Перевірка верстки шаблону для правил SEO

Розберемося спочатку з версткою шаблону. Перед перевіркою виставляємо передбачені настройки шаблону.

Примітка: Ми не шукаємо помилки коду шаблону. Це можна зробити на спеціальних сервісах перевірки валідності кодів. Наприклад, тут: https://validator.w3.org/

Для перевірки верстки на відповідність правил SEO нам знадобиться:

Помістити будь-який віджет на сайдбар (и) шаблону. Нехай це буде календар. Обов'язково дамо віджету назву.
Створити список тесту і тестовий пост сайту.

Кроки перевірки верстки шаблону для правил 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>.

Крок 2. Перевірка сторінки тестового поста

Після головної сторінки сайту, відкриваємо тестовий пост сайту. Тут перевіряємо, щоб тегами h1 обертався тільки заголовок поста. Перевірку робимо аналогічно посаді сайту. Потрібно, щоб тегами h1 обертався тільки заголовок сторінки.

Крок 3. Перевірка віджетів

Аналогічно, дивимося теги заголовків віджетів в сайдбарі і футере.

перевірка верстки шаблону віджети

Підсумки перевірки верстки

В результаті перевірка верстки шаблону, на цьому шаблоні, виявили, що заголовки віджетів в футере і сайдбарі сайту, обгорнуті в теги h1. Це потрібно виправити.

1. Для виправлення йдемо в каталог шаблону і відкриваємо для редагування файл functions.php. Під словами «йдемо в каталог шаблону», розуміємо копіювання потрібного файлу (можна з редактора консолі) і редагування його в текстовому редакторі типу Notepad ++. 2. У файлі functions.php шукаємо, як заданий висновок віджетів в шаблоні. Для цього шаблону бачимо, що заголокі віджета в тегах h1. Міняємо h1 на h3. 3. Якщо у файлі functions.php не заданий вид заголовка віджета, йдемо в файл footer.php і дивимося, як в цьому файлі обгорнутий заголовок віджетів в футере. Міняємо h1 на h3.

Якщо ми знайшли, що на головній сторінці анонси статей виводяться в тегах h1, тобто на сторінці останніх записів, є кілька заголовків в h1, читаємо статтю ТУТ і усуваємо цю SEO помилку верстки.

Тема статті виявилася більшою, ніж я очікував, тому доведеться змінити WordPress шаблон під себе, а саме змінити його зовнішній вигляд, будемо в наступній статті. Попередньо, можна почитати статті: Правила верстки файлу каскадних стилів WordPress.

Статьи