Вивчаємо WordPress

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

    Вивчаємо WordPress

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

    wp-content/themes

    Далі ви заходите в адмінку і вибираєте з лівого меню пункт «Дизайн». У меню, виберіть пункт «Тема».

    Як влаштована і з яких шаблонів складається тема WordPress?

    В області «Поточна тема оформлення» буде відображатися використовувана в даний момент. Наша, знову додана, повинна з’явитися в області «Доступні …». Натиснувши на кнопку «Перегляд» ви зможете побачити, як буде виглядати даний шаблон стосовно до вмісту вашого блогу.

    Щоб застосувати вибрану тему, потрібно клацнути по кнопці «Активувати» поруч з її превьюшкой. В результаті, мініатюра переміститься в область «Поточна …», а так само станеться зміна зовнішнього вигляду блогу, у відповідності з вашими побажаннями.

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

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

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

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

    HEADER відповідає за відображення шапки всіх сторінок, тобто верхній частині. В ньому ж формуються мета-теги, які включаються в шапку HTML коду всіх вебсторінок — заголовок сторінки TITLE, задається кодування російської мови, вказується шлях до файлу таблиці стилів, який повинен підключатися завдання для оформлення даної веб-сторінки і т. д.

    Як я вже писав у статті Оптимізуємо теми Вордпресс блогу, ви можете замінити в HEADER ділянки коду з непотрібними зверненнями до бази даних на статичний HTML-код для того, щоб зняти зайве навантаження на сервер при формуванні вебсторінок.

    Шапка, так само формована у HEADER, залишається незмінною для всіх вебсторінок, але вміст області контенту блогу формується різними шаблонами теми, в залежності від того, яке саме вміст виводиться. Розглянемо це детальніше:

  • за виведення вмісту головної сторінки відповідає файлик INDEX
  • за виведення сторінок зі статтями відповідає SINGLE
  • при виведенні вмісту тимчасового архіву статей (по роках і місяцях), при виведенні вмісту архіву тегів (міток), а так само при виведенні вмісту категорій зазвичай використовується один і той самий шаблон ARCHIVE
  • за виведення результатів пошуку по блогу відповідає SEARCH
  • за виведення статичних сторінок (наприклад, «Про блог») відповідає файл PAGE із папки з поточною темою
  • За формування футера (footer) у WordPress (підвалу, нижній частині веб-сторінки) відповідає файл FOOTER. Зазвичай в ньому виводиться назва блогу зі словами, що всі права захищені (називається це копірайт тут написано як захищати свої авторські права за допомогою нього). Так само в FOOTER можна додати код лічильників відвідувань (наприклад, від Ливинтернета), якщо ви їх будете використовувати на своєму ресурсі.

    За виведення сайдбара (sidebar — бічна панель WP блогу) праворуч або ліворуч від центральної частини сторінок відповідає файл SIDEBAR. У кожній конкретній темі крім SIDEBAR можуть використовуватися ще кілька шаблонів сайдбаров. У моєму випадку, спочатку бічна панель формується з коду SIDEBAR, але потім з нього здійснюється звернення до SIDEBAR1 і SIDEBAR2, які формують його двухколоночное продовження (зараз вони відключені).

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

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

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

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

    Давайте розглянемо дії Вордпресс при переході відвідувача за посиланням, що веде в категорію. Спочатку в папці поточної теми:

    wp-content/themes/название_

    цей движок буде шукати файл, який відповідає за виведення саме цієї категорії. А оскільки вони ідентифікує по ID, то і шукати він буде CATEGORY-n. Тут N — номер ID даної категорії (Як дізнатися ID рубрики або сторінки WordPress). Але такий файл у папці вашої теми може з’явиться тільки в тому випадку, якщо ви самі його створили спеціально для даної категорії.

    Але якщо ви цього не робили, то Вордпресс, не знайшовши такий файл (наприклад, КАТЕГОРІЯ-12), буде шукати вже загальний для всіх категорій незалежно від їх ID) CATEGORY. Якщо такого файлу теж знайдено не буде, то він вже буде шукати загальний шаблон для відображення всіх архівів під назвою ARCHIVE.

    ARCHIVE він швидше за все знайде в папці з вашої поточної теми, але якщо станеться страшне — навіть його не буде — WordPress буде змушений використовувати основний файлик під назвою INDEX.

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

    Порядок звернення Вордпресс до різних шаблонах поточної теми

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

  • Почати, звичайно ж, слід з головної сторінки. Порядок звернення до шаблонів буде наступним. Спочатку Вордпресс буде шукати в папці:
    wp-content/themes/название_

    файл HOME, а не знайшовши його звернеться до INDEX:

    • HOME
    • INDEX
  • При відображенні конкретної статті (поста) — спочатку шукається SINGLE в папці теми, а при його відсутності, в якості шаблону окремої сторінки зі статтею, буде використовуватися знову ж INDEX:
    • SINGLE
    • INDEX
  • Для відображення статичної сторінки можна буде задати конкретний шаблон прямо з адмінки WordPress. Для цього при створенні або редагуванні посту ви повинні вибрати з випадаючого списку «Шаблон» потрібний:

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

    Ці файли необхідно створити заздалегідь і додати в папку з вашою темою. У його початку обов’язково потрібно вставити назву таким от чином:

    Якщо ви не виберете з цього списку що-небудь, то WordPress буде шукати файл PAGE, а не знайшовши його буде використовувати все той же INDEX:

    • Шаблон, обраний в адмінці, при створенні статичної сторінки
    • PAGE
    • INDEX
  • При відображенні категорій (рубрик) буде спочатку здійснюватися пошук файлу для категорії з таким ID, наприклад, КАТЕГОРІЯ-11. Якщо його знайдено не буде, то, як я описував трохи вище, Вордпресс стане шукати CATEGORY. У разі його відсутності — шукати ARCHIVE, ну а якщо і його не буде, то для оформлення сторінки категорій буде використовуватися INDEX:
    • Шаблон конкретної категорії WordPress (CATEGORY-6, наприклад)
    • CATEGORY
    • ARCHIVE
    • INDEX
  • Для відображення сторінки тегу (мітки), може використовуватися спеціальний шаблон з теки поточної теми, який буде містити в своїй назві коротке посилання (слаг). Наприклад, для мітки з слагом joomla файл повинен називатися TAG-JOOMLA. Якщо движок такого файлу не знайде, то він спробує знайти спільну для всіх сторінок тегів — TAG. Якщо його не буде, то — ARCHIVE, а потім — INDEX. Резюме:
    • Шаблон WordPress для виведення постів з певною міткою
    • TAG
    • ARCHIVE
    • INDEX
  • Коли буде запитана сторінка автора статей, то спочатку движок шукає файлик AUTHOR. При невдачі — ARCHIVE, ну, а якщо і його не знайде, то — INDEX. Резюме:
    • AUTHOR
    • ARCHIVE
    • INDEX
  • Для відображення сторінки тимчасового архіву, наприклад, за місяць чи рік, Вордпресс спочатку перевірить папку з поточною темою на наявність в ній файлика DATE, а вже потім звернутися до ARCHIVE або до INDEX, у разі відсутності ARCHIVE. Резюме:
    • DATE
    • ARCHIVE
    • INDEX
  • Для оформлення сторінки результатів пошуку буде використовуватися шаблон SEARCH, у разі його наявності. В іншому випадку, буде використовуватися INDEX. Резюме:
    • SEARCH
    • INDEX
  • Для відображення сторінки з помилкою 404 (нічого не знайдено) буде використовуватися файлик 404 з папки з вашою темою. Про те, як його створити, ви можете почитати в статті: Як створити і навіщо потрібна сторінка помилки 404 для блогу на WordPress. Якщо його не буде, то буде використовуватися INDEX, що відкриває головну сторінку вашого блогу. Резюме:
    • 404
    • INDEX
  • Удачі вам! До зустрічей на сторінках блогу