Виджет для WordPress

При очередном обновлении блога встал вопрос написания виджета для радио плеера (на самом деле просто хотелось посмотреть как оно работает).

Суть задачи довольно проста, есть плеер для которого надо приинклудить стили (как следствие картинки), скрипты (с зависимостью от jQuery), и флешку.

Дабы второй раз не тратить час на гугление решил вынести результат с описанием в отдельный пост.

Создаем папочку с именем плагина, в ней с таким же именем php файл, и папки styles, images, scripts, swf для всего что будем иклудить.

Далее пример содержания php файла с небольшими комментариями:

[code]
<?
/*
Plugin Name: Имя плагина
Plugin URI: http://урл.где.лежит/архив/с/плагином.zip
Author: Имя автора (почта@автора.плагина)
Author URI: http://домашняя.страница.автора
*/

/**
* Adds stream_ogg_player widget.
*/
class streamOggPlayer extends WP_Widget { // Создадим объект для нашего виджета унаследованный от WP_Widget

/**
* Register widget with WordPress.
*/
public function __construct() {
parent::__construct(
‘stream_ogg_player’, // Base ID плагина на тот случай если будут зависимости
‘Stream ogg player’, // Имя плагина
array( ‘description’ => __( ‘Stream ogg/mp3 player’, ‘http://dej.in.ua’ ), ) // Args
);
}

/**
* Front-end display of widget.
*
* @see WP_Widget::widget()
*
* @param array $args Widget arguments.
* @param array $instance Saved values from database.
*/
public function widget( $args, $instance ) { // Собственно функция виджета
extract ($args); // нужная строка
echo $before_widget; // в каждой теме что бы не портить верстку есть переменные $before_widget, $before_title, $after_title, $after_widget
echo $before_title; // По этому мы их echo`м дабы не попортить верстку темы
echo get_option(‘streamOggPlayerTitle’); // Берем из свойств виджета его титл, где и как он задается описано ниже
echo $after_title;
$url = get_option(‘streamOggPlayerURL’); // Берем еще какаюнить настройку. В моём случае это некий урл…
$swfURL = trailingslashit( plugins_url( basename( dirname( __FILE__ ) ) ) ) . ‘swf/’; // Вычисляем урл до контента папки swf
?>
… <!— Тут верстка виджета и подстановка посчитанных переменных —>
oga: "<? echo $url?>"

swfPath: "<? echo $swfURL; ?>",

<?
echo $after_widget; // И закрываем виджет
}

/**
* Sanitize widget form values as they are saved.
*
* @see WP_Widget::update()
*
* @param array $new_instance Values just sent to be saved.
* @param array $old_instance Previously saved values from database.
*
* @return array Updated safe values to be saved.
*/
/* public function update( $new_instance, $old_instance ) {

$instance = array();
$instance[‘title’] = strip_tags( $new_instance[‘title’] );

return $instance;
}*/

/**
* Back-end widget form.
*
* @see WP_Widget::form()
*
* @param array $instance Previously saved values from database.
*/
public function form( $instance ) { // Форма настройки виджета в панели админки
// Сохраняем настройки если сохраняются
if (!empty ($_REQUEST[‘streamOggPlayerTitle’])) {
update_option(‘streamOggPlayerTitle’, $_REQUEST[‘streamOggPlayerTitle’]);
update_option(‘streamOggPlayerURL’, $_REQUEST[‘streamOggPlayerURL’]);
}
// Читаем если читаются
$streamOggPlayerTitle = get_option(‘streamOggPlayerTitle’);
$streamOggPlayerURL = get_option(‘streamOggPlayerURL’);

?><!— Форма для редактирования виджета —>
Заголовок&nbsp;:&nbsp;<input type="text" name="streamOggPlayerTitle" value="<?=$streamOggPlayerTitle?>"/>
URL&nbsp;:&nbsp;<input type="text" name="streamOggPlayerURL" value="<?=$streamOggPlayerURL?>"/>
<?
}

} // class stream_ogg_player

// Регистрируем наш виджет
add_action( ‘widgets_init’, create_function( », ‘register_widget( "streamOggPlayer" );’ ) );
// Класс подтягивающий стили и скрипты
class streamOggPlayerStylesAndScripts {
function __construct() {
// Я люблю "котлеты отдельно мухи отдельно", по этому регистрирую две функции, одну на добавление стилей вторую на добавление скриптов
add_action(‘wp_enqueue_scripts’, array( $this, ‘addStyles’ ) );
add_action(‘wp_enqueue_scripts’, array( $this, ‘addScripts’ ) );
}
function addStyles() { // Добавляем стили
$path = trailingslashit( plugins_url( basename( dirname( __FILE__ ) ) ) ); // находим урл для доступа к контенту папки стилей
wp_enqueue_style( ‘stream-ogg-player-styles’, $path . "css/jplayer.pink.flag.css", null, ‘1.0’ ); // Синтаксис прост: 1. внутреннее имя; 2. урл к стилю; 3. список зависимостей, в этом случае нету; 4. версия скрипта (влияет на кэш)
}
function addScripts() { // аналогично для скриптов
$path = trailingslashit( plugins_url( basename( dirname( __FILE__ ) ) ) );
wp_enqueue_script( ‘stream-ogg-player-scripts’, $path . "scripts/jquery.jplayer.min.js", array(‘jquery’), ‘1.0’ ); // третьим аргументом указана зависимость от jQuery
}
}
new streamOggPlayerStylesAndScripts(); // Создаем объект инклуда стилей и скриптов
[/code]

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

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