Wordpress

WordPress дочерняя тема: Дочерние темы WordPress

20.05.2021

Содержание

Дочерние темы в WordPress

И сразу же постараюсь ответить на вопрос из заголовка — для чего нужны дочерние темы?

  • Если вам когда-нибудь приходилось редактировать темы сторонних разработчиков, то вы наверняка в курсе, что после обновления темы, все сделанные изменения в файлах исчезают. Конечно, вы можете просто отключить возможность обновления тем, но использование дочерних шаблонов — более правильный вариант.
  • Также родительскую тему можно использовать как общий шаблон для многих сайтов. Всё равно у каждого разработчика есть какой-то код, который он использует для всех своих сайтов, например некоторые хуки. Получается, что использование дочерних тем, позволяет сэкономить время.

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

В качестве примера давайте возьмём стандартную тему WordPress Twenty Twelve — для неё и создадим дочернюю тему.

  1. Первым шагом создаем директорию дочерней темы:

    Я назвал её twentytwelve-child, но это совсем не обязательно — можете называть как угодно, главное, чтобы название темы не содержало пробелов и русских букв.

  2. Следующим шагом — работа со style.css. У меня он начинается с этого:
    /*
     Theme Name:   Twenty Twelve Child
     Author:       Миша Рудрастых
     Author URI:   https://misha.agency
     Template:     twentytwelve
    */

    Самым важным в данном случае является параметр Template — он и определяет то, что эта тема дочерняя. Параметр содержит название директории родительской темы.

  3. На этом этапе дочерняя тема появится в админке вашего сайта.

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

  4. Создаём в папке с дочерней темой functions.php и добавляет туда хук, который будет подключать таблицу стилей родительской темы на сайт и сразу же за ней — таблицу стилей дочерней темы.
    function true_enqueue_styles() {
    	wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
    	wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/style.css', array('parent-style') );
    }
     
    add_action( 'wp_enqueue_scripts', 'true_enqueue_styles' );

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

  5. Также иногда бывает нужно пересохранить меню Внешний вид > Меню и настройки темы.

Как работают дочерние темы?

На самом деле всё очень и очень просто — файлы, которые вы создаёте в директории дочерней темы, будут заменять эквивалентные им файлы из родительской темы.

style.css и functions.php

Исключение составляют эти два файла.

  • Если вы задействовали у себя хук, о котором я писал чуть выше, то файл дочерняя таблица стилей будет загружаться в дополнение к таблице стилей родительской темы.
  • functions.php дочерней темы всегда подключается непосредственно перед functions.php родительской темы. Что делать, если нужно задействовать функцию после инициализации
    functions.php
    родительской? Используйте хук after_setup_theme с приоритетом больше 10.

Функции

Родительская темаДочерняя тема
get_template_directory_uri() — возвращает URL родительского шаблона.get_stylesheet_directory_uri() — возвращает URL текущего шаблона (т е, если функция используется в дочерней теме, то выведен будет URL дочерней темы).
get_template_directory() — возвращает абсолютный путь к директории родительской темы на сервере.get_stylesheet_directory() — возвращает абсолютный путь к директории текущей темы на сервере.

Локализация

Процесс перевода дочерних тем по сути ничем не отличается от локализации недочерних тем. Про локализацию читайте подробнее здесь.

Миша

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

Сам же я впервые познакомился с WordPress в 2009 году. Организатор WordCamp. Преподаватель в школах Epic Skills и LoftSchool.

Если вам нужна помощь с вашим сайтом или может даже разработка с нуля на WordPress / WooCommerce — пишите. Я и моя команда сделаем вам всё на лучшем уровне.

Как создать дочернюю тему Вордпресс

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

Проблема в том, что если вы измените файлы темы, то при следующем обновлении темы файлы с вашими изменениями будут заменены новыми файлами.

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

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

Содержание:

Что такое дочерняя тема

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

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

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

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

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

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

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

Обновления

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

  • Перестать обновлять тему, чтобы не потерять изменения при обновлениях,
  • Обновлять тему, но рано или поздно файлы с изменениями будут заменены новыми файлами

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

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

Порядок

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

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

Создание дочерней темы

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

Дочерняя тема Astra и GeneratePress.

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

  1. Создайте папку темы в .../wp-content/themes/
  2. Создайте файл style.css
    с информацией о дочерней теме.
  3. Создайте файл functions.php и добавьте в него код для использования стилей родительской темы.
  4. По желанию — добавьте картинку темы для отображения во Внешний вид — Темы.

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

1. Создайте папку дочерней темы в папке родительской темы

Через ftp или хостинг-панель создайте папку в .../wp-content/themes/ с названием дочерней темы. В этом примере дочерняя тема будет называться twentyseventeen-child, и будет работать на базе родительской темы Twenty Seventeen.

2. Создайте файл style.css в папке дочерней темы

Внутри папки .../wp-content/themes/twentyseventeen-child создайте файл, назовите его style.css и добавьте в него информацию о дочерней теме:

Строки Theme Name и Template являются обязательными, Theme name сообщает Вордпрессу название темы, и это название отображается во Внешний вид — Темы. Template говорит Вордпрессу, какая тема является родительской для этой темы.

Остальные строки понятны сами по себе, кроме Tags и Text Domain. В Tags содержатся теги, которые используются репозитарием Вордпресс для описания темы. Я скопировал теги темы Twenty Seventeen.

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

