v25 – Skapa en WordPress widget

En widget i WordPress är en bit innehåll som ska visas i ett temas ”widget areas”. Teman kan ha en eller flera widget areas, som du sedan kan lägga in widgets i via wp-admin.

Skapa en egen widget i en plugin

Till skillnad från andra typer av innehåll skapar du en widget genom att extenda en basklass från WordPress vid namn ”WP_Widget”.

<?php namespace MP;


// our custom widget class that extends
// the WP_Widget base class (from wordpress)
class Widget extends \WP_Widget {

  // use __construct() to register Widget ID, title, and description
  public function __construct() {    
    parent::__construct(
      'portfolio_widget', // the widget ID (machine_name)
      __('Portfolio'), // widget wp-admin title
      array('description' => __( 'Show a list of portfolio items!'))
    );
  }

  // echoes out widget HTML for front-end
  public function widget($args, $instance) {
    echo $args['before_widget'];
    if (isset($instance['title'])) {
      echo $args['before_title'] . apply_filters('widget_title', $instance['title']) . $args['after_title'];
    }

    // echo a link to our portfolio
    echo '<a href="'.site_url('/portfolio').'">Min Portfölj</a>';

    echo $args['after_widget'];
  }

  // create the widget options form
  public function form($instance) {
    // is there a saved title
    $title = isset($instance['title']) ? $instance['title'] : __('New title');

    // echo out the widget form input HTML
    ?>
      <p>
      <label for="<?php echo esc_attr( $this->get_field_id( 'title' ) ); ?>">
        Title:
      </label> 
      <input class="widefat" id="<?php echo esc_attr( $this->get_field_id( 'title' ) ); ?>" name="<?php echo esc_attr( $this->get_field_name( 'title' ) ); ?>" type="text" value="<?php echo $title ?>">
      </p>
    <?php 
  }

  // sanitize widget form values before they are saved
  public function update( $new_instance, $old_instance ) {
    $instance = array();
    $instance['title'] = !empty( $new_instance['title']) ? strip_tags($new_instance['title']) : '';
    return $instance;
  }
}

Då du extendar en klass, och dessutom inte själva bestämmer när olika metoder körs måste vi döpa dem till ”widget”, ”form”, och ”update”. På så sätt kan WordPress sedan använda våra metoder när de behövs.

Registrera din widget i WordPress

För att registrera din widget använder du funktioner register_widget i en add_action(‘widgets_init’) callback. Då du aldrig instantierar din Widget class (WordPress gör detta) kan du tyvärr inte ha din add_action() i konstruktor.

// Since WordPress "owns" the widget (will instantiate it on its own)
// we have no choice but to put our action outside
// the class
// register our class on widget init
function register() {
  // register our widget class in WordPress
  register_widget('\MP\Widget');
}
add_action('widgets_init', '\MP\register'); 

Läs mer om att skapa widgets i WordPress

0 votes