Как создать плагин для WordPress ( часть 2 )

В своей прошлой статье «Как создать плагин в Вордпрес» я рассказывал о том, что такое плагин  и как его создать.

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

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

И этот плюс такой: у нас появиться страница настроек плагина и ссылка на эту страницу из меню плагинов.




Но обо всём по порядку.

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

Пропущу момент создания самого плагина, его файла и описание. Подробней как создать плагин здесь.

В работе плагина плагина нам будут нужны: файл стилей ( my_css.css ), файл Javascript ( my_js.js ), ну и сам файл который будет рулить страницей плагина ( settings.php ).

Создадим эти файлы в папке с нашим плагином myplugin.

Для создания страницы с интерфейсом плагина ( это могут быть настройки, какие-либо поля или просто хэлпер ) нам понадобится следующий код:


function admin_add_menu(){ 
   add_menu_page( 'Settings My Cool Plugin',  'My Cool', 'manage_options',  plugin_dir_path( __FILE__ ).'settings.php',  '',  plugin_dir_url( __FILE__ )."icon.png"  

   wp_enqueue_script( 'my_js',  plugin_dir_url( __FILE__ ) . 'my_js.js', array('jquery'));

   wp_enqueue_style( 'my_css', plugin_dir_url( __FILE__ ) . 'my_css.css');

    }

add_action("admin_menu", "admin_add_menu");

Как обычно пояснения:

add_action ( «admin_menu», «admin_add_menu» ) — в момент добавления админ-меню ( в админ-панели ) admin_menu, сработает наша функция admin_add_menu.

add_menu_page(

— ‘Settings My Cool Plugin‘ — это title страницы нашего плагина,

— ‘My Coolтак будет называться наш плагин в админ-меню,

— ‘manage_options‘ — проверка прав ( а доступно ли это пользователю эта страница Админ или нет ),

plugin_dir_path( __FILE__ ).’settings.php’ путь к нашему файлу который будет выводить страницу,

‘ ‘ — здесь вместо файла settings.php может быть имя функции которая выведет HTML код страницы вместо файла,

plugin_dir_url( __FILE__ ).’icon.png’ — путь к иконке, которая будет рядом с названием плагина в админ — меню

);

wp_enqueue_script
 - 'my_js' имя под которым подключится наш файл js в WordPress,
 - plugin_dir_url( __FILE__ ) . 'my_js.js' - путь к самому js файлу,
 - array('jquery') - означает, что подключатся наш js будет только после подключения jquery
);

wp_enqueue_style( ‘my_css’, plugin_dir_url( __FILE__ ) . ‘my_css.css’); — аналогично подключению js.

После этого в админ меню мы должны увидеть следующую картинку

как создать плагин вордпрес

а после нажатия на этот пункт меню попадем на страницу нашего плагина.

Пока там пусто, так как мы создали только пустые файлы.

Исправим этот недостаток.

Первый на очереди будет конечно же файл settings.php.

Откроем его в редакторе и добавим:


<?php
  $path = plugin_dir_path( __FILE__ ).'/plugin.php';
  $data = get_plugin_data($path);
  $message = ( get_option('no_login_message') ) ? get_option('no_login_message') : '';
?>

<div class="wrapper">
  <p class="my_plugin_header"><?=$data['Name']?></p>
  <textarea class="my_message" placeholder="Enter your message here" ><?=$message?></textarea>
  <button id="my_plugin_save_button" class="button">Save settings</button>
</div>

В переменной $path мы получим путь к нашему плагину, а в массив $data — всю информацию по нему.

Далее идет «тернарщина»

$message = ( get_option(‘no_login_message’) ) ? get_option(‘no_login_message’) : »; — что означает, что переменная $message, будет равна значению полученному из опции ‘no_login_message’ если оно не пусто, и соответственно если значение опции пусто или такой опции вовсе нет, то и $message будет пустым.

Далее в тэге <p> выведем имя нашего плагина, а в textarea, наше сообщение.

