Вивчаємо WordPress

196
  • Використання тільки HTML редактора WordPress
  • Приступаємо до написання статті в HTML-редакторі
  • Вибір оптимальної структури рівня заголовків H1-H6
  • Здрастуйте, шановні читачі блогу . Сьогоднішню публікацію я вирішила присвятити питанню написання статей в HTML-редакторі WordPress (у продовженні, як створити блог, описаної тут).

    Справа в тому, що іноді в адмінці не виходить задіяти візуальний редактор (найчастіше це буває пов’язано з проблемами хостингу), а без нього початківцям блогерам досить складно буде писати правильно і красиво оформлені статті, бо працює у всіх без винятку простий редактор вимагає хоча б загальних знань в HTML.

    Вивчаємо WordPress

    У мене, коли я тільки починав вести цей блог і знайомитися з движком, як раз і не вийшло задіяти візуальний редактор. Не допомагали ні додаткові плагіни з їх різними версіями, ані інші «танці з бубном». Тому мені мимоволі довелося освоювати наявний базовий редактор, благо, що з мовою розмітки я до того часу вже був досить знайомий.

    Використання тільки HTML редактора WordPress

    Але справа була навіть не в HTML, а в зручності виконання повсякденних і часто зустрічаються дій. Так, редактор WordPress, використовуваний за умовчанням, дозволяє однією кнопкою виділяти жирним (тег STRONG) і курсивом (EM), вставляти посилання, цитати, картинки, нумеровані та маркіровані списки, виділяти різний код і відокремлювати анонс поста в Вордпресс тегом more.

    Але мені цього було недостатньо, оскільки в тексті статей я активно використовував внутрішні заголовки різних рівнів (від H2 до H5), виділяв код (PHP, CSS і т. п.) спеціальними тегами плагіна SyntaxHighlighter і робив багато іншого.

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

    Але ця проблема успішно вирішилась завдяки чудовому плагіну WP Post Editor Buttons, за допомогою якого можна додати скільки завгодно багато додаткових кнопок на панель інструментів HTML редактора, запрограмувавши їх на певні дії.

    Сьогодні ми розглянемо написання постів в WP у всіх подробицях від початку і до кінця, не опускаючи нюансів і тих прийомів, які, на мою думку, допомогли блогу (ви його зараз як раз і читаєте, якщо, звичайно ж, цю статтю не вкрали і не розмістили на іншому сайті) вийти на рівень кількох тисяч унікальних відвідувачів.

    Тобто ця публікація буде представляти собою розгорнуте додаток до статті Проекту виповнилося 10 місяців, 2000 відвідувачів на добу. Як? (це не оригінальна назва, а взяте з ретвитта одного з читачів, але воно, по-моєму, навіть більш вдале, ніж моє оригінальна назва).

    У тій статті я в загальних рисах змалював ті нюанси, які, як мені здається, вплинули на приплив трафіку (відвідувачів) з пошукових систем, а в цьому пості спробую заглибитися в деталі, які часто бувають дуже важливі і не очевидні на перший погляд.

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

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

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

  • Як встановити Вордпресс на сервер (в деталях і картинках)
  • Налаштування, які ви повинні зробити відразу після установки
  • Налаштування ЧПУ (людино-зрозумілі URL) для WordPress
  • Створення правильної сторінка помилки 404
  • Оптимізуємо блог для зниження навантаження на сервер
  • Як влаштовані теми та шаблони WordPress
  • Приступаємо до написання статті в HTML-редакторі WordPress

    Отже, для написання нової статті вам потрібно буде зайти в адмінку (http://sait.ru/wp-admin/) і вибрати з лівого меню (якщо у вас використовується стандартне оформлення адмінки WP) пункт «Додати нову» в області «Записи».

    Вивчаємо WordPressВивчаємо WordPress

    В результаті відкриється стандартна сторінка додавання статті (поста), в якій буде присутнє поле для введення заголовка і велике поле для введення тексту поста.

    Ніяких хитрощів при введенні тексту заголовка в призначене для цього поле немає, але дуже важливо не те, як ви будете його вводити, а те, що необхідно використовувати ключові слова в ньому. Наскільки вдало ви підберете назву до посту (з потрібними ключовими словами, про які вже йшлося тут), настільки високо в пошуковій видачі підніметься ваш пост по тим чи іншим запитам.

    Але при цьому заголовок статті в Вордпресс обов’язково повинен добре корелюватися з її текстом (бути релевантним тексту поста). До того ж, його будуть показувати в пошуковій видачі і від того, наскільки він буде привабливим, буде залежати подальша доля вашої публікації (якщо за нього кликати не будуть, то погіршаться поведінкові фактори і він піде з Топа).

    Зазвичай остаточний варіант назви я формую вже після написання статті. Іноді копіюю всі проміжні підзаголовки в окремий текстовий файл і тримаючи їх все перед очима формую загальний, намагаючись врахувати все, про що згадувалося в ній.

    Мабуть, саме тому мої тайтли дуже довгі, але як показує практика, нічого в цьому страшного немає. Пошуковики чудово справляються з моїми заголовками і в пошуковій видачі відображається та частина TITLE, в якій зустрічаються слова з пошукового запиту.

    Чому ж так важливий заголовок для просування сторінки в пошукових системах? Та тому, що для них він є основним критерієм визначення релевантності (ступені відповідності — тут все розжовано про ранжування та інші складні слова) вашої статті тому чи іншому пошуковому запиту.

    Хоча ні, не зовсім так. Не назва посади, а заголовок сторінки TITLE є найважливішим критерієм для пошукачів при визначенні позиції по тому чи іншому пошуковому запиту (про запити і аналіз їх статистики тут дивіться у всіх подробицях).

    А при чому тут тоді заголовок поста в WP? А при тому, що правильний TITLE повинен формуватися з назви статті плюс назви всього блогу, і саме в такому порядку. До речі, налаштувати правильне формування TITLE WordPress зможете за допомогою плагін All in One SEO Pack описаному тут. Плагін просто чудовий, одночасно дозволяє вирішити масу питань внутрішньої оптимізації.

    Отже, крім безпосередньо тексту статті, нам напевно знадобиться додавати текст, картинки, посилання, створювати списки, вставляти який-небудь код, цитати, виділяти певні ключові слова і словосполучення тегами акцентування (теги логічного виділення жирним STRONG курсивом EM, а так само теги заголовків Н1 — H6). Детальніше про використання тегів акцентування ви можете почитати тут .

    Звертаю вашу увагу на відмінність між HTML-тегами логічного виділення «STRONG» та ще одним тегом виділення жирним «B», а так само між «EM» і «I». Перші з цих тегів (STRONG і EM) слід використовувати не тільки для залучення уваги читачів до важливих моментів тексту.

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

    Вибір оптимальної структури рівня заголовків H1-H6

    Тепер що стосується тегів заголовків H1-H6, які теж можуть використовуватися в статтях блогу для розставляння акцентів на потрібних словах і фразах.

    У цих внутрішніх підзаголовках, так само як і TITLE, повинні міститися ключові слова і словосполучення, за яким ви хочете просунутися в пошукових системах. Пошук буде враховувати їх з великою вагою, ніж звичайні. Але знову ж таки, не в якому разі не можна спамити ключами, бо за це можна постраждати в сучасних умовах просування.

    Крім того, що внутрішні підзаголовки (зазвичай починаючи з рівня H2, H3 і далі) надають додаткову можливість структурування тексту, що покращує їх сприйняття читачами.
    Але є ще одне питання внутрішньої оптимізації сайтів, який пов’язаний з рівнями заголовків (від H1 до H6), використовуваними на сторінках WordPress блогу.

    Основний спосіб розподілу рівнів заголовків з веб свідчить, що заголовок всієї статті повинен бути укладений в тег H1 (найвищий рівень) і він повинен бути один на сторінці, ну а всі внутрішні підзаголовки в тексті повинні починатися з H2.

    До речі, хочу порадити вам дуже зручний спосіб, що дозволяє наочно побачити в WordPress, де і якого рівня заголовки використовуються на тому чи іншому сайті. Це плагін для FireFox (тут повний список плагінів для Фаерфокса знайдете) під назвою Web Developer.

    Так от, якщо ви виберіть з меню цього плагіна (його меню додається в верхню частина браузера) пункти «Контури» — «Контури заголовків», то всі знайдені на відкритої в даний момент у браузері веб виділено кольоровими прямокутниками, поруч з якими буде укладено їх рівень H1 -H6.

    Вивчаємо WordPressВивчаємо WordPress

    Як видно з наведеного рисунка, я для заголовка статті встановив рівень не H1, а H2, в той час як H1 використовується для укладання в нього опису всього проекту, тобто не до якоїсь конкретної статті, а до всього блогу цілком.

    Цей Мауль у якийсь із своїх статей згадав, що заголовок рівня H1 повинен бути на сайті однаковий для всіх вебсторінок, але правда свою ідею він ніяк не аргументував. Тим не менш, я використовую саме його схему. Для внутрішніх підзаголовків використовую теги H3 і H4 (іноді і H5).

    Ще один нюанс. На головній назви постів у мене є посиланнями, які ведуть на веб-сторінки з повними версіями, але вже на самих цих сторінках з повними текстами постів, назви статей перестають бути посиланнями. Десь я вичитав, що так буде краще.

    Тепер ще треба трохи розповісти про те, як можна в WordPress поміняти впусти HTML тегів заголовків, наприклад, для статей, або додати, як це зробив я, один спільний для всіх рівня H1.

    Для цього вам потрібно підключитися до сервера хостингу, на якому розташований ваш блог по протоколу FTP, наприклад, з допомогою моєї улюбленої програми FileZilla, докладно описаної тут. Всі файли, які нам можуть знадобитися, знаходяться в папці з використовуваної вами темою (шаблоном) WordPress, яку ви зможете знайти по цьому шляху:

    /wp-content/themes/Назва теми/

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

    Давайте подивимося, де можна змінити рівень основних назв статей, розташованих на головній (за її вигляд відповідає файл INDEX) і на сторінках з повними версіями статтями (файл SINGLE).

    Відкриємо спочатку на редагування INDEX. У мене в ньому назви статей WordPress укладені в HTML тег H2 (другого рівня) та окрім цього вони є посиланнями, бо укладені в тег посилання A:


    В постах ж (за їх зовнішній вигляд відповідає файл SINGLE) основні заголовки вже не будуть посиланнями, хоча теж мають рівень H2:

    Якщо вас не влаштує другий рівень, то просто поміняйте в цих файлах (INDEX і SINGLE) теги H2 на теги H1 і збережіть зроблені зміни (хоча, для головної цього робити не можна, бо буде більше одного H1 на сторінці, що не є добре).

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

    Але повернемося до нашого HTML редактора WordPress і подивимося, які можливості він надає нам, чого нам у ньому не вистачає, а так само розглянемо спосіб розширення його можливостей. Ось скріншот панелі інструментів моєї адмінки, на якому червоним виділені ті кнопки, які відображаються за промовчанням:

    Вивчаємо WordPressВивчаємо WordPress

    Зверніть увагу, що кнопки з написами «b» і «i» насправді служать для вставки тегів STRONG і EM.

    Але всі ці додаткові кнопки можна буде додати окремо в WordPress за допомогою чудового плагіна Post Editor Buttons, про установці і роботі з яким я розповім вже в другій статті цієї серії. Тому залишайтеся на зв’язку, підписуєтеся на стрічку новин і не пропустіть найцікавіше.

    Удачі вам! До зустрічей на сторінках блогу