3. Добавьте файл functions.php в дочернюю тему

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

В этом примере Вордпресс использует файл стилей дочерней темы, поэтому некоторые стили родительской темы не загрузились. Чтобы загружать стили родительской темы, нужно добавить код в файл functions. php. Создайте его в  .../wp-content/themes/twentyseventeen-child, и добавьте этот код:

Теперь ваш сайт должен выглядеть точно так же, как с родительской темой. Вы можете добавлять свои изменения в файлы style.css (или Внешний вид — Настроить — Дополнительные стили) и functions.php.

4. Добавьте картинку

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

Как работает дочерняя тема

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

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

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

Как изменять другие файлы

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

Заключение

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

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

Надеюсь, статья была полезна. Оставляйте комментарии.

Дочерняя тема WordPress для чайника и не только

 

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

Что такое дочерняя тема WordPress

Официальная терминология WordPress не оставляет нам выбора и все подчиняемые элементы системы мы вынуждены называть «дочерние». Относится это к дочерним страницам, дочерним пунктам меню и к дочерним темам.

Дочерняя тема (Child Theme) — это особая функция WordPress, которая позволяет переопределять определённые стили и функции другой родительской темы (Parent Theme). Используя дочернюю тему, как рабочую, вы можете обновить родительскую тему WordPress без потери своих изменений.

Например, понравилась вам тема, но совсем не нравится её шрифт, фон и заголовки. Выход в трёх шагах:

  • Создаёте дочернюю тему;
  • В файле style.css дочерней темы меняете стили на свои;
  • Работаете на Child Theme не думая об очередном обновлении родительской темы.

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

Отвечаю. В том то и прелесть дочерней темы, что вы можете поместить в неё любой файл из родительской темы, а не только файл стилей и так же править их без потери своих изменений при очередном обновлении.

Например, не нравится вам, что в футере вашего сайта висит активная ссылка автора темы. Решение в двух шагах:

  • Копируете файл footer.php из родительской темы в дочернюю;
  • В дочерней теме правите файл footer. php и убираете эту ссылку.

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

Самый простой способ создать дочернюю тему WordPress

Здесь, я не буду показывать вам, как создать дочернюю тему «руками». Почему? Потому, что создание дочерней темы через @import url("../TEMPLATE/style.css"), покажет принцип создания, но не будет до конца правильным.

А вот правильное создание дочерней темы с использованием хука, подключающего файлы стилей параллельно, а не последовательно, это не по теме этого раздела.

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

Рекомендую для создания дочерней темы использовать плагин: WPS Child Theme Generator. Или более насыщенный по возможностям, но так же несложный, плагин: Child Theme Configurator.

Плагины очень хорошо обновляются и эта информация будет актуальная ещё очень долго. Автор первого плагина английский хостинг для WordPress. Автор второго, компания разработчик WordPress c 20-ти летней историей.

Найти плагины вы можете и должны только на официальном сайте ru.wordpress.org/ страница plugins/, по названию. Или сразу установить плагин из административной панели своего  сайта на вкладке Плагины>>>Добавить. Читать Как установить плагин WordPress.

Заключение

Дочерняя тема WordPress инструмент отличный инструмент системы, однако на начальном этапе освоения WordPress не нужный. Однако не знать его — не комильфо.

©wpkupi.ru

Еще статьи

Похожие посты:

Дочерняя тема WordPress: что это и как ее использовать? (Child Theme)

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

Вопросы

1.Что такое дочерняя тема WordPress и чем она отличается от родительской темы? Может ли она заменить родительскую тему?

2.Зачем нужна дочерняя тема WordPress?

3.Где взять дочернюю тему?

4.Как правильно установить дочернюю тему?

Также, мы рассмотрим практическое применение дочерних тем на конкретных примерах.

Дочерняя тема важная составляющая любого сайта на WordPress

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

  • Вступление
  • Что такое дочерняя тема? Чем она отличается от родительской?
  • Зачем нужна дочерняя тема? Что внутри дочерней темы?
  • Где взять дочернюю тему?
  • Генерируем дочернюю тему с помощью плагина Generate Child Theme.
  • Дочернюю тему необходимо установить и активировать сразу после установки родительской. Это рекомендация!
  • Практические примеры использования дочерней темы. Исправляем ошибки на сайте с помощью дочерней темы. Добавляем в папку дочерней темы другие необходимые для кастомизации/исправления файлы.
  • Выводы.

Дочерняя тема WordPress: что это и как ее использовать? (Child Theme)

Смотреть это видео на YouTube.
Подпишитесь на канал InwebPress, чтобы узнать больше о создании и настройке сайтов!

Для автоматического создания дочерней темы используйте плагин Generate Child Theme. Он создаст папку с дочерней темой и все необходимые основные файлы. Также, плагин автоматически активирует созданную дочернюю тему.

Настройки плагина Generate Child Theme

Выводы

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

Ссылки

Плагин Generate Child Theme

Что такое дочерняя тема на WordPress?

👍 Научим создавать сайты на WordPress бесплатно за 19 уроков. Подробнее →

Что такое и зачем нужна дочерняя тема?

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

Почему используют дочерние темы?

