Создать шаблон wordpress: 3 способа создать шаблон страницы в WordPress

Шаблоны страниц и записей в WordPress

Типы постов  /  11 комментариев

Страницы — это один из типов постов WordPress. По умолчанию все страницы выглядят одинаково, но средствами WordPress вы можете сделать страницы вашего сайта уникальными. Например создать страницу с картой, создать HTML-карту сайта, страницу с формой, лендинги и т.д. Всё это можно реализовать при помощи шаблонов страниц вордпресс.

Кроме того, с версии WordPress 4.7 шаблоны поддерживаются всеми типами записей!

Подробное видеоруководство о том, в каких ситуациях какие PHP-шаблоны из темы WordPress задействует.

Добавить шаблон для страницы WordPress можно при её редактировании

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

Для того, чтобы это проверить:

1. Переходим в Страницы > Добавить новую.
2. В метабоксе «Атрибуты страницы» выбираем один из шаблонов.

Либо, если у вас используется редактор Gutenberg, то опцию выбора шаблона вы сможете найти в настройках на вкладке «Страница» справа:

Если ваша тема не имеет ни одного шаблона страниц, то выпадающий список шаблонов просто будет отсутствовать.

Опции быстрого (Свойства, Quick Edit) и массового (Bulk Edit) редактирования также имеют возможность задавать шаблоны для страниц.

Нужно нажать ссылку «Свойства»

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

Как создать шаблон для страницы WordPress?

Для того, чтобы создать свой произвольный шаблон страницы WordPress, нужно сделать два шага:

1. В папке с темой создать какой-нибудь файл, так, чтобы его название не перекликалось с условными названиями файлов темы WordPress. Если не уверены, то придумайте такое название, которое кроме вас больше никому не прийдет в голову 🙂 например misha123.php.Файл шаблона также может располагаться в папке с родительской темой, папке с дочерней темой и, начиная с версии WP 3.4, в директории темы вы можете создать любую подпапку для шаблонов страниц.
2. В начале вашего файла нужно обязательно указать название шаблона — после этого WordPress его «увидит»:

/*
 * Template name: Мой Супер-шаблон
 */

Так тоже норм:

/* Template name: Мой Супер-шаблон */

Далее в шаблоне вы можете использовать абсолютно любой код, не хотите подключать get_header() и get_footer() сайта? — да пожалуйста, можете вообще просто один <iframe> туда засунуть и будет норм.

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

Иерархия и порядок подключения файлов страниц

Кстати, про иерархию я уже записывал видеоурок.

Список ниже показывает приоритет задействования PHP-шаблонов файлов темы для отображения типа записей «Страницы».

1. custom-template.php (если файл шаблона существует и выставлен для данной страницы в её настройках)
2. page-{ярлык страницы}.php (если существует)
3. page-{ID страницы}.php (если существует)
4. page.php (наиболее распространённое решение практически во всех темах)
5. singular.php (если page.php не существует)
6. index.php (используется, если все вышеперечисленные файлы отсутствуют в папке с темой)

Хотите лучше разбираться в иерархии шаблонов WordPress? – Рекомендую видеоурок.

Шаблоны записей и постов произвольного типа

Блеск, теперь мы знаем, как создать шаблон для страницы WordPress, но начиная с версии движка 4.7 мы также легко можем создать шаблон записи (любого типа кстати).

Принцип точно такой же, как и для страниц, только помимо параметра Template name:, нам ещё на следующей строке нужно указать параметр Template post type:, в котором можно указать название типа поста, или несколько названий через запятую, например я захочу использовать свой шаблон и для записей и для страниц, в этом случае он будет начинаться так:

/*
 Template name: Отдельный шаблон записи WordPress
 Template post type: post, page
 */

Если у вас уже был какой-то шаблон для страниц и он уже использовался на сайте, то, после того, как вы захотите использовать его как шаблон записи WordPress и добавите туда параметр

Template post type:, то уже существующие страницы, использующие этот шаблон не перестанут работать, однако при редактировании там уже будет указан Базовый шаблон.

А для соответствующего типа записи сразу появится возможность выбора шаблона в «Свойствах записи»:

В меню быстрого редактирования он тоже появится.

Определение используемого шаблона на странице

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

Классы тега <body>

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

Зато эта функция очень удобна, в атрибуте class тега <body> она выведет:

