Как создать плагин «Вознаграждение за твит» на WordPress

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

Оставить твит о вашем продукте или статье — это еще один современный метод привлечения посетителей. В этом руководстве мы покажем вам, как можно создать плагин «Вознаграждение за твит» на WordPress. Начнем.

Пример

Создание файлов плагина

Во-первых, мы создадим папку с именем Reward-Tweets в директории wp-content/plugins, затем создадим в этой папке файл index.php. Теперь наполним его служебной информацией о плагине. Смотрите пример ниже.

/*

Теперь вы можете активировать этот плагин в администраторской панели вашего сайта.

Добавление награды за твит-ссылку на вашу статью или продукт

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

Добавление Meta Boxes в форму редактирования поста

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

  • Мы можем создавать пользовательские элементы meta box, используя функцию add_meta_box внутри экшена add_meta_boxes.
  • Первый параметр — уникальный ID для meta box.
  • Второй параметр — титул элемента meta box. Мы назвали его Reward Link.
  • Следующий параметр — имя функции, используемая для отображения HTML кода элемента metabox.
  • Четвертый параметр — тип поста. Пока вы используете обычные типы статей, этот параметр будет равен post. И, конечно, будет меняться, если тип поста изменится.

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

  • Сначала мы получаем все пользовательские meta значения, используя функцию get_post_custom.
  • Затем проверяем существование Reward Link. Если ссылка существует, то мы ее вставляем в качестве значения текстового поля.
  • Затем мы создаем одноразовое значение, используя функцию wp_nonce_field. Она будет нужна для подтверждения запроса при нажатии на кнопку публикации твита.
  • В конце отобразим метку (label) и текстовое поле для Reward Link.

Если вы настроили все верно, то после активации плигина, при создании поста, внизу появится meta box с полем Reward Link.

Сохранение ссылки на вознаграждение в базу данных

Теперь нам нужно сохранить значение Reward Link, при публикации и сохранении поста. Следующий код будет сохранять данные в таблицу wp_postmeta.

  • Во-первых, добавим функцию под названием reward_link_box_save, которая будет срабатывать после сохранения поста в базу данных.
  • Существующий ID поста будет передаваться в функцию автоматически.
  • В WordPress есть функция автосохранения. Мы не будем её использовать для сохранения нашей ссылки.
  • Затем проверяем валидность формы, используя ранее созданное одноразовое значение.
  • Проверяем права доступа на сохранение поста.
  • После всех проверок мы сохраняем Reward Link с ключом reward_link, используя update_post_meta.

Ссылка на вознаграждение у нас есть, теперь, объясним, как создать кнопку с твитом и как отобразить ссылку на вознаграждение.

Конфигурация стилей и скриптов

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

  • Во-первых, вызывем функцию apply_reward_tweet_scripts для инициализации скриптов.
  • Внутри функции мы подключим jQuery и виджет Twitter, используя функцию wp_enqueue_script.
  • Twitter widget.js нужен для генерации кнопки и стилей.
  • Затем подключим файл rewardTweet.js и стили rewardTweet.css.
  • В конце, определим некоторые значения для вставки в JS файл в $config_array. Ajax ссылкой будет файл admin-ajax.php.
  • Затем мы будем использовать wp_localize_script для добавления значений в JS файл. Первый параметр — название, используемое для включения пользовательского js, используя wp_enqueue_script.
  • Второй параметр — название объекта, которое будет использоваться для доступа к данным и третим параметром будет массив значений, которые также должны быть включены.

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

Отображение кнопки

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

  • В начале мы вызовем функцию add_reward_tweet_button на фильтре the_content. Этот фильтр будет применяться на содержимом каждого поста или страницы.
  • Страница или пост будут автоматически передаваться в эту функцию.
  • Затем мы получим пользовательские meta значения текущего поста.
  • Нам не нужна кнопка в категориях, архивах, тэгах и т.д. Для проверки будем использовать функцию is_single.
  • Также проверим, существует ли ссылка на награду и отобразим кнопку с твитом.
  • Панель вознаграждения не отобразится, если у поста нет ссылки на вознаграждение.

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

Вывод ссылок на скачивание при твите

После того, как будет нажата кнопка с твитом и будет опубликована ссылка на вашу статью/продукт в профиле пользователя, нам нужно отобразить ссылку с вознаграждением. Для определения твита мы будем использовать Twitter Web Intents Events. Вы можете прочитать об этом более подробно в центре разработки Twitter. Создадим JavaScript код в файле rewardTweet.js для отображения кнопки после публикации твита.

  • Первая строка отвечает за бесконфликтность jQuery с другими библиотеками.
  • Далее мы используем twttr.events.bind(‘tweet’, function(event) для привязки пользовательской функции к нашей кнопке с твитом. Эта функция исполнится при публикации твита.
  • Внутри функции мы будем использовать объект rewardData для получения данных, которые мы вставим в скрипт с помощью wp_localize_script.
  • Далее будем использовать экшн get_reward_links для AJAX запроса.
  • Как только запрос будет успешно завершен, мы получим JSON объект, содержащий ссылку на вознаграждение.
  • Мы проверим статус результата, привяжем ссылку к кнопке скачивания и покажем ее пользователю.

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

Создание ссылки с вознаграждением

Посылаем AJAX запрос на сервер с текущим ID поста. Рассмотрим приведенный ниже код.

  • Во-первых, мы будем использовать экшн, определенный в предыдущей части, и AJAX запросы, используя wp_ajax_nopriv_get_reward_links и wp_ajax_get_reward_links.
  • wp_ajax_nopriv будет использоваться для пользователей, которые не вошли на сайт.
  • wp_ajax — для тех, кто вошел.
  • Внутри функции get_reward_links мы получим ссылку на награду для текущего поста и отправим ее в виде JSON объекта.
  • Предыдущий JavaScript код будет декодировать JSON объект и отображать ссылки на вознаграждения.

Reward Link After Tweet

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

А здесь yii ajax можно почитать о создание AJAX валидации на примере Yii2.


Один комментарий на “Как создать плагин «Вознаграждение за твит» на WordPress

  1. Вау, спасибо, бро! искал плагины, все какие то кривые, уже отчаялся. И теперь вот оно, спасение :) поставлю на свой сайт, где psd исходники выкладываю) надеюсь заработает

Оставить комментарий