Дочерние темы рекомендуется использовать в том случае, если Вы постоянно добавляете новые функции в дизайн сайта. Так, например, если вносите изменения стилей оформления в CSS-файлы или PHP-код в файл functions.php. Часто такие правки просто необходимо делать, так как некоторые плагины для своей корректной работы просто обязывают что-то изменить в функционале. Например, плагин интернет-магазина WooCommerce имеет встроенные шаблоны для страниц, которые он создает при активации (Корзина, Заказы и др.) Чтобы в них изменить или добавить некоторые элементы (например, добавить выбор возраста покупателя), необходимо править эти шаблоны. Конечно, после обновления плагина все Ваши правки будут удалены. Чтобы такого не случилось, файлы с нужными шаблонами конкретных страниц копируются в Вашу тему, где могут быть изменены и останутся после обновления.

Преимущества дочерних тем

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

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

Мне нравится2Не нравится1

Если Вам понравилась статья — поделитесь с друзьями

Быстрое создание дочерней темы wordpress при помощи плагина

Приветствую вас дорогие друзья!

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

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

Навигация по статье:

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

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

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

Плагин для создания дочерних тем WordPress Child Theme Configuration

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

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

  1. 1.Как обычно, копируем его название, и в административной части сайта переходим в раздел «Плагины»«Добавить новый». Вставляем название в строку поиска, устанавливаем и активируем плагин.
  2. 2.После активации у нас в разделе инструменты появиться новый пункт, который называется «Child Themes». Кликаем по нему, и у нас открывается страница настроек.
  3. 3.Так как я уже создавала ранее дочернюю тему при помощи данного плагина, у меня здесь на первом шаге доступно несколько опций. Когда вы только установите данный плагин, у вас будет доступна только одна опция «Create New Child Theme».
  4. 4.Выбираем эту опцию и переходим к следующему, второму шагу. Здесь нам нужно выбрать родительскую тему из раскрывающегося списка и нажать на кнопку «Analyze». После нажатия на эту кнопку плагин отправляет специальные запросы, которые позволяют определить, возможно ли в принципе создание дочерней темы для данной родительской темы.
  5. 5.Если всё в порядке у нас высветится вот такое сообщение:
  6. 6.Наследующем шаге нам необходимо задать название для нашей дочерней темы. По умолчанию плагин берет название родительской темы и приписывает ему «Child». При желании вы можете задать ей любое другое название, главное, что бы оно было латинскими буквами.
  7. 7.Далее нам нужно выбрать, где мы будем сохранять новые стили, которые мы будем дописывать. Нам доступно два варианта:
    • Primary Stylesheet (style.css) — мы можем их сохранять в файле style.css нашей темы, как это происходит в большинстве случаев.
    • Separate Stylesheet — создается отдельный файл, в который вы будете вносить свои стили. Данный вариант позволяет вам не переписывать заново стили ранее созданных дочерних тем, а добавлять свои в новый файл.

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

  8. 8. Здесь нам необходимо выбрать способ загрузки стилей из родительской темы. Use the WordPress style queue — используется очередь WordPress, когда плагин сам подгружает стили родительской темы.
    • Use @import in the child theme stylesheet — если для вашей темы такой вариант не подходит, и загрузка не происходит, то в этом случае мы можем использовать второй вариант. Разработчики плагина рекомендуют использовать этот способ только тогда, когда первый вариант не подходит.
    • Do not add any parent stylesheet handling – родительские стили вообще не подгружаются.
  9. 9.На этом же шаге можно настроить возможность игнорировать отдельные css-файлы.

    «Ignore parent theme stylesheet» — позволяет полностью игнорируем все стили и привила, которые написаны в файле style.css родительской темы.

    Каждая тема, помимо основных стилей, имеет еще, как правило, несколько css-файлов, которые отвечают за стилизацию каких-то отдельных элементов. Если эти элементы у нас не используются и то их можно отключить.

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

    bootstrap.css – отвечает за адаптивную сетку, на основе которой свёрстаны страницы темы.

    custom.css — содержит в себе дополнительные настройки отдельных элементов.

    flex-slider.css – отвечает за стилизацию слайдшоу FlexSlider, и если мы не хотим использовать у себя на сайте слайдшоу, или будем использовать для него какой-то отдельный плагин, то нам этот css-файл не нужен, и мы можем поставить возле него галочку, что бы он не подключался.

    font-awesome-css — отвечает за работу с иконочными шрифтами FontAwesome. Если мы не планируем использовать иконочные шрифты, то можно поставить здесь галочку.

    Таким образом, отключая здесь отдельные ненужные нам css-файлы, мы можем существенно сократить код нашей дочерней темы.

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

    Все эти параметры у нас отображаются в разделе «Внешний вид»«Темы», при клике на кнопку «Информация о теме».

    В принципе эти все параметры ни как не влияют на работоспособность темы и носят чисто информативный характер.

  11. 11.Следующий, очень важный и интересный шаг позволяет нам скопировать все настройки родительской темы.
  12. 12.Нажимаем на кнопку «Create New Child Theme» и у нас выводится сообщение о том, что наша тема была успешно создана и нам рекомендуют воспользоваться предпросмотром перед ее активацией.

Нажимаем на эту ссылку и у нас открывается стандартный WordPress предпросмотр. Здесь мы можем убедиться что всё корректно работает и активировать тему.
Так же после создания эта дочерняя тема будет отображаться в разделе «Внешний вид»«Темы».

