Создание пользовательских страниц в админке WordPress, Часть 1
В предыдущей серии я представил подробное руководство по работе с API настроек WordPress. Для тех, кто новичок в WordPress или кто использует другие инструменты, такие как The Customizer для обработки различных параметров, это может быть чем-то, что вам не пришлось использовать для разработки ваших темы или плагина.
Как указано в Кодексе:
Я не думаю, что это нужно учить, но это то, о чем вы должны знать и уметь с этим работать, если вам потребуется ввести параметр на страницу, через админку WordPress.
Это мощный, хотя и довольно сложный API, что дает нам большое количество функциональных возможностей. В конечном счете, это позволяет нам сделать много вещей на стороне сервера и минимум вещей на стороне клиента.
Но как насчет времени, когда мы работаем над пользовательским решением для клиентов, и нам нужно немного больше гибкости, чем предоставляет API параметров? Например, нам необходимо построить плагин, который будет иметь страницу параметров, но нуждается в более гибком наборе параметров и с учетом проверки функциональности?
Для этих случаев и существует возможность написания собственных страниц администрирования для WordPress. В этой серии мы рассмотрим, как именно это сделать.
Прежде чем начать
Как в большинстве уроков, важно убедиться, что у вас всё на месте для того, чтобы следовать вместе со мной и работать с исходным кодом, на протяжении всей серии.
Для этого урока, я предполагаю, что:
- На вашей операционной системе установлена локальная среда разработки.
- У вас есть копия WordPress, установленная, готовая к использованию и установке плагина.
- Вы знакомы с разработкой плагинов для WordPress.
- Вы свободно работаете с PHP и HTML.
Если вы не знакомы с настройка локальной среды разработки, включающей WordPress, пожалуйста, посмотрите эту серию о том, как это сделать.
И если вам комфортно с PHP, даже если вы хотя бы умеете читать язык, то я сделаю все от меня зависящее, чтобы обеспечить четкие инструкции и комментарии для каждого куска кода, который мы рассматриваем.
После того, как всё на своих местах, мы готовы начать работу над нашим плагином.
Пользовательские Параметры Администрирования WordPress
К концу этой серии у нас будет плагин, который отвечает следующим требованиям:
- Добавлять новый элемент подменю к существующей системе меню WordPress.
- Добавляет новую страницу настроек, соответствующий новому элементу подменю.
- Очистка и сериализация параметров страницы.
- Проверяет, возвращает значения, которые были сохранены и обрабатывает их соответствующим образом.
Кроме того, мы уверенно приближаемся к этому наиболее модульным способом, используя Стандарты Написания Кода WordPress и аналогичной практике, чтобы сделать чтение, запись и поддержку нашего плагина настолько просто, насколько это возможно.
1. Загрузчик плагинаПервое, что мы должны сделать это создать загрузчик плагина. Это включает создание каталога для файлов плагина, обычного README, копию лицензии и файлов загрузчика, которые в конечном счете будут использованы для запуска плагина, и каталога, который будет содержать классы, связанные с административной функциональностью.
Эти файлы можно загрузить из вложения к этой записи, а пока, ниже, вы можете увидеть, как выглядит мой каталог:
Кроме того содержимое загрузчика плагина очень просто. Просмотрите следующий код для PHP файла custom-admin-settings.php , и затем я расскажу о нем более подробно в блоке ниже.
Обратите внимание, что в приведенном выше коде, фактический очень мало кода. И очень много комментариев. Основной блок комментариев в верхней части файла объясняет, что делает файл.
Область под тегом @wordpress-plugin является тем, что будет читать WordPress для создания названия плагина, описания и связанные ссылки в панели плагина WordPress.
Далее мы запретим кому-либо доступ к файлу напрямую. И, наконец, мы создадим пользовательскую функцию с хуком plugins_loaded . Эта функция будет использоваться для запуска плагина.
На этом этапе, вы должны быть в состоянии войти в WordPress, перейти в панель плагина, а затем убедиться в том, что плагин можно активировать. Так что, давай нажмём Активировать.
Пока ничего не произойдет, но мы начнем добавлять функциональность, работая над ним по этому уроку.
2. Создание элемента подменюДля того, чтобы начать работу над плагином, давайте сначала добавим элемент подменю. Чтобы сделать это, мы должны воспользоваться преимуществами API WordPress и функцией add_options_page . Этой функции потребуется пять параметров:
- текст для отображения в качестве заголовка на соответствующей странице параметрв
- текст для отображения в виде текста подменю для пункта меню
- возможности, необходимые для доступа к этот пункт меню
- токен меню, который используется для идентификации этого элемента подменю
- функция обратного вызова, которая отвечает за вывод страницы администратора
Обратите внимание на то, что мы будем использовать классы, для организации нашей функциональности, так что это будет объектно-ориентированным.
Во-первых, давайте создадим класс в папке admin с названием class-submenu.php . Поскольку этот класс отвечает за представление нового подменю, мы назовём его более образно.
Содержимое класса должно выглядеть следующим образом:
На данный момент плагин по-прежнему не будет ничего делать. Нам по-прежнему необходимо создать фактический класс Submenu_Page , и нам нужно прикрутить классы для загрузки файла.
3. Создание подменю страницыНачнем с класса Submenu_Page . Создайте другой файл в папке admin и назовите его class-submenu-page.php . Затем добавьте следующий код в файл.
При отображении этой страницы, он просто будет показывать текст: «This is the basic submenu page.» И наконец, мы добрались до добавления новых возможностей. Но сначала, давайте приведем этот плагин в жизнь, создав для него загрузочный файл.
4. Отображение меню и страницыОткройте файл custom-admin-settings.php, который мы создали ранее в этом уроке. Давайте двигаться дальше и напишем код, необходимый для добавления нового пункта подменю и связанной страницы.
Помните, что класс Submenu требует, чтобы экземпляр класса Submenu_Page был передан в его конструктор, и затем нам нужно вызвать метод init класса Submenu, чтобы заставить всё это работать.
В коде это выглядит следующим образом:
На данный момент, вы должны обновить вашу установку WordPress, активировать плагин (если он еще не активирован), а затем вы увидите вашу новую страницу в области администрирования.
В следующей статье, мы рассмотрим, как создать отображение реальных настроек. Кроме того, мы рассмотрим лучшие примеры практики с точки зрения работы с нашими шаблоном и частей шаблона, и тогда мы увидим, как они будут соединены по API, отвечающим не только за их сохранение, но так же за очистку и их проверку.
Но прежде чем мы зайдем так далеко, я хочу поговорить немного о классе дизайна, который мы видели в этом уроке. В общем, я хочу поговорить о том, почему у нас есть класс Submenu и Submenu_Page и как они относятся к файлу загрузки.
Несколько слов об ответственности классов
Для тех из вас, кто знаком с Принципом единой ответственности, этот раздел не будет вам интересен. Но если кому-то нужна ссылка или кто хочет узнать больше, то читайте.
Там еще много чего, но если вы посмотрите на каждый из наших классов (по крайней мере два у нас уже есть), то становится ясно, что причины изменения наших классов могут быть следующими:
- Содержимое подменю может изменяться. Всё, от названия страницы до токена меню, и всё, что между ними.
- Способ, которым страница отображает ее содержимое может (и будет меняться). В частности, прямо сейчас он ничего не делает, кроме вывода строки. Вскоре он будет включать в себя конкретный файл. После этого может потребоваться включить несколько файлов.
Две причины выше — две очень разные причины, которые могут изменять классы, поэтому держать их вместе в одном классе, будет нарушением вышеуказанного принципа.
В конце концов, я упомянул об этом не только для того, чтобы пролить свет на отличные принципы разработки программного обеспечения, которые могут быть применены в WordPress, но и чтобы подготовить вас к тому, по каким причинам мы будем разбивать большие части файлов в содержимое плагинов.
Познания о принципах хороши и могут быть применены в нескольких проектах, а не только в одном. Вы изучите их, вы попрактикуете их использование, и вы будете лучше проектировать решения для других людей.
Изучение может быть очень запутанным, но как только вы начнете взбираться на гору, это станет легче и проще для применения принципов в вашей повседневной работе. Затем работу, которую вы делаете для других станет гораздо проще поддерживать со времени.
Заключение
Не забывайте, что вы можете скачать плагин в его текущем состоянии с этого поста. Так как, мы продвигаемся по сериям, я сделаю последнюю версию для каждого поста, так что вы сможете следить за кодом, описанным в каждом уроке, повозиться с ним, и подготовить вопросы, которые вы можете задать в комментариях.
В качестве примечания, если вы ищете другие утилиты, для увеличения вашего набора инструментов для WordPress или код, на котором можно учиться и стать более продвинутым в WordPress, не забудьте посмотреть, что у нас есть в наличии на рынке Envato.
Помните, вы можете выловить все мои курсы и учебники на странице Моего профиля, и вы можете следовать за мной в моем блоге и/или Twitter @tommcfarlin, где я говорю о различных практиках разработки программного обеспечения и как мы можем использовать их в WordPress.
И, наконец, не стесняйтесь оставлять любые вопросы или комментарии ниже. Я делаю все возможное, чтобы участвовать и ответить на каждый вопрос или критику, которые относятся к этому проекту.
Ресурсы
Subscribe below and we’ll send you a weekly email summary of all new Code tutorials. Never miss out on learning about the next big thing.