Кнопка ‘Save settings‘ — призвана сохранить наше сообщение в базе, для последующего вывода во фронт-энде.

В наш my_css.css добавим украшения для наших текстового поля и кнопки.


.my_plugin_header{
 font-size: 1.3em;
 font-weight: bold;
 text-decoration: underline;
}

.my_message{
 width: 350px;
 height: 100px; 
}

#my_plugin_save_button {
 display: block;
 width: 130px;
 font-size: 1.1em;
 font-weight: bold;
 background: #32E02F;
}

Увидим примерно такое

создание плагина на вордпресе

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

как новичку создать плагин wordpres

Откроем наш plugin.php  в редакторе и закинем следующие строки


add_filter( 'plugin_action_links', 'settings_link', 10, 2 );

 function settings_link( $actions, $plugin_name ){
if( false === strpos( $plugin_name, basename(__FILE__) ) )
    return $actions;

 $settings_link = '<a href="options-general.php?page='. basename(dirname(__FILE__)).'/settings.php' .'">'.__("Settings").'</a>'; 
 array_unshift( $actions, $settings_link ); 
 return $actions; 

  }

Вот теперь другое дело: у нас добавилась ссылка «Настройки». Почему в тексте «Settings», а в меню пункт по русски — «Настройки»? Потому что после заключения текста в __(текст), тема вам его переведет на ваш родной язык ( если она это умеет ).

Теперь когда все ссылки ведут в Рим, ведут на страницу нашего плагина, добавим функций нашим настройкам.

Откроем в редакторе наш my_js.js и нацарапаем:


var $ = jQuery.noConflict();

 $(document).ready(function(){


  $('#my_plugin_save_button').on('click', function(){
   var data = {
    action: 'save_settings',
    my_message: $('.my_message').val()
   };
  
   jQuery.post( ajaxurl, data, function(response) {
    if( parseInt(response)===1 ) alert('Сообщение сохранено!');
    if( parseInt(response)===0 ) alert('Что-то не так! Повторите попытку');
   });


  });

 });

теперь в файл plugin.php добавим функцию которая будет отвечать нашему ajax-запросу


add_action('wp_ajax_save_settings', 'my_plugin_save_settings');

 function my_plugin_save_settings() {

  $value = sanitize_text_field($_POST['my_message']);
  $up = update_option( 'no_login_message', $value , false);
  echo ($up) ? 1: 0;
 wp_die(); 

 }

снова краткие пояснения:

‘wp_ajax_save_settings’ — save_settings — имя функции после wp_ajax к которой мы обращаемся из нашего ajax-запроса.

update_option( ‘no_login_message’, $value , false) — создадим если нет, а если есть обновим опцию по имени ‘no_login_message’ значением $value.

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


function no_login_message_func( $content ) {
  
  $message = '';
  $out = $content;
  if( is_page(49) && !is_user_logged_in() ) {
   $out = get_option('no_login_message');
  }

  return $out;
 }
 add_filter( 'the_content', 'no_login_message_func' );

краткие пояснения:
add_filter( ‘the_content’, ‘no_login_message_func’ )фильтр по событию загрузки контента вызовет нашу функцию no_login_message_func.

$out = $content — само содержимое страницы.

if( is_page(49) && !is_user_logged_in() ) — is_page(49) проверяем если посетитель запросил страницу с ID = 49,(в нашем случае это страница «Для залогиненых»)

!is_user_logged_in() — и если посетитель незалогинен.

Ну и если у нас выполнилось условие, то вместо контента страницы мы выведем наше сообщение, которое мы получили из нашей опции get_option(‘no_login_message’).

Так как мы сейчас залогинились как Администратор, то мы увидим контент страницы.

плагин залогиниться

Разлогинимся и увидим

только для зарегистрированных

И при этом, прошу заметить, мы не создавали дочернюю тему и не правили файл page.php.

Все управление осуществлялось посредством нашего плагина.




На этом все! Спасибо за внимание!

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

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