Вот так вот просто создается дочерняя тема.

Функции для копирования дополнительных файлов дочерней темы

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

Для этого:

  1. 1.Возвращаемся на страницу настроек плагина, и здесь нам нужно будет перейти на вкладку «Files». В перечне всех файлов родительской темы, мы при помощи галочек можем отмечать те файлы, которые нам нужны.
  2. 2.После того как вы все это отметили, нажимаем на кнопку «Copy Selected to Child Theme».
  3. 3.Теперь мы можем вносить изменения в файлы дочерней темы при помощи стандартного встроенного редактора WordPress или подключившись к сайт по FTP.

Так же на странице настроек данного плагина мы можем удалять те файлы, которые у нас не используются. Для этого в блоке «Child Theme Files» нам достаточно просто галочкой отметить те файлы, которые нам не нужны и нажать на кнопку «Delete Selected».

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

Просто нажимаем на кнопку обзор, выбираем то изображение, которое нас интересует, а затем просто нажимаем на кнопку «Upload».

Для удаления ненужных изображений просто ставим возле него галочку, и нажимаем на кнопку «Delete Selected»

Далее, на этой же вкладке мы можем изменить скриншот темы, который отображается в разделе «Внешний вид»«Темы».

Еще одна интересная возможность — это возможность экспорта zip-архива с файлами вашей дочерней темы. Вы можете внести изменения, затем нажать на кнопку «Export Child Theme», скачать архив и хранить его на компьютере в качестве резервной копии, либо же импортировать ее на другие сайты и использовать там.

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

Редактирование CSS-стилей дочерней темы при помощи плагина Child Theme Configurator

Прежде всего, перейдем на вкладку «Child Styles», где отображается файл style.css дочерней темы. Здесь вы можете просматривать содержимое данного файла.

На вкладке «Base Line Style» вы можете просмотреть стили родительской темы.

На вкладке «Web Fonts» можно выполнить подключение дополнительных шрифтов. Например, здесь указано как выполняется подключение шрифта Google Font. Вы можете скопировать пример кода и заменить ссылку на свою. После чего нажимаем здесь на кнопку «Save».

На вкладке «Property/Value», указываются значения различных css-свойств. Например, вы решили изменить css-свойство color или background-color. Вводим название этого свойства в верхнее поле, выбираем его из раскрывающегося списка и у нас на странице отображаются все значения фоновых цветов, которые задаются в теме. Любое из этих значений вы можете изменить.

После задания настроек нажимаем на кнопку «Save».

Вкладка «Query/Selector» позволяет вам переопределить стили элементов на свои. Вам даже не нужно никаике css-свойства писать. У вас прямо здесь отображается значения всех CSS свойств, указанных для определённого селектора.

Те значения, которые вам нужны, вы вносите в соответствующие поля.

Так же вы можете дописывать здесь новые css-свойства, копировать селекторы, и дописывать им свои значения. После чего обязательно нажимаем на кнопку «Save».

Если изначально у вас эта вкладка пустая, то нужно сначала изменить значения CSS свойств для нужного селектора на вкладке «Property/Value» или вписать его название в поле «Selector» и выбрать нужный блок из раскрывающегося списка.

В принципе все вкладки мы рассмотрели. Как видите настроек здесь очень много. Но если вдруг вам этих возможностей станет мало, то вы всегда можете обновить этот плагин до PRO-версии. Для этого переходим на вкладку «Upgrade» и здесь нажимаем на ссылку «Order Now».

Видеоинструкция

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

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

А на сегодня у меня все! Успехов вам и ваших проектам!

С уважением Юлия Гусарь

Дочерние темы

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

Что такое дочерняя тема?

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

Подробнее можно прочитать на сайте codex.wordpress.org

Почему не стоит редактировать файлы темы?

Процедура обновления темы заключается в полном удалении старой темы и закачивании на её место новой версии. Таким образом все Ваши изменения, сделанные в файлах темы будут удалены. Обновляетесь Вы вручную или автоматически из админки. Чтобы этого не допустить – необходимо вносить любые изменения в код дочерней темы. Дочернюю тему обновления не затрагивают.

Как вносить изменения в дочернюю тему?

После установки дочерней темы в папке wp-content/themes/ появится папка theme_child (вместо theme будет название родительской темы, например, yelly_child или root_child). Структура дочерней темы имеет вид:

functions.php
style.css

Добавлять новые стили или функции можно сразу же в style.css и functions.php.

Обратите внимание: не удаляйте существующий код в файле /theme_child/functions.php

Чтобы изменить запись, рубрику или любой другой шаблон – необходимо сначала скопировать файл из родительской темы, например, yelly или root в дочернюю тему theme_child.

Например, Вы решили изменить одиночную запись, файл single.php. Для этого скопируйте файл single.php из родительской темы в дочернюю theme_child. Все, теперь Вы можете редактировать файл /theme_child/single.php.

Не нужно копировать все файлы родительской темы в дочернюю, достаточно тех файлов, которые Вы редактируете. Вы можете создать папку template-parts и скопировать туда только один файл content-single.php, с которым Вы будете работать. Копировать все — не нужно.

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

Скачать Yelly Child

Скачайте готовую дочернюю тему для Yelly по ссылке.

Скачать Root Child

