Розробка плагінів для WordPress від теорії до практики – урок 33

за Ніколаєнко Максим · Опубліковано Серпень 21, 2016 · Оновлено Серпень 27, 2020

Для тих хто не знає, що таке плагін поясню в трьох словах. Плагін це ваш код, який якимось чином змінює роботу CMS WordPress або доповнює її новими функціями.. Плагіни були придумані для того, щоб розробникам не доводилося міняти ядро CMS WordPress і всі оновлення проходили без помилок, сайт при цьому залишався в цілісності та безпеці, а функціонал системи міг доповнюватись. Детальніше про те, що таке плагіни ви можете прочитати в Codex WordPress. Для лінивих даю посилання де шукати плагіни WordPress.

Зміст приховати

1 Етап перший "Планування". Що ваш плагін буде робити і як його назвати?

2 Домашня сторінка плагіна

3 Приступаємо до розробки першого плагіна WordPress

4 Розберемо рядково базовий код плагіна.

4.1 Давайте трохи попрацюємо ми і змусимо наш плагін працювати.

Багато хто при вивченні того, як розробляти плагіни дивляться в код вже створених плагінів WordPress, але в будь-якому випадку легше, якщо хтось на початку пояснить елементарні речі. Якщо ви вже створили плагін, то ви завжди зможете його прорекламувати, розмістивши безкоштовну версію в репозиторії WordPress, а коли плагін набере популярність, то можна зробити і PRO версію, яка буде більш повною та корисною. Зазвичай PRO версії продають за невелику суму багатьом користувачам.

Етап перший "Планування". Що ваш плагін буде робити і як його назвати?

Тут треба добре подумати і можна взяти аркуш паперу і розкреслити схему роботи плагіна.

Подумайте, які налаштування будуть в панелі адміністратора і який буде результат на виході. Ще з важливого потрібно розуміти, що плагін має бути корисним, щоб його скачували. Важливо для популярності плагіна в інтернеті назвати його так, щоб у назві зустрічалося ключове слово або щоб назва відображала частину функціональності плагіна. Ось кілька прикладів гарних назв для плагінів All in one SEO упаковка, Йоаст SEO, Русь лат.

Якщо надалі ви хочете розмітити свій плагін у репозиторій https://wordpress.org/extend/plugins/, то необхідно створити докорінно файл readme.txt.

Домашня сторінка плагіна

Корисно для ознайомлення зі створеним вами плагіна створити інформаційну сторінку або навіть повноцінний сайт, на якому пояснюватиметься робота плагіна, як його встановити і де купити повну версію. На цій сторінці зазвичай викладають усі версії плагіна та описують яка версія протестована для якої версії WordPress.

Приступаємо до розробки першого плагіна WordPress

У цьому уроці та наступних уроках ми будемо розглядати як розробити плагін для WordPress, почнемо з самого початкового рівня. Розробка плагіна в WordPress справа не хитра якщо ви знаєте мову програмування PHP та API WordPress.

Для початку створення власної планіги необхідно в папці wp-content/plugins створити папку плагіна. Ми з вами створимо найпростіший плагін для зміни стилів панелі адміністратора у WordPress.

Створіть папку styling-адмін-панель (wp-content/plugins/styling-admin-panel) і в ній створіть файл index.php. Так прийнято, що головним файлом плагіна має бути файл index.php або файл з назвою плагіна, але оскільки назва фігурує в імені каталогу, де лежить наш плагін, то файл називаємо просто index.php.

Разработка плагинов для WordPress

Всередині файлу необхідно створити правильний коментар PHP, який зрозуміє WordPress. За допомогою цього коментаря ви зможете активувати створений плагін у панелі адміністратора. Додайте код у файл index.php у такому вигляді в якому я вам даю.

<?php
/**
 * @package Styling admin panel
 * @version 1.0
 */
/*
Plugin Name: Styling admin panel
Plugin URI:  https://wp-admin.com.ua/hello-dolly/
Description: This is a simple plug-in to change your admin panel style.
Author: Nikolaenko Maksim
Version: 1.1
Author URI: https://wp-admin.com.ua/
*/



