Как создать свою тему для wordpress

Создание темы WordPress. Натяжка HTML-вёрстки

В этом уроке мы с вами разберёмся, как создать свою тему для WordPress с нуля. Ну почти с нуля – мы же планируем натягивать на WordPress свою HTML-вёрстку.

Первым делом вам нужно будет определиться, хотите ли начинать разработку на основе стартовых тем или же полностью с нуля. Про стартовые темы мы обязательно поговорим, но я не привык их использовать, поэтому не буду использовать и в уроке тоже.

Что будет в видеоуроке?

Как вы заметили, что помимо текстового урока, тут также есть и видеоурок. Он абсолютно бесплатный, вам достаточно лишь зарегистрироваться на сайте для доступа к нему.

В видеоуроке мы сразу же начнём работать с готовой вёрсткой, которая выглядит вот так:

Для доступа к файлам вёрстки необходимо приобрести курс.

Сделаем первые шаги по натяжке этой вёрстки на WordPress, заменим статичные данные в HTML на динамичные при помощи таких функций WordPress, как wp_head(), wp_footer(), get_stylesheet_directory_uri(), get_stylesheet_uri(), bloginfo(), wp_get_document_title(), language_attributes(). Объясняю принцип действия каждой функции.

Чтобы скачать тему WordPress, которая получилась у нас в процессе этого урока, необходимо приобрести курс.

Cтартовые темы. Что это такое и для чего они нужны?

Когда мы создаёт тему с нуля, мы ручками создаёт директорию, в ней потом создаём два файла – index.php и style.css – смотрите следующий шаг.

Возможно стартовые темы придумали те люди, которые, так же как и я, не умеют создавать файлы на MacOS ��

Первоначально стартовые темы задуманы для упрощения этого процесса – чтобы вам вроде как пришлось меньше писать один и тот же код. Вроде как. Когда я только начинал свою карьеру в создании WordPress-тем, и когда даже не знал о существовании стартовых тем (а может их и вовсе не было), я задумывался о создании своего собственного «темплейта», то есть стартовой темы, при помощи которой я бы мог сэкономить себе время.

Сейчас в мире не существует такой стартовой темы, которая бы подошла под мои уникальные ежедневные задачи, да и как вы убедитесь в процессе этого курса, они также не подходят и для переноса вёрстки на WordPress. Опс. Меня за это захейтят.

Тем не менее, если вдруг вы приноровитесь к использованию какой-либо стартовой темы в своей работе – круто, молодцы! Я ничего не имею против, к тому же самую популярную стартовую темы Underscores разработали ребята из Automattic (компания, которая стоит за WordPress.com). Если вы почувствовали некоторый эмоциональный подтекст в моих словах, это только потому что я встречал людей, которые считают, что разрабатывать нужно ТОЛЬКО на стартовых темах, и обучаться тоже на них.

Приступаем к созданию темы. Файлы index.php и style.css

Для начала создайте какую-нибудь папку в /wp-content/themes — это и будет ваша будущая тема, я например создал kurs (очень оригинально). Каждая тема должна содержать по крайней мере 2 файла — это index.php и style.css — создаём их внутри этой папки.

Если вы забыли/забили на style.css , то в админке во Внешний вид > Темы ожидайте такую ошибку:

Если же отсутствует файл index.php , то:

Тут WordPress ещё что-то болтает про дочерние темы, не обращайте внимания, вам про них ещё рано читать.

Итак, после того, как вы создали все необходимые файлы, наша тема начнёт отображаться в админке:

До тех пор, пока мы ещё не изучили другие файлы шаблона, index.php у нас будет отвечать за вывод любой страницы сайта, а style.css , понятное дело, содержать стили (хоть это и не обязательно), но главное, чтобы в файле style.css вы добавили метаданные и описание темы.

Параметры (метаданные) темы

Если вы не хотите, чтобы ваша тема так и отображалась в админке без названия и описания, давайте добавим немного информации в style.css , поместив её в комментарии CSS /* */ .