Скачайте готовую дочернюю тему для Root по ссылке.

Скачать Cook It Child

Скачайте готовую дочернюю тему для Cook It по ссылке.

Скачать JournalX Child

Скачайте готовую дочернюю тему для JournalX по ссылке.

Скачать Reboot Child

Скачайте готовую дочернюю тему для Reboot по ссылке.

wp_enqueue_style () | Функция | Ресурсы для разработчиков WordPress

wp-includes / class-wp-block.php: WP_Block :: render ()

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

wp-includes / script-loader.php: wp_enqueue_editor_block_directory_assets ()

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

wp-includes / script-loader.php: enqueue_block_styles_assets ()

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

wp-includes / script-loader.php: wp_common_block_scripts_and_styles ()

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

wp-includes / script-loader.php: wp_enqueue_registered_block_scripts_and_styles ()

Ставит в очередь зарегистрированные блочные скрипты и стили в зависимости от текущего визуализированного контекста (постановка в очередь только скриптов редактора в контексте редактора).

wp-admin / включает / meta-box.php: register_and_do_post_meta_boxes ()

Регистрирует мета-блоки сообщений по умолчанию и запускает действия do_meta_boxes .

wp-includes / general-template.php: wp_enqueue_code_editor ()

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

wp-includes / class-wp-editor.php: _WP_Editors :: enqueue_default_editor ()

Поставить в очередь все сценарии редактора.

wp-включает / виджеты / класс-wp-виджет-медиа-аудио.php: WP_Widget_Media_Audio :: enqueue_admin_scripts ()

Загружает необходимые медиа-файлы для медиа-менеджера и сценарии для медиа-виджетов.

wp-includes / widgets / class-wp-widget-media-audio.php: WP_Widget_Media_Audio :: enqueue_preview_scripts ()

Ставить сценарии предварительного просмотра в очередь.

wp-включает / виджеты / класс-wp-виджет-медиа-видео.php: WP_Widget_Media_Video :: enqueue_preview_scripts ()

Ставить сценарии предварительного просмотра в очередь.

wp-includes / embed.php: enqueue_embed_scripts ()

Очереди включают CSS и JS по умолчанию для iframe.

wp-includes / class-wp-customize-nav-menus.php: WP_Customize_Nav_Menus :: enqueue_scripts ()

Ставить скрипты и стили в очередь для панели настройщика.

wp-login.php: login_header ()

Вывести заголовок страницы входа.

wp-admin / includes / dashboard. php: wp_dashboard_setup ()

Регистрирует виджеты приборной панели.

wp-admin / includes / class-wp-internal-pointers.php: WP_Internal_Pointers :: enqueue_scripts ()

Инициализирует указатели новых функций.

wp-admin / включает / template.php: iframe_header ()

Общий заголовок iframe для использования с Thickbox

wp-admin / включает / media.php: wp_iframe ()

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

wp-admin / включает / class-custom-image-header.php: Custom_Image_Header :: css_includes ()

Установить очередь для файлов CSS

wp-admin / включает / class-custom-background.php: Custom_Background :: admin_load ()

Установите очередь для файлов CSS и JavaScript.

wp-includes / class-wp-customize-manager.php: WP_Customize_Manager :: customize_preview_init ()

Распечатать настройки JavaScript.

wp-includes / general-template.php: add_thickbox ()

Ставит в очередь файлы ThickBox js и css по умолчанию.

wp-includes / general-template.php: wp_admin_css ()

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

wp-includes / functions.php: wp_auth_check_load ()

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

wp-includes / class-wp-admin-bar.php: WP_Admin_Bar :: initialize ()
wp-includes / media.php: wp_enqueue_media ()

Ставит в очередь все скрипты, стили, настройки и шаблоны, необходимые для использования всех медиа-API JS.

wp-includes / media.php: wp_video_shortcode ()

Создает выходной шорткод видео.

wp-includes / media. php: wp_playlist_scripts ()

Выводит и помещает в очередь сценарии и стили по умолчанию для списков воспроизведения.

wp-includes / media.php: wp_audio_shortcode ()

Создает выходной шорткод аудио.

wp-includes / customize / class-wp-customize-color-control.php: WP_Customize_Color_Control :: enqueue ()

Ставить в очередь скрипты / стили для палитры цветов.

wp-includes / class-wp-customize-widgets.php: WP_Customize_Widgets :: enqueue_scripts ()

Ставит в очередь скрипты и стили для панели настройщика и экспортирует данные в JavaScript.

wp-includes / class-wp-editor.php: _WP_Editors :: enqueue_scripts ()

What The File — плагин для WordPress

What The File добавляет на вашу панель инструментов параметр, показывающий, какие части файла и шаблона используются для отображения страницы, которую вы в данный момент просматриваете. Вы можете щелкнуть имя файла, чтобы напрямую отредактировать его в редакторе темы, хотя я не рекомендую это делать для больших изменений.Что Файл поддерживает темы на основе BuddyPress и Roots Theme.

Более подробную информацию можно найти здесь.
Для получения поддержки посетите форум поддержки.

  • What The File показывает, какой файл шаблона используется.
  1. Загрузите what-the-file в каталог / wp-content / plugins /
  2. Активируйте плагин через меню «Плагины» в WordPress

Где я могу увидеть, какой файл шаблона используется?

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

Я не могу найти параметр «Что за файл» на панели инструментов

