Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Code
  2. WordPress
Code

Как Фреймворки работают на самом деле

by
Difficulty:AdvancedLength:MediumLanguages:
This post is part of a series called How Theme Frameworks Actually Work.
Deciding How to Develop Your WordPress Theme Framework

Russian (Pусский) translation by Sergei Tolkunov (you can also view the original English article)

Фреймворки могут быть достаточно мощными. Для начинающих пользователей WordPress, они делают возможным создание уникального сайта, который выглядит, словно, это выполнено на заказ, и для разработчиков WordPress, они могут помоч применять принцип DRY (Don't Repeat Yourself - не повторяйся) и предоставят вам возможность быстро создавать пользовательские сайты.

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

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

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

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

  • Он состоит из родительской темы предназначеной для использования с дочерними темами. В некоторых случаях родительская тема также может быть независимой, но в других случаях родительская тема работает в сочетании с дочерней темой - WordPress Codex определяет их как 'Base/Starter Themes' и 'Code Libraries'.
  • Он включает хуки и функции которые могут быть управляемыми дочерними темами и плагинами. Ваш фреймворк является основой целой экосистемы с которой вы будете работать, и которая включает плагины которые будут закреплены в вашем фреймворке.
  • Если он разработан для пользователей - не-разработчиков, то он будет включать параметры темы, которые позволяют, им, настраивать тему согласно их нуждам. Фреймворки могут быть обширными, включая дизайн, макет, функции, контент и многое другое. В некоторых случаях, функциональность может быть предоставлена с помощью отладчика тем.
  • Он может содержать множество областей виджетов, чтобы пользователи могли даже без знаний кода добавлять контент на страницу(включая виджеты добавленные вашими плагинами).
  • Он может также включать функциональность некоторых библиотек, к примеру слайдеры jQuery или лайтбоксы. Завися от ваших и ваших пользователей потребностей, вы можете добавлять их в ваш фреймворк, или просто включить некоторые плагины в него.
  • Он является расширяемым. Позволяя расширять себя через дочерние темы и плагины.

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

Вот что фреймворки из себя представляют, но как они работают? Давайте взглянем на элементы фреймворка:

  • Родительская и дочерняя темы
  • Хуки (action и filter)
  • Функции
  • Настройки темы
  • Виджеты
  • Скрипты
  • Расширяемость

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

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

  • Как начальная тема, которая может работать сама по себе, и может изменяться в настройках или через настройщик. Вот пара примеров Atahualpa и Thematic. Они могут быть использованы как самостоятельные темы без использования дочерних.
  • В качестве основы для дочерней темы, без которой, тема не будет эффективно поддерживать сайт. Вот примеры Hybrid Core и Genesis. Она будет включать основной код, который вы обычно можете найти среди хуков и функций, которые могут быть использованы вашей дочерней темой, а также и плагинами. Все это содержит API для фреймворка.

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

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

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

Хуки (action and filter)

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

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

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

Функции

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

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

Параметры темы

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

Вы можете выбрать, использование настройщика тем, для множества ваших опций, он имеет преимущество, позволяя пользователям видеть изменения, как только они их производят. Я применил это подход, для фреймворка Edupress, который я разработал, для школьных сайтов, с Марком Вилкинсоном (Mark Wilkinson).

Области виджетов

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

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

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

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

Скрипты

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

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

Если вы добавляете скрипты, то позаботьтесь об опции активации и деактивации, на экране настроек.

Расширяемость

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

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

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

Итог

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

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

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

Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.