Создание виджета WordPress
12.04.2018
Из этой статьи вы узнаете о создании виджета WordPress в короткие сроки, а также добавлении его в существующую тему. И делать виджет мы будем на примере стандартной темы для WordPress — Twenty Twelve. Почему именно эта, а не новомодная Twenty Thirteen? Дело в том, что у многих до сих пор стоит старая версия WordPress, и они не успели перейти на новый WordPress 3.6 .
Как создать виджет WordPress
Делать мы будет самый простой виджет, который будет выводить заголовок. А также в качестве бонуса мы сделаем выпадающий список со всеми рубриками и из выбранной рубрики будет выводить записи.
Начинаем создание виджета для WordPress
Итак, мы открыли папку с темой по адресу wp-content\themes\twentytwelve и нашли файл functions.php. Давайте откроем его. В нем очень много строк кода. Ничего удалять не нужно, а нужно в самом начале файла, после кода <?php освободить немного места для наших манипуляций. К примеру, так:
Теперь начинается самое интересное. Это добавление кода для самого виджета. Причем ни чего с нуля писать не надо. Для добавления новых виджетов есть специальный класс WP_Widget, наследуя который вы без проблем решите задачу. Если вы не поняли о чем я, то не расстраивайтесь, а просто скопируйте код ниже в место, которое мы освободили.
class WP_book_Widget extends WP_Widget { public function __construct() { parent::__construct( 'widget_WP_book', 'Виджет сайта wp-book.ru', array( 'description' => __( 'Самый лучший виджет', 'text_domain' ), ) ); } public function update( $new_instance, $old_instance ) { $instance = array(); $instance['title'] = strip_tags( $new_instance['title'] ); return $instance; } public function form( $instance ) { ?> <p> <label for="<?php echo $this->get_field_id( 'title' ); ?>">Заголовок</label> <input class="widefat" id="<?php echo $this->get_field_id( 'title' ); ?>" name="<?php echo $this->get_field_name( 'title' ); ?>" type="text" value="<?php echo $instance['title']; ?>" /> </p> <?php } public function widget( $args, $instance ) { ?> <div style='border:1px solid red; text-align:center;padding:20px;'> <?php echo $instance[ 'title' ]; ?> </div> <?php } } add_action( 'widgets_init', function(){ register_widget( 'WP_book_Widget' ); });Теперь если вы в административной панели зайдете во вкладку Внешний вид > Виджеты, то увидите, что там появился новый виджет под названием Виджет сайта wp-book.ru. И выводить он будет то. что вы напишите в поле «Заголовок».