Вы должны быть администратором, чтобы увидеть опцию «Что за файл».

Делает то, что файл поддерживает BuddyPress

Да, это так.

Делает то, что файл поддерживает тему Roots

Да, это так.

Вы сэкономили мне столько времени, могу ли я вас как-нибудь поблагодарить?

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

«What The File» — программа с открытым исходным кодом. Следующие люди внесли свой вклад в этот плагин.

авторов
1.5.4: 8 октября 2017 г.
1.5.3: 2 мая 2016 г.
  • Добавлена ​​дополнительная проверка для стартовой темы Sage, props remyvv.
1.5.2
  • Исправлена ​​ошибка CSS с панелью администратора.
1.5.1
  • Исправлена ​​ошибка, из-за которой в некоторых темах отображались все изображения.
1.5.0
  • Добавляйте ссылку для редактирования, только если разрешено прямое редактирование файла. Стойка szepeviktor
  • Обернутая инициация в хуках и разделенном коде интерфейса и администратора.
  • Удалено использование create_function.
  • Различные оптимизации кода.
1.4.1
  • Исправлена ​​неправильно выровненная стрелка в MP6 — props remyvv.
  • Части шаблона теперь правильно отображаются в дочерних темах — props remyvv.
  • Изменение стиля кода.
1.4.0
  • Исправлена ​​ошибка части шаблона, реквизит remyvv
  • Изменение стиля кода
1.3.2
  • Плагин теперь проверяет, существует ли файл в дочерней или родительской теме.
1.
3.1
  • Редактирование файлов непосредственно через редактор тем теперь поддерживает дочерние темы.
1.3.0
  • Добавлена ​​поддержка части шаблона.
1.2.1
  • Улучшена админка и проверка роли администратора.
1.2.0
  • Добавлена ​​поддержка BuddyPress.
  • Добавлено примечание об обзоре WordPress.org.
  • Исправлена ​​административная проверка.
  • Небольшие изменения кода и рефакторинг.
  • Расширенная лицензия GPL.
1.1.2
  • Исправлена ​​ошибка URL-адреса администратора, возникающая при установке WordPress в подкаталог.
1.1.1
  • Небольшие изменения метаинформации.
1.1.0
  • Добавлена ​​поддержка темы Roots.
  • Добавлена ​​поддержка WordPress 3.5.1.
  • Мета информация изменена.
1.0.3
  • Добавлена ​​поддержка WordPress 3.5.
  • Небольшие изменения метаинформации.
1.0.2
  • Исправлен неправильный URL-адрес, когда имя каталога темы отличается от имени темы.
1.0.1
  • Изменен способ инициализации плагина.
  • CSS перемещен из файла во встроенный CSS.

Что такое дочерняя тема WordPress? Плюсы, минусы и многое другое

Многие наши пользователи спрашивают нас, какой шаблон мы используем? Наш ответ состоит в том, что мы используем настраиваемую дочернюю тему, созданную на основе темы Genesis. Последующий вопрос в большинстве случаев состоит из двух частей.Что такое фреймворк тем WordPress? Вторая часть вопроса: что такое дочерняя тема WordPress? Мы уже объясняли, что такое фреймворк WordPress в нашей предыдущей статье. В этой статье мы постараемся ответить на такие вопросы, как что такое дочерняя тема WordPress, когда следует создавать дочернюю тему, почему люди создают дочерние темы и, наконец, преимущества и недостатки использования дочерней темы. Мы надеемся, что после прочтения этой статьи вы получите четкое представление о том, что такое дочерняя тема WordPress, и узнаете, следует ли вам использовать дочернюю тему или нет.

Что такое дочерняя тема WordPress

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

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

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

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

Почему люди используют дочерние темы WordPress?

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

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

Когда следует использовать дочернюю тему?

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

Для пользователей мы рекомендуем дочерние темы только в том случае, если вы постоянно добавляете новые функции к функциям вашей темы.php и / или постоянно добавляя / изменяя файл style.css вашей темы. В этих случаях мы настоятельно рекомендуем использовать дочернюю тему. Некоторое время назад во время нашей беседы на встрече WordPress один из участников спросил нас, а что, если вы добавляете только собственные стили? Что лучше: дочерняя тема или собственный плагин CSS?

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

ВАЖНО выбрать хорошую родительскую тему

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

Если вы создаете дочернюю тему, в которой вы обнаруживаете, что заменяете множество файлов родительской темы, вам следует переосмыслить свой процесс. Например, вам очень нравится тема Twenty Eleven, и вы решили создать дочернюю тему. В вашей дочерней теме у вас были файлы style.css и functions.php. Вдобавок вы решили, что вам не нравится, как выглядит нижний колонтитул, поэтому добавили footer.php. То же самое для заголовка и т. Д. В этом случае не следует использовать Twenty Eleven в качестве родительской темы.Скорее вы должны использовать его как стартовую тему, которую вы превращаете в свою собственную тему.

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

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

Преимущества использования дочерней темы WordPress

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

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

2. Легко выдвигается

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

3. Резервный безопасный

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

Недостатки использования дочерней темы

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