/* * Theme name: Тема для курса * Author: Миша * Author URI: https://misha.agency * Version: 1.0 */

Но дело в том, что существуют и другие параметры темы, которые вы можете использовать, вот их список:

Theme name Название темы. Description Описание темы, которое будет отображаться в админке. Version Версия темы, например 1.0 Author Тут можете указать себя и тех людей, которые вам помогали. Author URI URL на сайт автора, позволит превратить имя автора в ссылку в админке WordPress. License Если вы создаёте под WordPress, рекомендую почитать немного про лицензию GPL License URI А в этом параметре указывается ссылка на страницу с лицензией. Text Domain Идентификатор локализации темы, полагаю сейчас нам это не понадобится, но позже рекомендую почитать про правильную локализацию плагинов и тем WordPress. Tags Если эта тема станет вашим будущим сайтом или сайтом вашего клиента, наиболее вероятно вам можно пропустить этот параметр, если же вы будете в дальнейшем публиковать свою тему в официальном репозитории WordPress, тогда уделите ему особое внимание. Со списком поддерживаемых тегов можно ознакомиться на официальном сайте. Template Параметр только для дочерних тем, подробнее тут.

Изображение темы

Для того, чтобы в качестве изображения темы не отображался «фотошоповский фон», мы создадим файл screenshot.png и отправим его прямиком в папку с темой (рекомендуемое разрешение 1200px на 900px).

Что касается расширения файла, то сгодится и jpg и gif, и jpeg, но в официальной документации WP рекомендуется всё же использовать screenshot.png .

Вот что у меня получилось:

Для чего нужны wp_head() и wp_footer()

После того, как вы начинаете добавлять первый HTML в теме, то вам сразу же нужно сделать две вещи:

1. Добавить функцию wp_head() перед закрывающим тегом ,
2. Добавить функцию wp_footer() перед закрывающим тегом .

Что-то типо этого:

!DOCTYPE html> html> head> ?php wp_head() ?> /head> body> ?php wp_footer() ?> /body> /html>

Это обязательное условие для всех тем WordPress, благодаря этим функциям работают плагины (даже банально плагин для вставки кода Google Analytics на сайт), подключаются различные дополнительные CSS и JS в тему и так далее. Чуть более подробно описываю предназначение этих функций на видео.

functions.php

Трудно представить тему для WordPress, в которой отсутствует файл functions.php , он используется для включения каких-либо функций темы, например:

• подключения стилей и скриптов,
• регистрации областей меню,
• регистрации сайдбаров,
• включения поддержки изображений поста и так далее и так далее.

Также он сам может содержать какой-то дополнительный функционал, ну либо файлы, подключенные в него через include() / require() .

Главное правило по functions.php — сам по себе файл не должен ничего выводить! �� То есть никогда не оставляем первую строку пустой! ��

И никогда не обрываем PHP-код пустыми строками где-то посередине кода! ��

Это очень распространённая ошибка. Очень!

Пока что можете создать пустой файл functions.php в папке с вашей темой.

Пример работы с functions.php. Что делать, если админ-панель наехала на вёрстку сайта?

После того, как мы вставили в наш шаблон функции wp_head() и wp_footer(), у нас появилась админ панель сверху сайта, которая налезла на вёрстку.

Такое случается практически всегда, когда в вашей вёрстке присутствуют фиксированные меню.

В видеоуроке я решил не заморачиваться и просто скрыл админ-панель при помощи этой строки кода в functions.php :

add_filter( 'show_admin_bar', '__return_false');

Также я показал, как это делать через настройки сайта. Однако, как поступить, если она вам нужна и вы не хотели бы её скрывать?

В этом случае нужно сделать некоторые небольшие изменения в CSS вёрстки, когда у нас фиксированное меню, оно имеет CSS-свойство top:0 , верно?

