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

Содержание

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

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

Страницы — это один из типов постов 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. Преподаватель в школе Нетология.

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

Создание шаблона страницы для WordPress

58

IT блог — Создание шаблона страницы для WordPress

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

Большинство тем для WP содержат файл страницы (page.php), который содержит шаблон страницы по умолчанию, используемый на каждой странице, если не указан конкретный тип. Если вам нужна страница с другим макетом или форматом, чем шаблон страницы по умолчанию, необходимо создать собственный тип шаблона. При разработке шаблонов для WP необходимы базовые знания HTML, CSS и PHP. Однако, вы можете воспользоваться готовыми темами WordPress — www.inbenefit.com, если не обладаете нужными навыками.

Создание шаблона страницы

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

  1. Откройте текстовый редактор.

  2. Введите следующую строку кода в поле ввода:

    <?php /* Template Name: CustomPage01 */ ?>
    
  3. Это единственная строка, необходимая для файла шаблона. Она информирует WordPress о том, что файл предназначен для шаблона и будет рассматриваться как «CustomPage01». В действительности вы можете придумать любое название. Нам понадобится этот идентификатор позже.

  4. Сохраните файл на рабочем столе как custompage01.php. Название файла может быть любым, но лучше, чтобы оно соответствовало идентификатору шаблона, для более легкого поиска в будущем.

  5. Откройте любое приложение для работы FTP. Это может быть FileZilla или любая другая программа. Вам нужно напрямую подключиться к веб-хостингу и получить доступ к корневой папке WordPress.

  6. Перейдите в каталог /wp-content/themes/. Найдите папку темы, которую вы используете и загрузите в нее созданный файл PHP.

  7. Как только загрузка будет завершена, войдите в панель администратора WordPress и создайте новую, или отредактируйте существующую страницу:

  8. Новый шаблон страницы будет доступен в выпадающем списке Template (Шаблон). Используйте этот список, чтобы найти и выбрать созданный шаблон:

  9. Нажмите кнопку Publish (Опубликовать) или Update (Обновить), что сохранить изменения на странице.

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

Подготовка шаблона

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

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

  1. Откройте через FTP папку с темой, которую используете (мы сохранили ранее в нее файл custompage01.php).

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

  3. Когда вы откроете файл page.php, вы увидите заголовок шаблона. В начале файла вы увидите список комментариев, которые нам не нужны. Скопируйте содержимое файла без комментариев и вставьте в файл custompage01.php, как показано на рисунке ниже:

  4. После того как вы скопировали код, сохраните файл custompage01.php и загрузите его в каталог хостинга для своей темы. Вы можете выполнить те же действия, что и выше.

  5. Из-за того, что мы скопировали весь код из page.php, ваш настраиваемый шаблон страницы будет выглядеть точно так же, как и остальная часть сайта. Здесь вы можете отредактировать файл custompage01.php с помощью HTML, CSS или PHP, чтобы он был уникальным.

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

Это работает для постов в WordPress?

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

Это повлияет на что-либо еще на сайте WordPress?

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

Есть ли альтернатива для создания макетов без кодирования?

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

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

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

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

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

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

Содержание