Другой часто указываемый недостаток заключается в том, что разработчики вашей родительской темы могут потерять интерес и отказаться от нее, отказаться от функции, которую вы использовали в своей дочерней теме, или внести изменение, которое полностью уничтожит вашу дочернюю тему. Это не так плохо, как кажется. В основном потому, что все хорошие темы WordPress имеют открытый исходный код и лицензию GPL. Если разработчик родительской темы откажется от проекта, то ничто не говорит о том, что вы должны прекратить его использовать. Часто другие люди в сообществе принимают участие в проекте.Если разработчики исходной темы удаляют определенную функцию, вы можете просто добавить ее в свою дочернюю тему. У вас есть код для этого. Наконец, если они вносят радикальные изменения, которые вам не нравятся, вы всегда можете избежать обновления. Обновления тем имеют решающее значение при взломе системы безопасности. Мы всегда рекомендуем пользователям обновлять темы, потому что это помогает обеспечить совместимость с другими скриптами и плагинами в будущем.

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

Заключение

Важно знать, что даже если вы всегда можете создать дочернюю тему любой темы WordPress, иногда она может не понадобиться. Подумайте о количестве изменений, которые вы запланировали для своей дочерней темы. Если изменения, которые вы планируете, незначительны, вы всегда можете создать собственный стиль .css в своей теме или используйте плагин Custom CSS. Если изменения слишком велики, когда вы обнаруживаете, что переопределяете основные файлы родительской темы, вам, вероятно, следует создать собственную тему.

Мы надеемся, что эта статья поможет вам понять, что такое дочерняя тема WordPress и подходит ли она вам или нет. Если вы считаете, что мы что-то упустили, сообщите нам об этом в комментариях ниже.

webmandesign / child-theme: Примеры дочерних тем WordPress в основном для тем WordPress WebMan Design.

GitHub — webmandesign / child-theme: Примеры дочерних тем WordPress в основном для тем WordPress WebMan Design.

Примеры дочерних тем WordPress в основном для тем WordPress WebMan Design.

Файлы

Постоянная ссылка Не удалось загрузить последнюю информацию о фиксации.

Тип

Имя

Последнее сообщение фиксации

Время фиксации

Это образец дочерней темы, созданный в основном для тем WordPress WebMan Design.

Скачать

Вы можете загрузить устанавливаемый ZIP-пакет темы, файл child-theme.zip прямо из этого репозитория.
Прочтите приведенные ниже инструкции по настройке темы перед установкой!

Как установить и использовать вашу дочернюю тему?

  1. Распакуйте файл child-theme.zip на свой компьютер.
  2. Переименуйте папку дочерней темы по своему усмотрению.
    Пример: переименуйте папку в my-website-theme
  3. Откройте стиль .css и измените следующее:
    • CHILD_THEME_NAME — измените это имя на желаемое имя дочерней темы.
      Пример: переименовать в My Website Theme
    • PARENT_THEME_SLUG — измените это имя на желаемое имя папки родительской темы.
      Пример: , если вы используете тему WordPress Reykjavik в качестве родительской, установите для нее значение reykjavik
  4. Откройте файл functions. php и измените следующее:
    • CHILD_THEME_SLUG — измените это имя на имя папки вашей дочерней темы, заменив все - на _ .
      Пример: , если вы установили имя папки дочерней темы на my-website-theme , используйте здесь my_website_theme .
  5. Необязательно: вы также можете изменить изображение скриншота дочерней темы, также предоставляется образец исходного SVG.
  6. Теперь загрузите измененную дочернюю тему через FTP в папку YOUR_WORDPRESS_INSTALLATION_FOLDER / wp-content / themes / .
    (или заархивируйте дочернюю тему и загрузите ее через панель управления WordPress).
  7. На панели управления WordPress перейдите к Внешний вид »Темы и активируйте свою дочернюю тему.

Затем вы можете поместить любой пользовательский код CSS в конец файла style.css и любой пользовательский код PHP в конец файла functions.php .

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

Ресурсы

Около

Примеры дочерних тем WordPress в основном для тем WordPress WebMan Design.

Темы

Ресурсы

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

Как настроить тему WordPress с помощью дочерней темы Документация

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

# Что такое дочерняя тема WordPress?

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

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

Если вы вносите изменения в файлы темы напрямую (т.е. что-либо в каталоге / themes / yourthemename / ), эти изменения, скорее всего, будут перезаписаны при следующем обновлении темы .

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

# Создание собственной дочерней темы

К счастью, создать дочернюю тему совсем несложно — все, что вам нужно сделать, это создать одну папку и один файл .

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

# Создание папки дочерней темы

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

В этом каталоге создайте новую папку. Вы можете называть его как хотите, но я бы порекомендовал вам использовать описательное имя, например parenttheme-child (где parenttheme — это имя вашей активной темы).

Вот пример:

Как видите, моя активная тема — «twentyeleven», поэтому я создал папку «twentyeleven-child».

# Создание файла style.css дочерней темы

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

 / **
 * Название темы: Моя дочерняя тема
 * URI темы: http://mysite.com
 * Описание: Это созданная мной настраиваемая дочерняя тема.* Автор: Мое имя
 * URI автора: http: //mysite.com/
 * Шаблон: parenttheme
 * Версия: 0.1
 * / 

Мы займемся одной конкретной строкой из заголовка таблицы стилей.

 Шаблон: parenttheme 

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

Все, что осталось сделать, это активировать вашу дочернюю тему.Сделайте это, перейдя в Внешний вид → Темы на панели инструментов WordPress и активируя дочернюю тему.