?>

<?php

/**

* @package Styling admin panel

* @version 1.0

Plugin Name: Styling admin panel

Plugin URI: https://wp-admin.com.ua/hello-dolly/

Description: This is a simple plug-in to change your admin panel style.

Author: Nikolaenko Maksim

Version: 1.1

Author URI: https://wp-admin.com.ua/

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

Розберемо рядково базовий код плагіна.

У створений коментар можна додати авторські права та ліцензію на плагін. Зазвичай використовують ліцензію GPL або сумісну з GPL. Доопрацюємо наш код та додамо опис ліцензії.

Ось так виглядає стандартний коментар для плагіна разом із ліцензією.

<?php
/**
 * @package Styling admin panel
 * @version 1.0
 */
/*
Plugin Name: Styling admin panel
Plugin URI:  https://wp-admin.com.ua/hello-dolly/
Description: This is a simple plug-in to change your admin panel style.
Author: Nikolaenko Maksim
Version: 1.1
Author URI: https://wp-admin.com.ua/
*/

/*  Copyright 2016  Nikolaenko Maksim  (email: prografika.com.ua@gmail.com)

    This program is free software; you can redistribute it and/or modify
    it under the terms of the GNU General Public License as published by
    the Free Software Foundation; either version 2 of the License, or
    (at your option) any later version.

    This program is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU General Public License for more details.

    You should have received a copy of the GNU General Public License
    along with this program; if not, write to the Free Software
    Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA  02110-1301  USA
*/

?>

<?php

/**

* @package Styling admin panel

* @version 1.0

Plugin Name: Styling admin panel

Plugin URI: https://wp-admin.com.ua/hello-dolly/

Description: This is a simple plug-in to change your admin panel style.

Author: Nikolaenko Maksim

Version: 1.1

Author URI: https://wp-admin.com.ua/

This program is free software; you can redistribute it and/or modify

it under the terms of the GNU General Public License as published by

the Free Software Foundation; either version 2 of the License, or

(at your option) any later version.

This program is distributed in the hope that it will be useful,

but WITHOUT ANY WARRANTY; without even the implied warranty of

MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the

GNU General Public License for more details.

You should have received a copy of the GNU General Public License

along with this program; if not, write to the Free Software

Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA 02110-1301 USA

Після виконаної роботи ми можемо активувати нашу плагін.

Створення плагінів WordPress

Давайте трохи попрацюємо ми і змусимо наш плагін працювати.

За допомогою плагіна підключимо стилі для панелі адміністратора WordPress, Для цього вставте наступний код у файл плагіна.

function my_admin_head() {
        echo '<link rel="stylesheet" type="text/css" href="' .plugins_url('style.css', __FILE__). '">';
}

add_action('admin_head', 'my_admin_head');

function my_admin_head() {

echo '<link rel="stylesheet" type="text/css" href="' .plugins_url('style.css', __FILE__). '">';

}

add_action('admin_head', 'my_admin_head');

додати стилі до панелі адміністратора WordPress

Далі у папці з плагіном створіть файл style.css.

Створюємо стилі для панелі адміністратора WordPress

Додамо до створеного файлу style.css стилі:

#adminmenu, #adminmenu .wp-submenu, #adminmenuback, #adminmenuwrap { 
    background-color: #0b67c3 !important;
}

#adminmenu, #adminmenu .wp-submenu, #adminmenuback, #adminmenuwrap {

background-color: #0b67c3 !important;

}

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

Змінюємо колір меню панелі адміністратора за допомогою створеного плагіна WordPress

Ось такою простою дією ми змогли змінити стандартний вид меню на панелі адміністратора WordPress. Якщо у вас є досвід верстки HTML та CSS, то ви зможете змінити стандартний вид панелі до невпізнання.

Все, що ми зробили, це створили хук на стандартну функцію WordPress і трохи змінили її роботу.. Про те, що таке хуки (шипи) ви дізнаєтесь з наступних випусків курсу. Я вирішив урок розбити на кілька, щоб не було довгого простирадла тексту і дати невеликий приклад роботи з плагіном.