• Высота админ панель для десктопа 32px, значит мы меняем упомянутое выше свойство на top:32px .
• Высота админ бара для мобайл (менее 782px) 46px, а значит меняем свойство меню на top:46px .

После добавления соответствующих CSS-стилей вы можете заметить, что изменения применяются даже тогда, когда админ-панель не отображается на сайте! (например для незарегистрированных пользователей). Что делать?

1. Добавьте к тегу функцию body_class() примерно так: > – суть этой функции в том, что она добавляет различные CSS-классы в зависимости от того, зареган пользователь или нет, от того, на какой странице мы находимся и так далее.
2. Используйте появившийся класс в теге – .admin-bar , для того, чтобы применять соответствующие стили только для ситуаций, когда админ бар отображается на сайте.

Также можете почитать на моём сайте урок, в котором я переносил админ бар в нижнюю часть страницы.

Что делать, если в процессе создания темы WP у вас всё сломалось и отображается белый экран?

Если вы делали шаги в этом уроке, но после того, как вставили или изменили какой-то код, у вас стал отображаться белый экран, и вы не знаете из-за чего, то вы можете поступить следующим образом:

1. Открываем файл wp-config.php , который лежит в корне вашей установки WordPress
2. Ищем там параметр WP_DEBUG и устанавливает его равным true (таким его и можно оставить до конца нашего курса).
3. После этого вместо вашего белого экрана у вас будет отображаться, какие ошибки возникли в процессе с указанием того, на какой строке и в каком файле находится ошибка в коде.
4. Исправляете и продолжаем ��

Купить курс

• 21 видеоурок
• Можно скачать готовый код после каждого урока
• Можно начать проходить курс сразу же после оплаты
• Достаточно базовых знаний HTML и CSS, чтобы пройти курс
• Единоразовый платёж
• Доступ навсегда
• Уроки актуальны в 2023-м году

Как создать тему WordPress

Чтобы создать тему WordPress, вы должны хорошо знать CSS, HTML, Javascript или Jquery и хотя бы понимать основы PHP. Также перед тем, как приступить к изучению материала, вам нужно установить wordpress локально на компьютер или на хостинге.

The Underscores

Да, создание темы WordPress с нуля кажется пугающей задачей, но не волнуйтесь, вы можете использовать underscores-это стартовая тема, на основе которой вы можете создать любую тему WordPress.
Перейдите на сайт http://underscores.me и введите имя вашей темы в текстовое поле, после этого нажмите кнопку Создать (generate).

Через несколько секунд начнется загрузка, и у вас будет готова начальная тема на основе underscores. После загрузки архива темы, распакуйте его в папку темы вашего сайта WordPress wp-content/ themes.

Вот как будет выглядеть структура вашей темы:

Как вы можете видеть на скриншоте, большинство файлов не требуют пояснений, все понятно из названия.

Веб-сайт может быть структурирован со следующими файлами:

• Header (Заголовок)
• Footer (Подвал)
• Content Section (Содержимое)
• Sidebar (Боковая панель)

На рисунке ниже представлена базовая структура веб-сайта с указанными файлами темы. Заголовок управляется файлом header.php, боковая панель — sidebar.php и за нижнюю часть (подвал) отвечает файл footer.php.

Теперь давайте разберемся, какие файлы используются для создания раздела контента сайта WordPress. Раздел содержимого веб-сайта является динамическим, что означает, что он изменяется от страницы к странице и, таким образом, использует определенные файлы, основанные на типе загружаемой страницы WordPress.

Файл по умолчанию для раздела содержимого — index.php, WordPress использует его как шаблонный файл в вашей теме. Однако сначала он ищет другие, более специфические файлы вместо index.php.

WordPress Посты

Для записей WordPress использует файл single.php. Однако в теме underscore этот файл включает в себя другой файл в каталоге template-parts с именем template-parts/content, который отображает содержимое одной записи. Таким образом, если сообщение WordPress загружено, эти 2 файла отвечают за создание содержимого раздела контента.