Шаблоны

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

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

  • Шаблон по умолчанию: стандартный шаблон.
  • Шаблон в полную ширину: этот шаблон показывает содержимое страницы в полную ширину экрана без боковых панелей.
  • Шаблон сетки: этот шаблон отображает содержимое в разметке в виде сетки (см. этот пример из темы 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

Публикуем перевод статьи 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, таблицы стилей, h2 и div class=description.

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

Ссылка: wp_list_pages

9. Sidebar.php

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

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

Ссылка: wp_list_categories и wp_get_archives

10. Footer.php

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

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

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

11. Index.php

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

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

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

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

Перейдите к директории темы default, откройте index.php. Скопируйте цикл из стандартного index.php в свой — между div id=content../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.

Как создавать шаблоны с многоразовыми блоками в WordPress?

WordPress представил редактор блоков Gutenberg версии 5.0. Вы можете вставлять из набора доступных блоков и создавать контент в редакторе сообщений. Кроме того, Gutenberg также позволяет создавать блоки многократного использования, которые можно вставлять в любое место на своем сайте по всему миру. Однако многие пользователи не знают, что вы можете легко создавать шаблоны, используя повторно используемые блоки, и обновлять контент в каждой публикации. В этой статье мы объясним, как создавать шаблоны с многоразовыми блоками в WordPress.

Создание многоразовых блоков

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

  • Убедитесь, что у вас включен редактор Гутенберга для создания сообщений. Это настройки по умолчанию, если вы не установили плагин Classic Editor.
  • Перейдите в меню «Сообщения> Добавить», чтобы открыть редактор блоков Гутенберга.
  • Вам не нужно давать никакого названия. Просто щелкните значок + и добавьте блок «Заголовок».
  • Добавьте текст-заполнитель внутри заголовка, например «Это первый заголовок».
  • Нажмите на кнопку с тремя точками и выберите «Добавить в блоки многократного использования».
Добавить в повторно используемые блоки
  • Укажите имя для вашего блока, например «Повторно используемый шаблон 1», и сохраните его.
Сохранить многоразовый шаблон

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

Связанный: Просмотрите более 300 бесплатных руководств по WordPress, чтобы вывести свой сайт на новый уровень.

Преобразование многоразового блока в шаблон

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

  • Щелкните значок ⊕ в правом верхнем углу редактора.
  • Прокрутите вниз до раздела «Многоразовые» и нажмите ссылку «Управление всеми повторно используемыми блоками».
Управление многоразовыми блоками в WordPress
  • WordPress предложит вам подтвердить выход из редактора сообщений, поскольку вы не сохранили содержимое публикации. Нажмите кнопку «Выйти», чтобы подтвердить выход.
Подтвердите выход из редактора
  • Это перенесет вас в раздел скрытых многоразовых блоков, где вы сможете просмотреть все ранее созданные повторно используемые блоки на своем сайте.
  • WordPress сохраняет повторно используемые блоки как пользовательский тип записи «wp_block». По сути, это означает, что ваш многоразовый блок — это сообщение, которое может содержать различные элементы блока, такие как обычное сообщение или страница на вашем сайте.
Редактировать многоразовый блок для создания шаблона
  • Наведите указатель мыши на повторно используемый блок, который вы создали «Повторно используемый шаблон 1», и нажмите ссылку «Редактировать».
  • Это вернет вас обратно в редактор Gutenberg, где вы сможете добавлять элементы в свой шаблон.

Добавление элементов в шаблон

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

Добавить блоки для создания шаблона

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

Вставка шаблона и редактирование содержимого

Всякий раз, когда вы хотите вставить свой «Многоразовый шаблон 1» в свое сообщение или страницу, щелкните значок + и вставьте блок из раздела «Многоразовый». Чтобы отредактировать шаблон, нажмите кнопку с тремя точками и выберите опцию «Преобразовать в обычный блок».

Преобразование шаблона в обычный блок

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

Редактирование содержимого шаблона как отдельного элемента

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

Предложение SEO: Оптимизируйте свой сайт с помощью специальной 14-дневной бесплатной пробной версии SEMrush Pro.

Альтернативный вариант с использованием группы

Если описанный выше метод для вас длительный, есть альтернативный вариант.

  • Создайте новый фиктивный пост и добавьте блоки для создания вашего шаблона.
  • Выделите все блоки, которые хотите включить в шаблон, перетащив мышь или используя клавишу Shift, и выберите «Группировать».
Создать групповой многоразовый блок
  • Теперь нажмите кнопку с тремя точками и выберите «Добавить к многоразовым блокам».
Добавить многократно используемый групповой блок
  • Укажите имя, например «Повторно используемый шаблон 2», и нажмите кнопку «Сохранить», чтобы сохранить повторно используемый блок.
Сохранить многоразовый шаблон с групповым блоком

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

Заключительные слова

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

Похожие записи

Прокрутить вверх

Page not found — JRMora, humor gráfico

Перейти к содержимому

Eso que buscas no aparece, puedes buscar con otras palabras o probar en la lista de páginas más importantes y los ultimos 30 artículos publicados

Поиск:

Páginas

    Últimos artículos

    • WordPress

      • WordPress 6.1 содержит «значительное улучшение производительности базы данных»
      • Создавайте пользовательские типы постов и пользовательские поля без плагина и выставляйте их на показ с помощью GenerateBlocks
      • Бесплатная коллекция из 68 нарисованных вручную SVG иконок
      • Ultimate Membership Pro, плагин для управления членством
      • Lazy Load y Viewport в LiteSpeed
      • Отображение различного содержания в зависимости от языка в WordPress
      • Сниппеты кода PRO
      • Четыре месяца без AMP
      • WordPress исполняется 19 лет
      • 13 причин использовать GenerateBlocks
      • 10 Полезных кодов для GeneratePress
      • Устранение проблем с CLS и Adsense
      • Лаборатория производительности, обнаружение потенциальных улучшений производительности WordPress
      • Creator Blocks, коллекция бесплатных блоков для GenerateBlocks
      • Настройка QUIC. cloud CDN на LiteSpeed
      • Отключение AMP-страниц в WordPress
      • Причины прекратить использование Elementor
      • GenerateBlocks, есть жизнь за пределами Elementor
      • Альтернативы Google Analitycs
      • Удаление неиспользуемого CSS в WordPress
      • Копирование содержания оригинальной публикации с помощью плагина Polylang
      • Как отключить различные размеры изображений, автоматически создаваемых WordPress
      • Как добавить предполагаемое время чтения к постам и страницам WordPress
      • Advanced Database Cleaner Pro, глубокая очистка Вашей базы данных
      • Хостинг и локальная загрузить Google Fonts в WordPress с помощью Perfmatters
      • Как отобразить дату последнего обновления с помощью Elementor
      • Polylang и DeepL, сбалансированное решение для многоязычного блоггинга
      • Rank Math PRO, seo плагин для WordPress, первые впечатления (2021)
      • Ошибка 500 при обновлении до PHP 8
      • Follow.it, альтернатива Feedburner
    • Биографии

      • Мэтью Притчетт, Мэтт
      • Хоакин Сальвадор Лавадо Техон (Quino)
      • Запись в Art Young
      • Памяти Джона Каллахана, 1951-2010 гг.
    • Вещи

      • Улучшение воздушного потока, вентилятор Noctua NF-A12x25 PWM
      • Pro’sKit UMS-C002, электрическая воздуходувка
      • Как снизить температуру компьютера
      • Восстановление Wacom Intuos Pro M
      • LG 29WP500-B, 29-дюймовый ультраширокий монитор
      • Камера прямой трансляции с водопоя в пустыне Намибии
      • Drevo Blademaster TE, возвращаемся к механической клавиатуре
      • Замените термопасту на видеокарте NVIDIA GeForce GTX-660 Ti
    • Графический юмор

      • Неделя фашизма
      • Налог на богатых
      • Адвокат Кристины Киршнер объявил, что будет судиться с Nik из-за карикатуры
      • Канадская газета отзывает карикатуры после жалоб мусульманской общины
      • Арт Шпигельман получит медаль «За выдающийся вклад в американскую литературу
      • Огненные языки
      • Болсонаро теряет свой веб-домен и заполняет его карикатурами
      • Заметка от редактора «Монреальской газеты» по поводу спорной карикатуры Бориса
      • Телефонный розыгрыш Алмейды, который раскрыл то, что мы уже знали
      • Фестиваль ViÑetas de Poitiers воздаст должное Ким
      • ночь, когда я плагиатил сам себя
      • Гатурро, самый избитый персонаж полосы Пасео де ла Комик
      • Банковский налог
      • Европейский суд по правам человека осуждает Испанию за нарушение прав судей Каталонии, выступающих за процесс
      • Испанцы бегут от новостей
      • Пограничная политика
      • Инволюция
      • Искусственный интеллект и комиксы
      • Трамп-заговорщик
      • Тень учреждений
      • В Млечном Пути могут обитать 4 враждебные цивилизации, желающие нас уничтожить
      • Рабочая сила
      • Мы, народ
      • Франкен VS Дюпюи за право Гастона Лагаффе на «смерть»
      • Интоксикация
      • Убийственное состояние
      • Торпедо 1936 Интеграл 5-е издание
      • Извинения компании Iberdrola
      • Указ о прозрачности королевского хозяйства
      • Все еще… Расизм в Америке
    • Документальные фильмы

      • Маттотти (2006)
      • Segrelles. Универсальный иллюстратор (2020)
      • Санджулиан: Сила просветления (2021)
      • Русские вещи
      • Сталин думал о тебе (2009)
      • Мелвин против Э.Т. История Хоакина Бласкеса (2006)
    • История

      • Альбом Персингера, десятилетие рисунков и воспоминаний эпохи Великой депрессии
      • Sidewalk Bubblegum, 9 лет виньеток Клэя Батлера
      • Испано-американская война 1898 года в виньетках
      • Британская полиция возобновила дело об убийстве палестинского карикатуриста Наджи аль-Али
      • 8 миллионов долларов, рисуя карикатуры, в 1933 году
    • Комикс

      • Искусственный интеллект и комиксы
      • Мелвин против Э.Т. История Хоакина Бласкеса (2006)
    • Новости

      • что такое редакционная карикатура?
      • Кения запрещает шесть мультсериалов за «пропаганду гомосексуализма»
      • Карикатуристу Джейму Гордону грозит до 25 лет тюрьмы за лжесвидетельство и мошенничество
      • Карикатурист пытается убить коллегу-карикатуриста, ударив его ножом в голову
    Шаблоны

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

    com

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

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

    Содержание

    Шаблоны

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

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

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

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

    ↑ Содержание ↑

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

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

    • Если ваш сайт настроен на отображение последних сообщений на главной странице,  9Шаблон 0040 Home или Index применяет стиль для этой страницы.
    • Если ваш сайт настроен на отображение обычной страницы на первой странице, шаблон Главная страница или Страница применяет стиль для домашней страницы.
    • Многие темы блоков предлагают общие встроенные шаблоны, такие как Single Post для настройки внешнего вида отдельных сообщений блога или шаблон 404 для настройки страниц ошибок 404.
    • Архив  шаблон всегда используется для категорий/архивов, но не для страницы сообщений.

    💡

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

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

    ↑ Содержание ↑

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    По завершении редактирования нажмите Сохраните в правом верхнем углу.

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

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

    ↑ Содержание ↑

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

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

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

    ↑ Содержание ↑

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

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

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

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

    ↑ Содержание ↑

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

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

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

    ↑ Содержание ↑

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

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

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

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

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

    📌

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

    Разнообразные планы и цены

    Как создавать шаблоны страниц WordPress с помощью полного редактирования сайта — Go WordPress

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

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

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

    Введение в полное редактирование сайта WordPress

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

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

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

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

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

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

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

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

    В следующих разделах вы узнаете, как:

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

    Шаг 1. Добавьте новый шаблон страницы в редактор сообщений

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

    Чтобы загрузить тему блока, откройте панель управления WordPress. Перейдите на Внешний вид → Темы . Здесь вы увидите список всех тем, которые вы установили на свой сайт.

    Затем нажмите Добавить новый . В верхней части этой страницы выберите Feature Filter 9.0012 .

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

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

    Чтобы создать новый шаблон, нажмите New под раскрывающимся меню. Затем во всплывающем окне назовите шаблон.

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

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

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

    Если вас устраивают эти изменения, выберите Сохранить . Теперь вы создали свой первый шаблон страницы!

    Шаг 2. Настройка шаблонов страниц в редакторе сайта

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

    Перейти к Внешний вид → Редактор (бета) . Это автоматически откроет шаблон домашней страницы.

    Затем нажмите на логотип WordPress в верхнем левом углу. Затем найдите Templates .

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

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

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

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

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

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

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

    Шаг 3. Создание частей шаблона

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

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

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

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

    Теперь вы можете добавить столько блоков и узоров, сколько захотите. Это будет зависеть от того, как вы планируете использовать часть шаблона. Например, если вы хотите повторно использовать часть «Избранные сообщения», вы можете вставить Похожие посты шаблон.

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

    Для этого откройте шаблон и вставьте блок Template Part.

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

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

    Если вы довольны тем, как выглядит ваш шаблон, выберите Сохранить .

    Использование шаблонов страниц WordPress для пользовательского веб-дизайна

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

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

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


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

    Взгляните на наш выбор темы

    Нравится:

    Нравится Загрузка…

    Как создать новый шаблон страницы в WordPress с помощью 3 простых методов — Go WordPress

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

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

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

    Введение в шаблоны страниц (и почему вы можете захотеть их использовать)

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

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

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

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

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

    Обычно блочные темы WordPress поставляются с некоторыми шаблонами страниц. Вот несколько типичных примеров:

    • Шаблон по умолчанию
    • Полноразмерный шаблон
    • Шаблон сетки

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

    3 способа создания нового шаблона страницы в WordPress

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

    1. Добавьте шаблон страницы в редактор сообщений

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

    Чтобы начать, перейдите на панель инструментов WordPress и нажмите Posts > Add New . Для этого урока мы создадим шаблон на новой странице. Однако вы также сможете редактировать шаблон после создания страницы.

    Затем перейдите к настройкам Post в правой части страницы и найдите раздел Template :

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

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

    Затем нажмите Создать . Откроется Редактор шаблонов, где вы можете добавить блоки для создания собственной страницы:

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

    Если вас устраивают эти изменения, нажмите Сохранить . Вот и все — вы создали свой первый шаблон страницы в WordPress!

    2. Настройка шаблонов в Редакторе сайта

    Если вы используете на своем сайте блочную тему, вы также можете добавлять и редактировать шаблоны страниц в Редакторе сайта. Чтобы загрузить тему, поддерживающую эту функцию, перейдите на страницу 9.0003 Внешний вид > Темы . Затем сузьте область поиска с помощью фильтра Полное редактирование сайта :

    После активации одной из этих тем вы получите доступ к Редактору сайта. Просто перейдите к Внешний вид > Редактор (бета) .

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

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

    Нажмите на шаблон, который вы хотите отредактировать. Откроется Редактор шаблонов:

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

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

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

    3. Создание новых частей шаблона

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

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

    Чтобы начать создавать части шаблона, перейдите в Редактор сайта. Затем нажмите Части шаблона :

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

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

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

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

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

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

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

    Теперь попробуйте создать свои собственные шаблоны страниц

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

    Чтобы просмотреть, вот три метода, которые вы можете использовать для разработки шаблонов страниц в WordPress:

    1. Добавьте шаблон страницы в редактор сообщений.
    2. Настройка шаблонов в Редакторе сайта.
    3. Создать новые детали шаблона.

    Лучше всего то, что создавать шаблоны страниц относительно легко. Идите вперед и создайте что-то свое!

    Вам также могут понравиться: 4 Примеры страниц обо мне, которые вас вдохновят

    Нравится:

    Нравится Загрузка…

    Как создавать шаблоны пользовательских страниц WordPress (и зачем) • WPShout

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

    Когда вы говорите «Шаблон пользовательской страницы темы WordPress», что вы имеете в виду?

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

    Итак, что я имею в виду под «настраиваемым шаблоном страницы»? Я имею в виду то, что показано справа. Например, вы редактируете тип контента «Страница» в WordPress (хотя, как мы увидим позже, теперь он может включать и другие типы контента WordPress). И при редактировании своей страницы вы замечаете поле «Атрибуты страницы», и в нем вы или (в зависимости от того, есть ли в вашей теме эти шаблоны) см. раскрывающийся список «Шаблон». Это поле выбора показано справа (оно также находится в правой части экрана «редактирование страницы»). Если вы видите это раскрывающееся меню, это потому, что ваша тема предоставляет некоторые из этих «настраиваемых шаблонов страниц». На самом деле это файлы в папке вашей текущей активной темы (или ее родителя) и имеют одну отличительную особенность, о которой мы поговорим позже. Но это выпадающее меню именованных шаблонов страниц — это то, о чем мы сегодня говорим.

    Как это вписывается в иерархию шаблонов?

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

    Если в раскрывающемся списке, показанном выше, был выбран пользовательский шаблон страницы, будет использоваться этот файл «шаблона». Полная остановка, не исключение.

    Повторим, что если выбран настраиваемый шаблон страницы, будет использоваться этот файл «шаблона». Полная остановка, не исключение. Если нет, то иерархия шаблонов WordPress будет искать несколько иной способ, которым кто-то мог попытаться стилизовать конкретную страницу — с помощью page-123.php или page-custom-template-utilizer.php 9.файл 0041. (Разница между шаблоном Custom и шаблоном со структурой page-$id или page-$slug заключается только во взаимодействии и интерфейсе.) Если ни один из них не найден, WordPress вернется к странице . php , если он существует, а если нет, то мы придем к окончательному резервному варианту, index.php .

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

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

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

    Что вы сделаете, так это добавите в свою тему (и это действительно должна быть дочерняя тема, если нет очень сильного ограничения, делающего это невозможным для вас) файл с именем вроде my-template. php или на самом деле -cool-awesome.php . На самом деле это не имеет значения, пока вы на самом деле не используете имя, которое является частью иерархии шаблонов, вы в золоте. (Что означает: не использовать имя типа page-whatever.php . Как мы уже упоминали выше, иерархия шаблонов WordPress считает, что ей принадлежит файл с таким именем.)

    После того, как вы получили файл ( cool-page-template.php , как вам угодно), вы должны запустить его следующим образом:

     
    Это мой пользовательский шаблон.
     

    Вот и все. Как вы, наверное, догадались, имя, которое появится в раскрывающемся списке «Шаблон», — это то, что я мудро назвал «Имя, которое будет отображаться в раскрывающемся списке». Точно так же, как файл style.css вашей темы или основной файл плагина, WordPress использует информацию из этого комментария к коду , чтобы предоставить ему контекст для работы.

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

    , тегов

    и, возможно, (если вам интересно 🤪) некоторый PHP для выполнения пользовательского поведения, которое вы хотите показать.

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

    Я (не раз) сталкивался с тем, что мой новый шаблон страницы WordPress не отображается. Безусловно, наиболее распространенная причина заключается в том, что я опечатался (или неправильно запомнил), как должен выглядеть комментарий в заголовке файла. Он должен быть помечен точным правильным названием. Таким образом, Имя шаблона: Узкая страница идеально подходит, но WordPress никогда не найдет что-то, что вместо этого имеет заголовок Шаблон: Пользовательский .

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

    • Вы поместили файл в неправильное место (он должен быть в вашей текущей запущенной теме или в ее родительском элементе)
    • Вы предоставили своему шаблону файл который начинается с стр.-. Из-за особенности тем WordPress пользовательские шаблоны страниц, начинающиеся с page-, вместо этого рассматриваются как страницы иерархии шаблонов.
    • В вашей теме отсутствует один из двух требуемых файлов, поэтому она не работает. (Темы WordPress *должны* иметь файл index.php и style.css .)
    • С этим была проблема еще во времена WordPress 4.9 (несколько лет назад) Пользовательские типы записей WordPress, отличные от «Страницы»

      На протяжении большей части истории WordPress эти «настраиваемые шаблоны страниц» предназначались только для типа контента «Страница». (WordPress по умолчанию имеет только два типа контента: «Сообщения» и «Страницы».) Но в WordPress 4.7 была добавлена ​​функция, позволяющая использовать эти шаблоны страниц с новыми типами содержимого (часто называемыми «настраиваемыми типами сообщений»).

      Для этого вы добавляете еще одну строку в «заголовок файла». Это будет выглядеть примерно так:

       

      Как вы, вероятно, догадались, этот новый заголовок Template Post Type: предшествует имени «кодового уровня» для (настраиваемых) типов сообщений. Вы заметите, что в приведенном выше примере мы перечисляем тип контента page , с которым поставляется WordPress, а также пост один. Кроме того, мы поддерживаем третий «настраиваемый тип сообщений» под названием event .

      Прекрасная причина для использования пользовательских шаблонов страниц

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

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

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

      И, наконец, несколько практических советов о шаблонах страниц

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

      Как мы уже говорили, если вы продублируете файл page.php вашей темы, чтобы начать создавать собственный шаблон страницы, вам необходимо убедиться, что вы добавили «заголовок пользовательского шаблона страницы», который мы получили выше. Опять же, это «волшебная» страница, благодаря которой эти шаблоны просто работают. А теперь займитесь созданием крутых страниц!

      Изображение предоставлено: Infrogmation

      Как создать собственный шаблон страницы WordPress

      • Фейсбук
      • Твиттер
      • LinkedIn

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

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

      Мы будем работать с PHP и FTP, поэтому некоторые базовые знания о кодировании и загрузке файлов сайта будут полезны. (Настройка шаблона также потребует работы с CSS, PHP и некоторыми HTML.)

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

      Что может сделать для вас пользовательская страница

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

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

      Создание пользовательского шаблона страницы

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

      Если вы пользователь Windows, текстовый редактор Notepad уже установлен на вашем компьютере. Но с этой задачей справится любой текстовый редактор или редактор веб-сайтов (DreamWeaver, CoffeCup, Notepad++, Atom Text, TextPad и т. д.).

      Для этого урока я использую редактор Sublime. Ваш интерфейс редактора, скорее всего, будет выглядеть немного иначе.

      Шаг 1

      Откройте текстовый редактор. На пустой странице введите эту строку кода:

       &lt;?php /* Имя шаблона: MyPageTemplate */ ?&gt; 

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

      Сохраните файл как файл php. Чтобы все было организовано, дайте файлу то же имя, что и имя шаблона, которое вы использовали. Так что в моем случае я бы сохранил файл как MyPageTemplate.php .

      Оставьте только что созданную страницу открытой в редакторе. Мы собираемся вернуться к этому.

      Шаг 2

      Теперь мы собираемся загрузить файл на наш веб-сайт WordPress, поэтому вам понадобится программа FTP. Если вы еще не используете программу FTP, попробуйте FileZilla. Забавное название, отличная FTP-программа.

      Вы также можете использовать FTP-файлы из проводника Windows или файлового менеджера cPanel для своей учетной записи хостинга. Но в долгосрочной перспективе автономная программа FTP будет быстрее и эффективнее.

      Итак, откройте свою FTP-программу. Мы собираемся подключиться к нашему «корневому» каталогу WordPress. (Вы также можете увидеть каталоги, называемые папками .)

      Моя установка WordPress называется «демо», поэтому мой корневой каталог WordPress выглядит следующим образом:

      Вы можете видеть файлы WordPress и три «wp- » каталоги.

      Щелкните каталог /wp-content.

      Затем перейдите в каталог /themes.

      В каталоге /themes вы увидите установленные на данный момент темы WordPress.

      Теперь щелкните корневой каталог используемой темы. В моем случае это будет /twentynineteen.

      Загрузите PHP-файл пользовательской темы в каталог тем.

      Теперь вы видите файл MyPageTemplate.php в корневом каталоге двадцать девятнадцать.

      Через минуту мы снова воспользуемся программой FTP, так что пока не закрывайте ее.

      Шаг 3

      Войдите в панель администратора WordPress.

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

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

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

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

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

      Шаг 4

      Вернитесь к своей FTP-программе.

      В корневом каталоге темы, куда мы загрузили файл нашей пользовательской темы, найдите файл с именем page.php.

      Загрузите его на свой компьютер.

      Теперь откройте его в текстовом редакторе или редакторе веб-сайта.

      Скопируйте содержимое page.php и вставьте его в свой собственный файл шаблона.

      Наш пользовательский шаблон теперь выглядит так:

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

      Мы вырезаем раздел, который начинается с /* и заканчивается */ — это выглядит так:

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

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

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

      Взять свой пользовательский шаблон WordPress отсюда

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

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

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

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

      Выбор пользовательского шаблона страницы зависит от вашего творчества.

      Этот метод также работает для сообщений WordPress?

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

      Могут ли ошибки в пользовательском шаблоне страницы повредить ваш сайт?

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

      Альтернативы пользовательскому макету без программирования

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

      Также можно создать собственный макет с помощью компоновщика страниц. Page Builder от SiteOrigin дает вам возможность создавать уникальный дизайн, используя виджеты в контенте.

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

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

      Как вы думаете, вы будете использовать настраиваемые страницы на своем сайте WordPress? Есть ли сайты, которые вы посещаете для изучения HTML или PHP? Дай мне знать в комментариях.

      • Фейсбук
      • Твиттер
      • LinkedIn

      Как создавать шаблоны в WordPress (и настраивать их)

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

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

      К счастью, 😎 с Полным редактированием сайта WordPress (FSE) и новым редактором сайта вы можете легко получить доступ к шаблонам вашей темы. Затем вы можете настраивать и создавать новые с помощью блоков. Еще лучше: вам не нужно трогать 🦸 строку кода, чтобы сделать это.

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

      📚 Содержание:
      • Введение в шаблоны в WordPress 🎬
      • Как создавать шаблоны в WordPress с помощью полного редактирования сайта 🚧
      • Как настроить существующие шаблоны страниц 🎨

      Знакомство с шаблонами в WordPress 🎬

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

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

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

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

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

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

      Имейте в виду 💡, что в настоящее время вам необходимо использовать блочную тему WordPress для доступа к полному редактированию сайта. На вашем сайте также должен быть установлен как минимум WordPress 5.9.

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

      Как создавать шаблоны в WordPress с полным редактированием сайта 🚧

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

      • Шаг 1. Откройте редактор сайта
      • Шаг 2. Создайте свой шаблон

      Шаг 1: доступ к редактору сайта

      После того, как вы установили и активировали тему блока, перейдите к Внешний вид > Редактор на панели управления WordPress.

      Помните — если вы не видите Редактор сайта на своей панели инструментов, это, вероятно, означает, что ваша текущая тема несовместима с Полным редактированием сайта.

      Это запустит новый редактор сайта, который по умолчанию отображает вашу домашнюю страницу:

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

      Теперь выберите логотип WordPress в верхнем левом углу и нажмите Templates :

      Затем нажмите кнопку Добавить новый в правом верхнем углу. В зависимости от вашей темы вы сможете выбрать из списка типов шаблонов, таких как Главная страница , Автор и Категория :

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

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

      .

      Затем вам будет предложено назвать свой шаблон:

      Просто нажмите Создать , чтобы завершить процесс. Теперь вы можете приступить к работе над своим шаблоном.

      Шаг 2. Создайте свой шаблон

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

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

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

      В нашем примере мы создаем шаблон для обзоров продуктов. Итак, мы добавляем заголовок и заголовок сообщения . Мы также добавили Post Excerpt , в котором будут обобщены лучшие продукты для каждого обзора, и Author Bio внизу поста.

      Имейте в виду 💡, что эти элементы не будут видны, пока вы пишете свои посты. Поскольку они формируют шаблон вашей страницы, вам нужно предварительно просмотреть сообщение в интерфейсе, чтобы увидеть части шаблона.

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

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

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

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

      Как настроить существующие шаблоны страниц 🎨

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

      • Шаг 1. Доступ к шаблону
      • Шаг 2. Отредактируйте и сохраните шаблон

      Шаг 1: доступ к шаблону

      Чтобы получить доступ к существующим шаблонам, перейдите к Внешний вид > Редактор и щелкните значок WordPress . Затем выберите Templates и нажмите на шаблон, который хотите отредактировать:

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

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

      Шаг 2: отредактируйте и сохраните шаблон

      Теперь вам нужно просто перемещать, добавлять и удалять блоки, чтобы настроить существующий шаблон. Опять же, вы сможете увидеть все текущие блоки в List View 9.0012 , что позволяет очень легко изменить их порядок:

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

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

      Наверх

      Создавайте шаблоны в WordPress уже сегодня 🏁

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

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

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *