Як правильно підключити файл стилів у своїй темі wordpress stack overflow російською

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

Для створення дочірньої теми потрібно всього один файл style.css в папці / wp-content / themes / моя-дочірня-тема. Він підключається автоматично завжди - це робить головна тема, на яку посилається ваша дочірня.

Насправді все трохи складніше, коли ми створюємо нову основну тему WordPress з нуля. Для функціонування такої теми потрібно 2 файли - style.css і index.php.

На перший погляд, style.css повинен підключатися автоматично. Однак, якщо ми заглянемо в functions.php стандартної теми twentyseventeen, ми побачимо наступний код:

Ось це так! Розробники WordPress в своїй стандартній темі вручну підключають файл стилів style.css. Це ще навіщо?

Спробуємо розібратися. Створимо свою головну тему під ім'ям, скажімо, zero. Створюємо папку / wp-content / themes / zero і в ній два файли.

index.php теж ужмём до самого логічно мінімального вмісту, з чого починають розробку нових тем - шапка, підвал і головний цикл:

Все працює, файл стилів підключений (h1 в the_title () виводиться в кольорі deeppink):

Як правильно підключити файл стилів у своїй темі wordpress stack overflow російською

Створюємо файл header.php - свій заголовок. Поки порожній. Маємо ж право?

О, ні - куди подівся файл стилів? h1 в the_title () виводиться траурним чорним кольором.

Той же самий ефект буде, якщо видалити виклик get_header () з нашого index.php.

Розберемо, що сталося.

Функція get_header (). яку ми викликаємо з нашого index.php. знаходиться в /wp-includes/general-template.php і містить рядки:

locate_template () знаходиться в wp-includes / template.php. Ось її повний код:

Бачимо, що ядро ​​WordPress намагається знайти файл шаблону спочатку в папці дочірньої теми STYLESHEETPATH. потім в папці основної теми TEMPLATEPATH і, в останню чергу, у своїй папці. Якщо у нас немає свого шаблону у новоствореній темі zero і в index.php ми викликаємо get_header (). то, згідно з кодом вище, ядро ​​підхопить свій шаблон wp-includes / theme-compat / header.php.

Дивимося в стандартний шаблон WordPress wp-includes / theme-compat / header.php і знаходимо там таку строчку:

Он воно - підключення файлу стилів style.css. Тепер зрозуміло, що відбувається і навіщо в стандартній twentesenteen вручну підключають файл стилів.

Файл стилів варто підключати вручну в functions.php своєї головної теми, якщо:

  1. Ми створюємо власний header.php (що роблять в 99% випадків)
  2. У своєму header.php ми не додаємо рядок

Підключення файлу стилів теми в functions.php виглядає таким чином:

Це мінімальний текст funсtions.php для запуску свого файлу стилів.

Але і цього мало! Необхідний мінімальний код в header.php:

Отже, якщо ми створюємо тему з нуля, зі своїм файлом header.php. нам доведеться підключити файл стилів style.css вручну:

  • або в functions.php через enqueue_style ()
  • або в header.php через

Чи треба підключати файл стилів style.css при розробці власної теми або це відбувається автоматично?

У темі обов'язково потрібно використовувати wp_head () і wp_footer () тоді буде автоматично підключитися не тільки style.css. а й всі скрипти та інше. Без цих функцій безліч плагінів не працюватимуть або будуть викликати проблеми.

А без style.css тема просто не активується.

Схожі статті