# Настройка WordPress с использованием дочерней темы

Есть 2 вещи, которые вы можете захотеть настроить на своем веб-сайте WordPress:

  1. Внешний вид сайта: это можно сделать через CSS
  2. Вывод некоторых страниц сайта: это можно сделать через PHP

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

Перед тем, как переопределить стили родительской темы, необходимо сделать еще одну жизненно важную вещь.Если вы загрузите этот файл в его текущем состоянии и активируете дочернюю тему, WordPress посмотрит файл style.css вашей дочерней темы как файл стиля по умолчанию и ничего не увидит. В результате ваша тема будет отображаться без стилей CSS. Следовательно, вам нужно вызвать CSS-файл родительской темы в файле style.css вашей дочерней темы со следующей строкой кода:

 @import url (../ parenttheme / style.css); 

Вам необходимо изменить «parenttheme», чтобы оно соответствовало имени вашей родительской темы .Если таблица стилей по умолчанию — , а не style.css (почти наверняка так и будет), вам также нужно будет изменить ее, чтобы она соответствовала требованиям.

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

Хорошо, теперь допустим, что вы хотите внести простые изменения в родительскую тему . Что вы делаете? Просто откройте файл style.css дочерней темы и добавьте новые стили, которые вы хотите изменить в родительской теме.

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

Мы могли бы продемонстрировать некоторые действительно простые изменения в ссылках и абзацах. Я использовал код из исходной темы Twenty Eleven для нацеливания на различные элементы.Иногда необходимо использовать более конкретный селектор, чтобы переопределить старый дизайн.

 body {
отступ: 0 1.4em;
}
#страница {
маржа: 1.667em авто;
максимальная ширина: 900 пикселей;
}
a {
цвет: # 5281df;
текстовое оформление: нет;
семейство шрифтов: Calibri, Tahoma, Arial, sans-serif;
}
фокус,
а: активный,
a: hover {
оформление текста: подчеркивание;
} 

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

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

Затем просто скопируйте и вставьте код в CSS вашей дочерней темы, где вы можете безопасно его отредактировать:

 h3 {
размер шрифта: 2.5em; / * Увеличение размера шрифта * /
font-weight: жирный; / * Делаем заголовки жирным * /
маржа: 20px 0 10px;
} 

После редактирования файла просто сохраните его.

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

# Переназначение файлов шаблонов родительской темы

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

Легко. Скопируйте файл шаблона родительской темы в каталог дочерней темы и внесите в него изменения. . WordPress будет искать файлы шаблонов в каталоге дочерних тем сначала .И если существует альтернативная версия, скажем, footer.php или single.php , WordPress будет использовать этот файл шаблона.

Это просто круто. WordPress даже примет category-XX.php (где XX — идентификатор определенной категории) в дочерней теме, если вы хотите внести изменения в архив определенной категории.

# Подведение итогов

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

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

Работа с дочерними темами в WordPress

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

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

Как работают темы WordPress?

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

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

Родительские темы и рамки тем

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

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

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

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

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

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

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

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

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

Создание дочерней темы: основы

Можно создать дочернюю тему прямо в файлах wp-content / themes вашего сайта, но специалисты по веб-разработке рекомендуют создавать необходимые файлы локально, прежде чем добавлять их в активные файлы тем WordPress вашего сайта. Это дает вам возможность вносить все необходимые изменения — или экспериментировать с новыми параметрами — без риска повлиять на какой-либо из существующих каталогов на вашем сайте.

Для создания дочерней темы вам понадобится всего одна папка и два файла. Создайте новую папку для дочерней темы и дайте ей имя. Это может быть что угодно, но разработчики сайта предлагают просто обозначить его как дочерний элемент существующей родительской темы, например «[имя родительской темы] -child». Добавьте эту папку в файл wp-content / themes вашего сайта.

Внешний вид темы определяется ее таблицами стилей — одним или несколькими наборами кода, которые устанавливают правила для всех аспектов внешнего вида сайта, таких как шрифты и размеры шрифтов, цвета, интервалы и расположение элементов на странице. Чтобы создать новую таблицу стилей для дочерней темы, создайте новый текстовый файл и назовите его «style.css». Поместите его в папку дочерней темы. Чтобы новая таблица стилей работала должным образом, вам нужно вставить фрагмент кода, который называется заголовком таблицы стилей, который доступен в кодексе WordPress, источнике для разработки WordPress.Заголовок добавляет необходимую информацию, такую ​​как имя новой темы, имя шаблона или родительской темы, а также информацию о лицензии.

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

Последний файл, который нужен дочерней теме, называется functions.php. » Создайте этот файл и добавьте его в папку дочерней темы. Затем вставьте необходимый код из WP Codex. Этот файл позволяет вам добавлять в новую тему больше функций и возможностей.

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

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

Детская тема Divi | 30+ дочерних тем премиум-класса в различных сферах деятельности

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

Вы можете добавить множество файлов в дочернюю тему, каждый из которых позволит вам включить свой собственный код для специальных функций и стиля, которые сделают ваш сайт Divi выдающимся.Чаще всего дочерние темы включают в себя несколько файлов PHP (functions.php, header.php, footer.php), таблицу стилей (styles.css) и снимок экрана.

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

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

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

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

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

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