Страницы WordPress

Если страница WordPress загружена, загружается файл page.php (если доступен), и этот файл также включает в себя другой файл в каталоге template-parts под названием template-parts/content — page, который отображает содержимое страницы.

Архивы, Результаты поиска и страница ошибок

Помимо записей и страниц есть и другие типы страниц WordPress, давайте посмотрим на них как на список с классификацией файлов:

• Архив страниц, файлов (archive.php, content.php )
• Category Archive Pages
• Tag Archive Pages
• Date Archive Pages
• Author Archive Pages
• Страница результатов поиска, файлы (search.php, content-search.php)
• Страница Ошибок (404.php)

Файл по умолчанию

Как упоминалось выше, файл темы по умолчанию — index.php и, если какой-либо из вышеперечисленных файлов будет отсутствовать в вашей теме WordPress, вместо него будет загружен индексный файл по умолчанию.

Давайте пересмотрим приведенную выше диаграмму:

Однако, если вы посмотрите в папку темы, вы заметите больше файлов, давайте посмотрим на них.

Комментарии

comments.php отвечает за отображение комментариев WordPress.

Functions

Это очень важный файл. Он используется для настройки функциональности темы. Готовая тема уже включает в себя много полезных и необходимых функций в functions.php, например:

• Сделать тему доступной для перевода.
• Первичная регистрация меню.
• Пользовательская фоновая функция.
• Регистрация областей виджетов.
• Погрузка скриптов и стилей.
• Пользовательская функция заголовка.

Файл Стилей

Существует также файл таблиц стилей в теме WordPress. Он поставляется с файлом style.css, который содержит базовый css, чтобы дать вам основу для дальнейшего оформления вашей темы / веб-сайта.

Файл Скриншота

Есть также файл под названием screenshot.png, который является файлом изображения и используется на обозначения вашей темы в разделе Внешний вид.

Тема включает в себя еще несколько файлов и папок – inc, js, languages, layouts.

template-parts — этот каталог, который я упоминала выше, он содержит некоторые файлы PHP для раздела контента:

