Как создать блочную тему для WordPress (простой способ)

Опубликовано: 2023-02-09

Создать блочную тему WordPress для вашего веб-сайта не так сложно, как вы думаете. Популярность блочных тем WordPress росла с момента их появления в WordPress 5.9 с растущим числом готовых блочных тем, доступных в репозитории WordPress. А для тех, кто хочет создать блочную тему WordPress самостоятельно, вам повезло. Плагин Create Block Theme упрощает процесс, поэтому вы можете быстро создать пользовательскую тему блока без сложного кодирования. Кроме того, вы даже можете использовать его для создания дочерней темы для своего сайта.

В этом посте мы расскажем о преимуществах использования плагина Create Block Theme и о том, как создать собственную тему блока за несколько кликов.

Что такое блочная тема WordPress?

Блочная тема WordPress

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

Кроме того, в блочную тему проще добавлять пользовательские стили. Нет необходимости редактировать functions.php, style.css или другие файлы темы для создания пользовательских блоков, шрифтов или добавления стиля темы. Все можно сделать, отредактировав один файл — theme.json. WordPress считает блочные темы будущим WordPress. К счастью, есть немало преимуществ в их использовании.

Знакомство с плагином Create Block Theme

В этом посте мы выделим плагин Create Block Theme, который является бесплатным плагином, доступным в репозитории плагинов WordPress. Это позволяет быстро создать новую тему, пустую тему или дочернюю тему. Вы также можете встраивать шрифты Google — либо через CDN, либо локально.

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

Ключевая особенность

Плагин Create Block Theme имеет несколько замечательных функций, делающих создание темы простым и быстрым:

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

Как создать блочную тему WordPress?

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

Установите тему родительского блока

Для начала войдите в свою панель управления WordPress. Затем перейдите в «Внешний вид» > «Темы» .

Панель управления WordPress

Вы можете выбрать любую тему по своему желанию — если это блочная тема WordPress. Если вы хотите использовать тему блока, отличную от Twenty Twenty-Three, начните с нажатия кнопки « Добавить новую » в разделе «Внешний вид» > «Темы».

Добавить новую тему

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

выберите вкладку темы блока WordPress

Найдя нужную тему, наведите на нее курсор и нажмите кнопку « Установить ».

Установить тему блока

Установите плагин «Создать тему блока».

Следующим шагом будет установка плагина Create Block Theme. Есть несколько способов установить плагин WordPress, но этот можно легко установить с панели инструментов. Начните с перехода в « Плагины» > «Добавить новый » на панели инструментов WordPress.

Добавить новый плагин

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

Установите плагин Create Block Theme

После установки просто активируйте плагин.

активировать плагин

Настройте плагин Create Block Theme

Теперь, когда плагин установлен, перейдите в раздел « Внешний вид» > «Создать тему блока» .

настроить плагин Create Block Theme

В настройках плагина у вас будет несколько вариантов:

создать настройки темы блока

  1. Экспорт (название темы)
  2. Создать дочерний элемент (название темы)
  3. Клон (название темы)
  4. Перезаписать (название темы)
  5. Создать пустую тему
  6. Создайте вариант стиля

Экспорт темы

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

Чтобы экспортировать текущую установленную тему, выберите параметр экспорта, затем нажмите кнопку «Создать». Файл будет загружен в папку загрузок в виде zip-файла, как и любая другая тема WordPress.

Создать дочернюю тему

создать дочернюю тему

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

Клон Тема

тема блока клонов

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

Перезаписать тему

перезаписать тему

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

Создать пустую тему

создать пустую тему

При выборе этого параметра в каталоге тем вашего веб-сайта будет создана пустая тема. Перед созданием новой темы дайте ей имя, описание и URL-адрес темы (при желании), укажите автора и URL-адрес автора. Нажав кнопку «Создать», вы можете перейти к «Внешний вид»> «Темы», чтобы просмотреть новую пустую тему.

новая пустая тема

Создайте вариацию стиля

Варианты стиля находятся в Appearance > Editor . Чтобы найти их, перейдите в редактор тем, затем нажмите кнопку стилей в правом верхнем углу редактора. Там вы можете создавать новые стили для текста, цветов и кнопок. Существуют также дополнительные параметры для стилизации отдельных блоков.

стили темы

После того, как вы создали стили, вы можете создать вариант стиля в плагине Create a Block Theme, выбрав последний параметр в настройках. Дайте вашему стилю имя, затем нажмите « Создать ».

новая вариация стиля

Чтобы просмотреть новый стиль, вернитесь к разделу «Внешний вид» > «Редактор», щелкните значок стиля и выберите « Обзор стилей » . Там вы можете просматривать стили, чтобы найти новый, который вы только что создали.

нестандартный стиль

Управление шрифтами темы

Чтобы управлять шрифтами, установленными в вашей теме, перейдите в « Внешний вид» > «Управление шрифтами темы» . Там вы сможете просмотреть все установленные шрифты в вашей теме.

управлять шрифтами темы

Одной из самых удивительных и удивительных функций плагина Create Block Theme является возможность управлять шрифтами вашей темы. В этом разделе плагина вы можете удалить целые семейства шрифтов или одну вариацию. Кроме того, вы можете легко добавлять шрифты Google в свою тему, размещая их локально или вызывая их через CDN Google Fonts. Вот некоторые из лучших шрифтов Google для Интернета.

Чтобы удалить семейство шрифтов или вариант шрифта, просто нажмите ссылку «Удалить» рядом с семейством или вариантом, который вы хотите удалить со своего сайта.

удалить шрифт

Добавить шрифт Google

Чтобы добавить шрифт Google, нажмите кнопку « Добавить шрифт Google » в верхней части страницы.

добавить кнопку шрифта Google

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

выберите шрифт

После выбора шрифта у вас будет возможность выбрать варианты, которые вы хотите включить. Вы можете выбрать все, установив флажок вверху, или выбрать отдельные. После выбора вариантов нажмите кнопку « Добавить шрифты Google в вашу тему» .

Добавить шрифт Google

Вы также можете добавить в свою тему локальные шрифты. Начните с нажатия кнопки «Добавить локальный шрифт». Поддерживаются шрифты в форматах файлов ttf, off и woff2.

добавить кнопку локального шрифта

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

После установки шрифтов ими можно управлять в плагине Create Block Theme и применять к стилям в редакторе сайта.

шрифты в редакторе стилей

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

Создание блочной темы WordPress не должно быть сложным

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

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

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