• тип текущего поста, например page,
• ID текущего поста, например page-id-{ID},
• page-template, если используется произвольный шаблон страницы,
• и… сам используемый шаблон страницы! Если же никакой шаблон не используется (ну я имею используются либо page.php, либо page-{ID}.php, либо page-{ярлык}.php, то будет добавлен класс page-template-default.

Пример:

<body>

Давайте разберёмся, как формируется название класса тега <body> для произвольного шаблона страниц. Предположим мы создали шаблон digital-agency.php и поместили его в папку page-templates в нашей теме, ну типо как page-templates/digital-agency.php. В отдельную директорию шаблон помещать не обязательно, кроме того, это стало возможно начиная с версии WordPress 3.4.

В итоге в классы будут добавлены:

• page-template – то, что используется произвольный шаблон страницы,
• page-template-page-templates – page-template-{папка шаблона},
• page-template-digital-agency – page-template-{название файла},
• page-template-page-templatesdigital-agency-php – название файла шаблона с расширением и с названием папки, в которой он находится.

Условный тег is_page_template()

Если же мы хотим проверить, используется ли определённый шаблон страницы WordPress внутри кода PHP, например у нас общий для всех страниц

header. php, то рекомендую использовать функцию is_page_template().

Для нашего примера условие будет выглядеть следующим образом:

if( is_page_template( 'page-templates/digital-agency.php' ) ){
	// да, используется этот шаблон страницы
}

Видеоурок:

Хотите лучше разбираться в шаблонах WordPress? Попробуйте пройти мой видеокурс по созданию шаблона (темы) на основе готовой HTML-вёрстки.

Миша

Впервые познакомился с WordPress в 2009 году. Организатор и спикер на конференциях WordCamp. Преподаватель в школе Нетология.

Пишите, если нужна помощь с сайтом или разработка с нуля.

Шаблоны — Поддержка

Шаблоны позволяют управлять разметкой страниц. В отличие от тем, которые задают дизайн всего веб-сайта, шаблон влияет на внешний вид и образ отдельных записей и страниц (или групп записей и страниц).

В этом руководстве рассказывается, как изменить шаблон страницы и отредактировать его в некоторых темах.

Шаблоны

Если в тему включены шаблоны, на боковой панели редактора в настройках страницы будет отображаться раздел Шаблон, как показано на изображении справа.

Шаблон управляет отображением страницы. Стандартные шаблоны включают следующие:

• Шаблон по умолчанию: стандартный шаблон.
• Шаблон в полную ширину: этот шаблон показывает содержимое страницы в полную ширину экрана без боковых панелей.
• Шаблон сетки: этот шаблон отображает содержимое в разметке в виде сетки (см. этот пример из темы Dara).

Смена шаблона страницы влияет только на эту страницу, а не на весь веб-сайт.

Иерархия шаблонов

Прежде чем приступать к редактированию шаблонов, необходимо разобраться в их иерархии. Есть несколько базовых шаблонов, которые автоматически создаются при выборе темы. WordPress использует такие шаблоны для создания стилей по умолчанию для некоторых типов страниц. Например:

• Если на главной странице сайта отображаются последние записи, для создания стиля этой страницы применяется шаблон Home или Index.
• Если на главной странице сайта отображена обычная страница, для создания стиля домашней страницы применяется шаблон
  Front page или Page.
• Во многих темах на основе блоков есть встроенные шаблоны, например Single Post для настройки внешнего вида отдельных записей или 404 для страниц ошибки 404.
• Шаблон Archive используется для рубрик или архивов, но не применяется для страниц записей.

💡

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

Если вам интересны технические аспекты настройки таких шаблонов, см. справочник по темам на WordPress.org.

Редактирование шаблонов

Редактирование шаблонов — это новая концепция, представленная в WordPress для расширения возможностей управления разметкой содержимого. В этом помогает редактор шаблонов, который в некоторых темах позволяет создавать пользовательские шаблоны и назначать их конкретным страницам и записям.

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

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

Доступ к редактору шаблонов через редактор страниц или записей

Работая над страницей или записью, найдите Шаблон в настройках на правой боковой панели. Вы увидите используемый шаблон. Нажмите Редактировать, чтобы переключиться в редактор шаблона и изменить шаблон:

После выбора шаблона для редактирования откроется Редактор шаблонов. Чтобы определить, что вы редактируете шаблон, а не страницу или запись, убедитесь, что (1) вокруг области редактирования содержимого есть чёрная рамка; (2) в верхней части отображается название шаблона; (3) на боковой панели настроек отображается слово «шаблон»:

Признаки того, что вы редактируете шаблон

Доступ к редактору шаблонов через редактор сайта

Шаблоны также можно редактировать в редакторе сайта. Перейдите в раздел Внешний вид → Редактор на консоли. Откроется шаблон, который используется на домашней странице. Чтобы перейти к редактированию другого шаблона, щёлкните значок сайта в левом верхнем углу и выберите Шаблоны.

Выбор шаблона для редактирования

В теме есть несколько шаблонов, которые можно редактировать напрямую. Чтобы просмотреть их, щёлкните значок сайта в левом верхнем углу и выберите Шаблоны. Откроется список, в котором будут созданные вами шаблоны. Чтобы отредактировать шаблон, щёлкните его имя. Этот шаблон откроется в редакторе, где его можно будет отредактировать.

Просмотр структуры шаблона

Чтобы просмотреть все блоки в шаблоне, щёлкните Список в верхней части экрана (значок в виде трёх горизонтальных линий).

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

Представление в виде списка в Редакторе шаблона

Редактирование блоков шаблона

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

• Редактирование элементов заголовка с помощью блока «Название сайта», блока «Ключевая фраза сайта» и блока «Логотип сайта». Перейдите на страницу Настройка заголовка, чтобы узнать больше.
• Добавление меню с помощью блока «Навигация».
• Добавление боковой панели с помощью столбцов.
• Управление внешним видом записей.
• Скрытие названий страниц или записей.
• Редактирование внешнего вида подвала.

Возможности безграничны!

Сохранение изменений

Закончив редактирование, в правом верхнем углу щёлкните Сохранить.

Здесь будет отображаться изменённый шаблон. Нажмите Сохранить ещё раз, чтобы подтвердить сохранение изменений шаблона.

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

Сброс шаблона

Шаблон можно сбросить до исходного состояния, отменив все внесённые изменения.

1. В редакторе сайта щёлкните значок сайта в левом верхнем углу.
2. Выберите Шаблоны, чтобы просмотреть все свои шаблоны.
3. Щёлкните три точки рядом с шаблоном, который нужно сбросить.
4. Выберите Очистить настройки. Изменения сразу будут отменены.

Примеры использования редактора шаблонов

Существует много способов использования редактора шаблона для создания красивых пользовательских разметок. Здесь представлено несколько примеров.

Добавление пользовательского меню

Если вы хотите представить пользовательское меню только на конкретных страницах, с помощью Редактора шаблонов добавьте Блок «Навигация», как показано на видео ниже:

Добавление пользовательского подвала

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

Создание нового шаблона

Можно разработать новый шаблон и применить его к отдельным страницам и записям. Чтобы создать новый шаблон, выполните следующие действия:

1. Чтобы создать новый шаблон, нажмите Новый на правой боковой панели в разделе «Шаблон» настроек страницы.
2. Назовите шаблон и нажмите Создать.
3. В Редакторе шаблона можно отредактировать структуру отображения страницы.
4. После этого щёлкните Обновить в правом верхнем углу, чтобы сохранить шаблон.
5. Щёлкните Назад, чтобы вернуться в редактор страницы или записи. Новый шаблон появится в списке доступных шаблонов.

Применение шаблона

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

1. Добавьте или отредактируйте страницу либо запись, к которой вы хотите применить шаблон.
2. На боковой панели Настройки найдите раздел Шаблон. Если боковая панель «Настройки» не открывается, щёлкните значок настроек рядом с кнопкой «Опубликовать» или «Обновить», чтобы открыть боковую панель.
3. Выберите шаблон, который нужно применить.

Вы можете выполнить предварительный просмотр страницы или записи с применённым шаблоном. Щёлкните опцию Предварительный просмотр

в верхней части редактора и выберите Предварительный просмотр в новой вкладке.

Если вас устраивает шаблон и содержимое страницы или записи, щёлкните Опубликовать. Либо же если страница или запись уже опубликована, щёлкните Обновить, чтобы применить изменения для опубликованной страницы.

📌

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

Разнообразие тарифных планов и ценовых предложений

• Бесплатно

  Оптимальный вариант для студентов

• Personal

  Оптимальный вариант для представления своего хобби

• Premium

  Оптимальный вариант для фрилансеров

• Business

  Оптимальный вариант для малых предприятий

Ваша оценка:

Шаблоны

— Служба поддержки WordPress.com

Шаблон управляет макетом ваших страниц. Не путать с темами (которые задают дизайн всего сайта). Шаблон влияет на внешний вид отдельной страницы (или публикации) или группы страниц (или записей).

В этом руководстве объясняется, как изменить шаблон страницы и отредактировать его по определенным темам.

В этом руководстве

Шаблоны

Если ваша тема включает шаблоны, которые вы можете редактировать, вы увидите раздел «Шаблон» на боковой панели редактора в разделе «Параметры страницы», как показано на изображении справа. И вы увидите ссылку на Редактор сайта под Внешний вид в панели управления WordPress.com.

Шаблон определяет способ отображения страницы.

Изменение шаблона страницы влияет только на эту страницу (а не на весь сайт).

Вы можете определить шаблон, используемый страницей, выполнив следующие действия:

1. Перейдите на страницу Pages в панели управления WordPress.com.
2. Щелкните имя страницы, чтобы открыть ее в редакторе.
3. В разделе «Параметры страницы» в разделе «Сводка » найдите Вариант шаблона .
4. Обратите внимание на имя шаблона, который использует страница.

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

Значок настроек в правом верхнем углу

 

Распространенные типы шаблонов

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

✅

В этом руководстве основное внимание уделяется редактированию шаблонов, включенных в темы Site Editor. Если вы используете классическую или стороннюю тему, вы можете узнать больше о настройке шаблонов, включенных в вашу тему, посетив Внешний вид → Темы . Затем выберите параметр info для вашей активной темы.

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

Наиболее распространенные шаблоны перечислены ниже.

• Домашний шаблон — используется, когда вы настроили домашнюю страницу по умолчанию.
• Шаблон индекса — если шаблон домашней страницы отсутствует, некоторые темы будут использовать шаблон индекса в качестве домашней страницы по умолчанию. В противном случае он используется для отображения ваших последних сообщений.
• Шаблон страницы — некоторые темы используют шаблон страницы для отображения главной страницы. Шаблон страницы управляет макетом стандартных страниц вашего сайта, таких как страница «О нас» или «Контакты».
• Одиночный шаблон — этот шаблон стилизует ваши отдельные сообщения в блоге.
• Шаблон архива — это дизайн категорий и других страниц архива.

💡

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

Если вас интересуют более технические аспекты настройки этих шаблонов, вы можете ознакомиться с Theme Handbook на WordPress.org.

Как редактировать шаблоны

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

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

Доступ к редактору шаблонов через редактор сайта

Вы можете редактировать шаблоны через Редактор сайта.

1. Перейдите к Внешний вид → Редактор на панели управления.
2. По умолчанию шаблон домашней страницы вашего сайта будет отображаться первым.
3. Нажмите Изменить , чтобы изменить шаблон домашней страницы вашего сайта.
4. Вы попадете в редактор шаблонов .

Доступ к шаблону в Редакторе сайта.

📌

Если вы не видите возможность загрузить Редактор сайта, возможно, вы используете классическую или стороннюю тему. Вы можете узнать больше о редактировании шаблонов, включенных в вашу тему, посетив Внешний вид → Темы . Затем выберите параметр info для вашей активной темы.

Быстрое редактирование шаблона

Вы можете быстро редактировать шаблон страницы при редактировании страницы или публикации.

1. В редакторе страниц щелкните Шаблон в разделе Параметры страницы .
2. Щелкните Редактировать шаблон , чтобы открыть быстрый редактор шаблона.

Изменения, внесенные в шаблон, будут применяться ко всем страницам, использующим этот шаблон.

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

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

Значок настроек в правом верхнем углу

Выберите шаблон для редактирования

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

1. Если вы уже находитесь в редакторе сайта , щелкните значок своего сайта, чтобы открыть боковую панель «Дизайн».
2. Щелкните Шаблоны , чтобы развернуть список шаблонов, включенных в вашу тему, и любых созданных вами пользовательских шаблонов.
3. Щелкните имя шаблона, который вы хотите изменить, и щелкните значок Редактировать 9.кнопка 0035.
4. Вы попадете в редактор шаблонов для выбранного вами шаблона.

Переключение между шаблонами в Редакторе сайта.

Просмотр структуры вашего шаблона

Вы будете знать, что редактируете шаблон, потому что вы увидите имя редактируемого шаблона (1), а в разделе «Настройки» вы увидите «Шаблон» (2):

Как узнать, что вы редактируете шаблон

Чтобы просмотреть список всех блоков в вашем шаблоне, нажмите Просмотр списка в верхней части экрана (значок выглядит как три горизонтальные линии).

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

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

Редактирование блоков шаблона

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

• Отредактируйте элементы заголовка, используя блок заголовка сайта, блок слогана сайта и блок логотипа сайта. Посетите страницу «Настройте свой заголовок», чтобы узнать, как это сделать.
• Добавить меню с помощью блока навигации.
• Добавить боковую панель с помощью столбцов.
• Контролируйте внешний вид ваших сообщений.
• Скрыть заголовки страниц или сообщений.
• Измените внешний вид нижнего колонтитула.

Возможности безграничны!

Сохранить изменения

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

Здесь будет показан затронутый шаблон. Нажмите Сохранить еще раз, чтобы подтвердить, что вы хотите сохранить изменения, внесенные в этот шаблон.

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

Сброс шаблона

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

1. В Редакторе сайта щелкните значок своего сайта в верхнем левом углу.
2. На левой боковой панели выберите  Шаблоны  , а затем Управление всеми шаблонами .
3. На главной странице «Шаблоны» щелкните три точки рядом с шаблоном, который вы хотите сбросить. Вы увидите измененные шаблоны, выделенные розовой точкой в ​​столбце Added by .
4. Щелкните три точки рядом с измененным шаблоном и выберите Удалить настройки . Изменения будут немедленно отменены.

⚠️

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

Примеры использования редактора шаблонов

Существует множество способов использования редактора шаблонов для создания красивых пользовательских макетов. Вот несколько примеров для вдохновения.

Если вы хотите отобразить пользовательское меню, вы можете добавить блок навигации с помощью редактора шаблонов , как показано в видео ниже:

Вы можете настроить нижний колонтитул, как показано в видео ниже:

Создать новый шаблон

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

1. В параметрах страницы на правой боковой панели щелкните имя шаблона, затем щелкните значок «Добавить шаблон».
2. Дайте вашему новому шаблону описательное имя и нажмите Создать .
3. В редакторе шаблонов , теперь вы можете редактировать структуру, в которой отображается ваша страница.
4. Когда вы закончите, нажмите Обновить в правом верхнем углу, чтобы сохранить новый шаблон.
5. Нажмите Назад , чтобы вернуться в редактор страницы/записи, где ваш только что созданный шаблон находится в списке доступных шаблонов.

Применение шаблона

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

1. Добавьте или отредактируйте страницу/публикацию, к которой вы хотите применить шаблон.
2. В боковой панели Настройки найдите раздел Шаблон . Если вы не видите боковую панель «Настройки», щелкните значок настроек рядом с «Опубликовать» или «Обновить», чтобы открыть боковую панель «Настройки».
3. Выберите шаблон, который хотите применить.

Вы можете просмотреть, как будет выглядеть страница или запись с примененным шаблоном. Щелкните параметр Preview в верхней части редактора и выберите 9.0034 Предварительный просмотр в новой вкладке.

Если вы удовлетворены шаблоном и содержанием страницы/записи, нажмите Опубликовать . Или, если страница/сообщение уже были опубликованы, нажмите Обновить , чтобы применить изменения к опубликованной странице.

Шаблоны по умолчанию

📌

Некоторые шаблоны применяются автоматически и не могут быть применены к обычной странице.

Например, шаблон Archives автоматически применяется к страницам категорий и другим страницам архива. Шаблон домашней страницы автоматически применяется к настраиваемой домашней странице, а шаблон индекса применяется к вашей странице последних сообщений.

Как разработать собственную тему WordPress

Если вы хотите, чтобы что-то было сделано определенным образом — ну, возможно, вам придется сделать это самостоятельно. Конечно, несмотря на то, что доступно множество отличных тем WordPress, найти ту, которая соответствует вашим конкретным требованиям, может оказаться непростой задачей для некоторых. Чтобы решить эту проблему, у вас может возникнуть соблазн создать собственную тему WordPress.

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

Введение в разработку темы WordPress

Вы хотите, чтобы ваш сайт выглядел великолепно и обладал всеми необходимыми функциями, поэтому загляните в каталог тем WordPress:

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

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

Мы проведем вас через процесс создания вашей первой темы. Для начала вам понадобятся две вещи:

• Ваш собственный веб-сайт WordPress
• Качественный хостинг

Вам также будет полезен опыт работы с локальными промежуточными средами, поскольку вы будете использовать их для создания своей темы. Некоторое понимание CSS и PHP также будет полезно (если не обязательно).

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

Что такое стартовая тема (и почему вы должны ее использовать)

Стартовая тема — это базовая тема WordPress, которую вы можете использовать в качестве основы для создания своей собственной. Это позволяет вам создавать прочную основу, не беспокоясь о сложностях, связанных с кодированием темы с нуля. Это также поможет вам понять, как работает WordPress, показав вам базовую структуру темы и то, как все ее части работают вместе.

Существует множество отличных тем для начинающих, включая Underscores, UnderStrap и Bones (и это лишь некоторые из них).

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

Как разработать свою первую тему WordPress (за 5 шагов)

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

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

Шаг 1. Настройка локальной среды

Первое, что вам нужно сделать, это создать локальную среду разработки. По сути, это сервер, который вы устанавливаете на свой компьютер, который вы можете использовать для разработки и управления локальными сайтами WordPress. Локальный сайт — это безопасный способ разработки темы, который никак не повлияет на ваш действующий сайт.

Есть много способов создать локальную среду, но мы будем использовать Local. Это быстрый и простой способ бесплатно установить локальную версию WordPress, совместимый как с Mac, так и с Windows:

Чтобы получить запущен, выберите бесплатную версию Local, выберите свою платформу, добавьте свои данные и загрузите установщик. Когда установка будет завершена, вы можете открыть программу на своем компьютере.

Здесь вам будет предложено настроить новую локальную среду:

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

Шаг 2. Загрузите и установите начальную тему

Как и большинство начальных тем, с Underscores очень легко начать работу. Фактически, все, что вам нужно сделать, это зайти на веб-сайт и назвать свою тему:

Если хотите, вы можете нажать Дополнительные параметры , чтобы настроить базовую тему дальше:

Здесь вы можете указать дополнительную информацию, например имя автора, и дать описание темы:

Также есть _sassify! , который добавит файлы Syntactically Awesome StyleSheets (SASS) в вашу тему. SASS — это язык предварительной обработки для CSS, который позволяет использовать переменные, вложение, математические операторы и многое другое.

Когда вы сделали свой выбор, вы можете нажать Создать , который загрузит файл .zip , содержащий вашу стартовую тему. Это основной файл, вокруг которого вы будете разрабатывать свою собственную тему, поэтому вам необходимо установить его на свой локальный сайт.

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

Шаг 3: Узнайте о различных компонентах темы WordPress

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

Во-первых, давайте обсудим файлы шаблонов, которые являются основными строительными блоками темы WordPress. Эти файлы определяют макет и внешний вид контента на вашем сайте.

Например, header.php используется для создания заголовка, а comments.php позволяет отображать комментарии.

WordPress определяет, какие файлы шаблонов использовать на каждой странице, просматривая иерархию шаблонов. Это порядок, в котором WordPress будет искать соответствующие файлы шаблонов каждый раз, когда загружается страница на вашем сайте.

Например, если вы посетите URL-адрес http://example. com/post/this-post , WordPress будет искать следующие файлы шаблонов в следующем порядке:

1. Файлы, соответствующие слагу, например this-post
2. Файлы, соответствующие идентификатору сообщения
3. Общий файл одиночного сообщения, например single.php
4. Архивный файл, например archive.php
5. Файл index.php

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

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

Цикл — это сложная тема, о которой мы рекомендуем вам узнать больше, если вы хотите понять, как WordPress отображает содержимое сообщений. К счастью, Loop уже интегрирован в вашу тему благодаря Underscores, так что пока не стоит об этом беспокоиться.

Получите содержимое, доставленное прямо в ваш почтовый ящик

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

Шаг 4. Настройка темы

Легко думать, что темы предназначены исключительно для косметических целей, но на самом деле они оказывают огромное влияние на функциональность вашего сайта. Давайте посмотрим, как вы можете сделать несколько основных настроек.

Добавление функциональности с помощью «хуков»

Хуки — это фрагменты кода, вставленные в файлы шаблонов, которые позволяют вам запускать действия PHP в разных областях сайта, вставлять стили и отображать другую информацию. Большинство хуков реализованы непосредственно в основном программном обеспечении WordPress, но некоторые также полезны для разработчиков тем.

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

• wp_head() — Добавлено в элемент в header.php . Он включает стили, сценарии и другую информацию, которая запускается сразу после загрузки сайта.
• wp_footer() — Добавлено в footer.php прямо перед тегом . Это часто используется для вставки кода Google Analytics.
• wp_meta() — обычно появляется в sidebar.php для включения дополнительных скриптов (таких как облако тегов).
• comment_form() — Добавлено в comments.php непосредственно перед закрывающим тегом

 a {
цвет: королевский синий;
} 

 a {
красный цвет;
} 

 a:visited {
цвет: фиолетовый;
}