• • content.php
  • content-none.php
  • content-page.php
  • content-search.php

  

  Эта шпаргалка поможет быстрее запомнить важную информацию.

  Оформление темы

  Теперь откройте Панель инструментов. Перейдите в раздел Внешний вид-Темы, вы увидите темы, которые у вас уже установлены, нажмите на тему, которую вы только что загрузили, и вы должны увидеть следующее изображение:

  

  Нажав на кнопку информация о теме вы увидите примерно следующее:

  

  Активируйте свою тему и посетите домашнюю страницу своего сайта WordPress. Вы увидите сломанный сайт без стиля.

  

  Теперь мы будем применять стили и настраивать эту тему шаг за шагом.

  Инструменты, необходимые при создании отзывчивой темы WordPress шаг за шагом:

  1. Данные

  Прежде чем применять какие-либо настройки к этой теме, вам нужно создать свой шаблон сайта с помощью HTML + CSS и, возможно JS.

  В интернете есть множество бесплатных шаблонов, которые можно скачать и использовать в качестве тренировки.

  2. Ошибки

  При создании собственной темы вы также должны получать уведомления, когда что-то идет не так, для этого нужно установить плагин, вы можете напрямую установить его из каталога плагинов WordPress, например плагин Query Monitor.

  Также, чтобы получать сообщения об ошибке в режиме реального времени нужно открыть файл wp-config.php, найти запись define(‘WP_DEBUG’, false) — заменить false на true

  Еще вам понадобится любой текстовый редактор, например Sublime Text Editor, VSC или Notepad++.

  Назвать тему

  Перейдите в папку каталога тем и откройте style.css, здесь вы можете установить имя вашей темы, URI, автора, описание и теги. Когда вы откроете style.css вы увидите что-то вроде этого,

  

  Название темы (Theme Name ) — название вашей темы.

  Theme URI — обычно здесь публикуют домашнюю страницу темы, но вы можете использовать свой собственный адрес сайта.

  Автор (Author) — это вы. Укажите свое имя или псевдоним.

  Автор URI-ссылка на вашу домашнюю страницу или сайт.

  Описание (Description) — необязательное описание вашей темы. Это будет отображаться в бэкэнде WordPress.

  Version-версия вашей темы, например 1.0.

  Лицензия, URI лицензии, Теги-эти вещи важны только в том случае, если вы планируете отправить свою тему в каталог тем WordPress.

  Создание простой темы для WordPress

  Публикуем перевод статьи Nick La — это пособие по работе с темами WordPress. Пост был опубликован в 2011 году, но принципы и подходы, описанные в материале, до сих пор актуальны. Если у вас будут замечания и комментарии, пишите их под постом: дополним, расширим статью. Далее материал будет идти от первого лица.

  Эта статья поведает вам о том, как создать самую простую тему для WordPress. Хотя Codex и предоставляет обширную документацию по этому вопросу, но мне она кажется несколько сложной для новичка. Поэтому в данном «туториале» я расскажу принципы работы тем для WordPress и покажу как адаптировать под них сырой HTML-шаблон. При этом от вас не требуется знание PHP, но хорошо если вы владеете Photoshop и CSS для создания дизайна.

  1. Frontend блога

  До того как мы начнём, давайте взглянем на стандартную тему WordPress и разберёмся из чего она состоит. Отметим элементы: шапка, заголовок поста, форма поиска, навигация, подвал.

  Стандартный Frontpage ( index.php )

  Стандартный Single ( single.php )

  2. Photoshop-макеты

  Основываясь на внешнем виде стандартной темы, разработайте Photoshop-макеты для вашего блога. Для примера я использую GlossyBlue — одну из моих бесплатных тем.

  3. HTML и CSS

  Когда PSD-дизайн готов, создайте HTML+CSS шаблон каждой страницы.

  Зачем сперва создавать статический HTML? Главным образом это нужно потому, что это значительно упростит процесс разработки. Обычно я создаю HTML файл для каждого шаблона, проверяю их валидность (HTML и CSS разметку) во всех браузерах. После этого остаётся лишь вырезать и вставить код WordPress. Так что можно уже не беспокоиться об ошибках в HTML или CSS.

  4. Как работает тема WordPress

  Если вы перейдёте к папке стандартной темы ( wp-content/themes/default ), то увидите много php-файлов (называемых файлами шаблонов) и один файл style.css . Для формирования страницы WordPress обычно использует несколько файлов шаблонов (index.php , header.php, sidebar.php, и footer.php).

  Подробнее в Codex: «Архитектура сайта» и «Иерархия шаблонов» .

  5. Дублирование файлов шаблонов

  Скопируйте папку HTML из GlossyBlue в папку wp-content/themes . После этого перейдите в директорию темы default , скопируйте comments.php и searchform.php в папку glossyblue .

  6. Style.css

  Перейдите в папку темы default , откройте файл style.css . Скопируйте закомментированный в начале файла текст и вставьте в style.css темы GlossyBlue . Если хотите, можете изменить название и данные об авторе.

  7. Разделение файлов

  Теперь нам нужно понять где разделить HTML-файлы на части: header.php , sidebar.php , и footer.php . На скриншоте ниже видно упрощённую версию моего index-файла, а также принцип его деления.

  8. Header.php

  Откройте index.html . Вам нужно вырезать участок от верха до места, где заканчивается , вставить его в новый php-файл и сохранить как header.php . Перейдите в папку темы default , откройте новый header.php . Скопируйте и замените теги, где этого требует php-код: title, link, таблицы стилей, h1 и div >

  Меню навигации ( wp_list_pages ) Замените тэги li в ul > на ;

  9. Sidebar.php

  Вернитесь к index.html , вырежьте код с того места, где начинается form > и до закрытия тега div > , поместите его в новый php-файл и сохраните как sidebar.php .

  • Замените form > со всем содержимым на .
  • Замените теги li категорий на
  • Замените теги li архивов на

  10. Footer.php

  Вернитесь к index.html . Извлеките оттуда код от div > включительно с тегом div > и до конца /html затем поместите в новый footer.php .

  Недавние записи Тут я использовал query_post для отображения 5 последних записей в блоге.

  «Последние комментарии» «Последние комментарии» сгенерированы плагином (включён в папку темы).

  11. Index.php

  Теперь в вашем index.html должен остаться только div > . Сохраните файл как index.php . Впишите строки: get_header , get_sidebar , и get_footer в том порядке, как они встречаются в шаблоне.

  12. Разбор цикла

  Цикл последовательно отображает записи блога в зависимости от ваших настроек. Скриншот ниже иллюстрирует его работу. Изначально цикл проверяет наличие записей и если таковых не находит, то выдает сообщение «Not Found».

  13. Копирование цикла

  Перейдите к директории темы default , откройте index.php . Скопируйте цикл из стандартного index.php в свой — между div > . После этого замените статический текст тегами шаблона WordPress: post date, title, category, comments, next и previous link.

  14. Предпросмотр темы

  Поздравляю! Вы создали публичную часть (основную часть шаблона). Теперь зайдите в административную панель, перейдите к закладке Design, вы должны увидеть тему GlossyBlue . Активируйте её и перейдите к публичной части, чтобы посмотреть результат в действии.

  15. Single.php

  Пришло время создать шаблон single.php . Если хотите, можете повторить шаги, перенося код из стандартной темы. Но мне кажется более простым использовать только что созданный index.php , сохранив его как single.php . Откройте single.php из стандартной темы и скопируйте теги шаблона в нужные места. Далее подключите comments_template . На следующем скриншоте отображены внесенные мною изменения:

  16. Page.php

  Теперь новый single.php сохраните с названием page.php . Уберите дату записи, форму комментариев, ссылки следующий/предыдущий. Вот, собственно, и всё — ваш шаблон page.php готов .

  17. Удаление файлов HTML

  Удалите все файлы HTML из папки glossyblue (они нам больше не понадобятся). Технически этого достаточно для создания базовой темы WordPress. Вы, наверное, заметили, что в стандартной теме больше PHP-файлов. Что же, на самом деле, они вам не так уж необходимы, если требуется простая тема. Например, если search.php или 404.php не будет в папке темы, WordPress автоматически использует index.php для отображения страницы. Читайте Template Hierarchy для более подробного рассмотрения.

  18. Шаблон страницы WordPress

  А теперь последний пример — я покажу вам как использовать Page Template для создания страницы Архива, которая будет содержать список всех записей на вашем блоге (удобно для карты сайта). Скопируйте archives.php из папки стандартной темы. Удалите ненужный код и получите что-то вроде этого:

  Тут я использовал query_post ( showposts=-1 означает «отобразить все записи»), чтобы перечислить все записи.

  Теперь зайдите в панель администратора, создайте новую страницу и назовите её Archives. В выпадающем списке шаблонов выберите Archives.

  Дополнительная литература

  Просмотрите список Плагины WordPress, возможно, они покажутся вам полезными. Для более углублённого изучения читайте WordPress Theme Hacks.

  Работал Web developer в компании «ООО «Цитрус Дискаунт»», «Netpeak», «Infomir», Front-End Developer в компании «Ciklum Odessa», Programmer в COMODO, Web developer в компании «ООО «Цитрус Дискаунт»».

  Узнайте больше

  

  75

  Тема

  Это главная страница руководства по созданию тем (шаблонов) для WordPress. Основная информация взята из официального руководства и из личного опыта.

  Чтобы сразу посмотреть общий принцип создания темы, перейдите к части учебника: Создание самой простой темы

  Что такое тема?

  Тема WordPress — это набор css, js, php файлов, которые в связке с WordPress и плагинами выводят информацию из базы данных на экран в красивом и удобном виде (дизайне). Ну или в некрасивом и неудобном, тут смотря какую тему выбрать. В других движка тему еще называют «шаблоном», но в WordPress принято говорить именно тема — theme, а не шаблон — template. Хотя и то и другое по сути одно и тоже. Таким образом, если вы меняете тему, то сайт меняет свой вид, выглядит иначе. На WordPress.org есть тысячи бесплатных тем. Несмотря на широкой выбор тем, многие предпочитают создавать свои темы. Связанно это в первую очередь с тем, что создать простую тему не сложно.

  Необходимые файлы

  1. index.php — главный файл темы, отвечает за вывод содержимого
  2. style.css — главный файл стилей, отвечает за css стили

  Но ни одна тема по факту не состоит всего из двух файлов. Их больше: PHP, языковые файлы, файл CSS и JS, текстовые файлы. Тему начинают с двух файлов, а затем, чтобы было удобнее, её расширяют, добавляя такие файлы как:

  • header.php — отвечает за вывод шапки
  • footer.php — отвечает за вывод подвала
  • sidebar.php — отвечает за вывод боковой панели
  • page.php — отвечает за вывод отдельной страницы (записи)
  • и т.д. смотрите полный список.

  Возможности темы

  Возможности темы по сути безграничны, ведь там можно полностью использовать PHP. НО! Тема, как призвана отображать содержимое сайта определенным образом, а не добавлять функционала сайту. Поэтому возможности темы принято ограничивать до тех, которые отвечают за внешний вид, а все остальные возможности: голосование, рейтинги, редиректы, СЕО и т.п. принято выносить в плагины.

  Таким образом, тема может:

  • Отвечать за вывод содержимого сайта под разные типы устройств: мониторы и смартфоны. Такие темы называются адаптивные. Также темы могут быть фиксированные, одноколоночные, двухколоночные и т.п.;
  • Тема может выводить любое содержимое;
  • Может указать, какой контент будет отображаться для разных пользователей;
  • Может использовать любые элементы дизайна (картинки, видео).

  Как и на любом сайте, тема — это не только цветовое решение, макет и красивая картинка. По-настоящему качественные темы еще и очень функциональны. Функциональность темы, заключается в её гибкой настройке. Т.е. она не добавляет ничего нового на сайт, но отлично настраивается по вкусу владельца. Например: устанавливается фоновая картинка, меняется цвета элементов, настраивается меню и блоки с контентом (виджеты).

  Чем тема отличается от плагина?

  С точки зрения кода, можно сказать, ничем — в теме можно создать полноценный плагин. А вот с точки зрения логики — всем! Задача плагина, добавить что-то новое на сайт, например добавить опрос. Задача темы — вывод содержимого, в том числе, этого опроса.

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

  Никогда не добавляйте функциональность в саму тему, если только на это нет веских причин. Если это сделать, то при смене темы функциональность потеряется в месте с ней. Например, в вашей теме есть крутая фотогалерея. И если поменять тему, то эта крутая фотогалерея потеряется.

  Поэтому любой функционал связанный с редактированием/добавлением содержимого сайта должен быть оформлен как плагин.

  Где скачивать темы?

  Каталог тем на сайте WordPress.org. — одно из самых безопасных мест, где можно скачать темы. Там все темы проверяются на соответствие требованиям и рекомендациям.

  Есть и другие источники, но там темы обычно платные. Например, темы можно скачать на: Creative Market.

  Старт

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

  1. настроить локальную среду разработки.
  2. Затем можно посмотреть примеры WordPress-тем.
  3. Ну и начать разработку своей первой темы.

  Этот раздел в процессе разработки. И вообще, я его начал писать и забросил, неинтересное занятие получается. Будет время, желание продолжу.