Wordpress Widget

Uvod

WordPress widget nastaje instanciranjem klase koja ima prilično veliki kod, pa se pri pravljenju novog widgeta koristi pripremljeni šablon koji se lako prilagodjava potrebama. Custom klasa nasledjuje WordPress-ovu klasu za widgete WP_Widget(). Više o klasi WP_Widget() možete pogledati na oficijelnoj stranici https://developer.wordpress.org/reference/classes/wp_widget/.

Osnovni kostur widget klase

Kostur nove klase se sastoji od četri funkcije i izgleda ovako:

class Novi_Widget extends WP_Widget {

   /* Inicijalizuje widget */
   public function __construct() {
     // parametri koji se prosledjuju super klasi
     // kacenje skripti i stilova i drugih pomocnih funkcija na udice
   }

   /* Stampa widget formu kada se prevuce u widget oblast u okviru Admin stranice (back-end) */
   public function form( $instance ) {
     // forma u okviru Admin stranice (back-end)
   }

   /* Aktivira se svaki put kad stisnemo "save". Uneti podatak čuva i ispisuje ga u formi i nakon "save" */
   public function update( $new_instance, $old_instance ) {
     //cuvanje unetih podataka i validacija...
   }

   /* Stampa sadrzaj widget-a na stranici */
   public function widget( $args, $instance ) {
     //sadrzaj widget-a
   }
}

class Novi_Widget extends WP_Widget {

/* Inicijalizuje widget */

public function __construct() {

// parametri koji se prosledjuju super klasi

// kacenje skripti i stilova i drugih pomocnih funkcija na udice

}

/* Stampa widget formu kada se prevuce u widget oblast u okviru Admin stranice (back-end) */

public function form( $instance ) {

// forma u okviru Admin stranice (back-end)

}

/* Aktivira se svaki put kad stisnemo "save". Uneti podatak čuva i ispisuje ga u formi i nakon "save" */

public function update( $new_instance, $old_instance ) {

//cuvanje unetih podataka i validacija...

}

/* Stampa sadrzaj widget-a na stranici */

public function widget( $args, $instance ) {

//sadrzaj widget-a

}

Kačenje widget-a na udicu:

// Registrovanje noce funkcije
function Novi_Widget_registrovanje(){
   register_widget("Novi_Widget");
}
//Kacenje na udicu "widget_init"
add_action( 'widgets_init', 'Novi_Widget_registrovanje');

// Registrovanje noce funkcije

function Novi_Widget_registrovanje(){

register_widget("Novi_Widget");

}

//Kacenje na udicu "widget_init"

add_action( 'widgets_init', 'Novi_Widget_registrovanje');

ili na drugi način ali sa istim rezultatom:

add_action( 'widgets_init', create_function( '', 'register_widget("Novi_Widget");' ) );

1	add_action( 'widgets_init', create_function( '', 'register_widget("Novi_Widget");' ) );

Pojašnjenje funkcija unutar klase

Funkcija “__construct”

Funkcija “__construct()” je zadužena za pojavljivanje našeg widget-a u delu “Available Widgets”, zajedno sa ostalim standardnim widgetima. Pored aktiviranja funkcija odredjuje ime, kratak opis i identifikacioni string. Takodje u okviru ove funkcije mogu da se registruju i aktiviraju udice za druge funkcije. Funkcija __construct() se nadovezuje na konstruktor unutar superklase WP_Widget.

Parametri konstruktorske funkcije u okviru WP-Widget klase su:

WP_Widget::__construct (
          string $id_base,
          string $name,
          array $widget_options = array(),
          array $control_options = array()
)

WP_Widget::__construct (

string $id_base,

string $name,

array $widget_options = array(),

array $control_options = array()

)

Ove parametre definišemo iz naše custom widget klase preko parent::__construct():

parent::__construct(
   'naziv_za_id_widget-a',                                        // $id_base - iz superklase
   'ime_widget-a',                                                // $name - iz superklase
   array(                                                         // $widget_options - iz superklase
        'classname'  => 'naziv_css_klase',                        // naziv CSS klase
        'description' => __( 'Kratak opis widget-a koji se pojavljuje na admin stranici kada je zajedno sa ostalim widget-ima')
   )
);

parent::__construct(

'naziv_za_id_widget-a', // $id_base - iz superklase

'ime_widget-a', // $name - iz superklase

array( // $widget_options - iz superklase

'classname' => 'naziv_css_klase', // naziv CSS klase

'description' => __( 'Kratak opis widget-a koji se pojavljuje na admin stranici kada je zajedno sa ostalim widget-ima')

)

);

Primer

Radi veće automatizacije šablona možemo da definišemo vrednosti promenjive $widget_slug i obezbedimo lako pozivanje promenjive u okviru naše klase koristeći funkciju get_widget_slug().

// Definisanje imena  slug-a
protected $widget_slug = 'prosistem_widget';

// Funkcija koja vraca widget_slug koji smo prethodno definisali
public function get_widget_slug() {
	return $this->widget_slug;
}
// Pozivanje roditeljskog konstruktora
parent::__construct(
   $this->get_widget_slug(),                                      // $id_base - iz superklase
   __( 'Prosistem Widget Name', $this->get_widget_slug() ),       // $name - iz superklase
   array(                                                         // $widget_options - iz superklase
        'classname'  => $this->get_widget_slug().'-class',        // naziv CSS klase
        'description' => __( 'Prosistem kratak opis widget-a.', $this->get_widget_slug() )  //Opis widgeta
   )
);

// Definisanje imena slug-a

protected $widget_slug = 'prosistem_widget';

// Funkcija koja vraca widget_slug koji smo prethodno definisali

public function get_widget_slug() {

return $this->widget_slug;

}

// Pozivanje roditeljskog konstruktora

parent::__construct(

$this->get_widget_slug(), // $id_base - iz superklase

__( 'Prosistem Widget Name', $this->get_widget_slug() ), // $name - iz superklase

array( // $widget_options - iz superklase

'classname' => $this->get_widget_slug().'-class', // naziv CSS klase

'description' => __( 'Prosistem kratak opis widget-a.', $this->get_widget_slug() ) //Opis widgeta

)

);

Funkcija “form”

Ova funkcija je zadužena za štampanje sadržaja widget forme na admin stranici (kad se prevuče u widget area). Osobine instanciranog widgeta se čuvaju u nizu $instance. Ovom nizu možemo da pridodamo defaultne vrednosti, dok se sve ostale vrednosti dobijaju kroz unos polja forme. Da bi promenjiva $instance bila niz koristimo izraz “(array) $instance” tzv. kastovanje (eng.casting).

Vrednosti polja forme su članovi niza $instance i može im se pristupiti koristeći key niza npr. $instance[‘title’]

Defaultne vrednosti u formi u vidu niza $defaults

Definišu se defaultne vrednosti u vidu key/value niza (npr. $defaults):

$defaults = array( 'title_input_polja' => 'defaultno input polje', 'default_sadrzaj_inputa' => 'Defaultni unos', );

1
2
3
4

$defaults = array(
'title_input_polja' => 'defaultno input polje',
'default_sadrzaj_inputa' => 'Defaultni unos',
);
Sjedinjenje dva niza

Nakon toga spojimo ta dva niza koristeći wordpress-ovu funkciju “wp_parse_args($instance, $defaults)”. Ova funkcija će spojiti nizove ($instance i $defaults) tako što će vrednosti niza $defaults biti pregažene ako postoje u nizu $args.
Forma widgeta

×
- Dinamički elementi forme
  
  Unutar forme je potrebno da neki parametar (npr.ID polja) ima dinamičke vrednosti koje će biti različite za svaku novu instancu widgeta. To se postiže sa metodam
  a WP_Widget klase:
  - get_field_id().
  - get_field_name()
- Radio button i Check box
  
  Ukoliko se u formi koristi check box ili radio button onda se koristi naredba checked($checked, $current) koja poredi dve vrednosti: poslednju sačuvanu vrednost i trenutnu vrednost polja. Ukoliko su obe čekirane dodaje atribut checked-“checked”. Više o ovoj funkciji pogledajte na codex.wordpress.org/Function_Reference/checked
- Dropdown meni
  
  Pri korišćenju dropdown menija se koristi selected( $selected, $current) koja poredi dve vrednosti: poslednju sačuvanu vrednost i trenutnu vrednost polja. Ukoliko su obe čekirane dodaje atribut selected=”selected”. Više o ovoj funkciji na codex.wordpress.org/Function_Reference/selected
- Sprečavanje XSS napada (eng.escaping)
  
  Pri pisanju koda forme obratiti pažnju da se uradi escaping unosa

Primer

public function form( $instance ) {
  // default-ne vrednosti (one koje bi widget trebalo da ima kada se prvi put koristi)
  $defaults = array(
      "title" => "Omiljeni postovi",
      "number" => 5,
      "display_author" => "on",
      "display_comments"=> "",
      "cat_id" => "",
  );
  // Konvertovanje (eng.casting) $instance u niz i spajanje sa nizom $defaults
  $instance = wp_parse_args(
     (array) $instance,
     $defaults
  );
  // Kategorije za "select" dropdown
  $cats = get_categories( array("hide_empty"=>false) );
?>
  // FORMA:
  <p>
    <label for="<?php echo esc_attr($this->get_field_id( "title" )); ?>"><?php _e( "Title:","wpp" ); ?></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 esc_attr( $instance["title"] ); ?>" />
  </p>

  <p>
    <label for="<?php echo esc_attr($this->get_field_id( "number" )); ?>"><?php _e( "Number of posts to show:","wpp" ); ?></label>
    <input id="<?php echo esc_attr($this->get_field_id( "number" )); ?>" name="<?php echo esc_attr($this->get_field_name( "number" )); ?>" type="text" value="<?php echo esc_attr( $instance["number"] ); ?>" />
  </p>

  <p>
    <input id="<?php echo esc_attr($this->get_field_id( "display_author" )); ?>" name="<?php echo esc_attr($this->get_field_name( "display_author" )); ?>" class="checkbox" type="checkbox" value="on" <?php checked($instance["display_author"], "on") ?> />
    <label for="<?php echo esc_attr($this->get_field_id( "display_author" )); ?>"><?php _e( "Display post author?","wpp" ); ?></label>
  </p>
  <p>
    <input id="<?php echo esc_attr($this->get_field_id( "display_comments" )); ?>" name="<?php echo esc_attr($this->get_field_name( "display_comments" )); ?>" class="checkbox" type="checkbox" value="on" <?php checked($instance["display_comments"], "on") ?> />
    <label for="<?php echo esc_attr($this->get_field_id( "display_comments" )); ?>"><?php _e( "Display post comments?","wpp" ); ?></label>
  </p>

  <p>
    <label for="<?php echo esc_attr($this->get_field_id( "cat_id" )); ?>"><?php _e( "Category:","wpp" ); ?></label>
    <select id="<?php echo esc_attr($this->get_field_id( "cat_id" )); ?>" name="<?php echo esc_attr($this->get_field_name( "cat_id" )); ?>">
          <option value="" ><?php _e("None", "wpp"); ?></option>
          <?php foreach( $cats as $cat ) : ?>
          <option value="<?php echo esc_attr($cat->term_id); ?>" <?php selected($instance["cat_id"], $cat->term_id) ?>><?php echo esc_html($cat->name) ?></option>
          <?php endforeach; ?>
    </select>
  </p>
<?php
} // end Function "form"

public function form( $instance ) {

// default-ne vrednosti (one koje bi widget trebalo da ima kada se prvi put koristi)

$defaults = array(

"title" => "Omiljeni postovi",

"number" => 5,

"display_author" => "on",

"display_comments"=> "",

"cat_id" => "",

);

// Konvertovanje (eng.casting) $instance u niz i spajanje sa nizom $defaults

$instance = wp_parse_args(

(array) $instance,

$defaults

);

// Kategorije za "select" dropdown

$cats = get_categories( array("hide_empty"=>false) );

// FORMA:

<p>

<label for="<?php echo esc_attr($this->get_field_id( "title" )); ?>"><?php _e( "Title:","wpp" ); ?></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 esc_attr( $instance["title"] ); ?>" />

</p>

<p>

<label for="<?php echo esc_attr($this->get_field_id( "number" )); ?>"><?php _e( "Number of posts to show:","wpp" ); ?></label>

<input id="<?php echo esc_attr($this->get_field_id( "number" )); ?>" name="<?php echo esc_attr($this->get_field_name( "number" )); ?>" type="text" value="<?php echo esc_attr( $instance["number"] ); ?>" />

</p>

<p>

<input id="<?php echo esc_attr($this->get_field_id( "display_author" )); ?>" name="<?php echo esc_attr($this->get_field_name( "display_author" )); ?>" class="checkbox" type="checkbox" value="on" <?php checked($instance["display_author"], "on") ?> />

<label for="<?php echo esc_attr($this->get_field_id( "display_author" )); ?>"><?php _e( "Display post author?","wpp" ); ?></label>

</p>

<p>

<input id="<?php echo esc_attr($this->get_field_id( "display_comments" )); ?>" name="<?php echo esc_attr($this->get_field_name( "display_comments" )); ?>" class="checkbox" type="checkbox" value="on" <?php checked($instance["display_comments"], "on") ?> />

<label for="<?php echo esc_attr($this->get_field_id( "display_comments" )); ?>"><?php _e( "Display post comments?","wpp" ); ?></label>

</p>

<p>

<label for="<?php echo esc_attr($this->get_field_id( "cat_id" )); ?>"><?php _e( "Category:","wpp" ); ?></label>

<select id="<?php echo esc_attr($this->get_field_id( "cat_id" )); ?>" name="<?php echo esc_attr($this->get_field_name( "cat_id" )); ?>">

<?php foreach( $cats as $cat ) : ?>

<?php endforeach; ?>

</select>

</p>

<?php

} // end Function "form"

Funkcija “update”

Ova funkcija se aktivira svaki put kada stisnemo save. Ona čuva neki podatak u polju ako je unet i ispisuje ga u formi. Koriste se dva parametra roditeljske klase WP_Widget():

niz $new_instance – New settings for this instance as input by the user via WP_Widget::form()
niz $old_instance – Old settings for this instance

Unutar ove funkcije se pored čuvanja unetih podataka paralelno radi validacija (eng.validation) i čišćenje (eng.sanitize) unosa iz forme.

Primer

public function update( $new_instance, $old_instance ) {

    //Cuvamo unete vrednosti i vrsimo validaciju unetih podataka preko forme
    $instance = $old_instance;

    $instance["title"] = strip_tags( $new_instance["title"] );
    $instance["number"] = (int)strip_tags( $new_instance["number"] );
    $instance["display_author"] = isset($new_instance["display_author"]) ? "on" : "";
    $instance["display_comments"] = isset($new_instance["display_comments"]) ? "on" : "";
    $instance["cat_id"] = isset($new_instance["cat_id"]) ? $new_instance["cat_id"] : "";

    return $instance;
} // end Function widget

public function update( $new_instance, $old_instance ) {

//Cuvamo unete vrednosti i vrsimo validaciju unetih podataka preko forme

$instance = $old_instance;

$instance["title"] = strip_tags( $new_instance["title"] );

$instance["number"] = (int)strip_tags( $new_instance["number"] );

$instance["display_author"] = isset($new_instance["display_author"]) ? "on" : "";

$instance["display_comments"] = isset($new_instance["display_comments"]) ? "on" : "";

$instance["cat_id"] = isset($new_instance["cat_id"]) ? $new_instance["cat_id"] : "";

return $instance;

} // end Function widget

Funkcija “widget”

Ova Funkcija je zadužena za štampanje widgeta na javnoj stranici korisnika. U okviru superklase WP_Widget, parametar $args je niz (key/value) čiji su članovi:

‘before_title’=> ‘ ‘
‘after_title’=> ‘ ‘
‘before_widget’=> ‘ ‘
‘after_widget’=> ‘ ‘

Članove ovog niza prebacujemo u promenjive sa funkcijom extract():

extract( $args, EXTR_SKIP );

1	extract( $args, EXTR_SKIP );

Nakon čega možemo da koristimo promenjive:

$before_title
$after_title
$before_widget
$after_widget

Sve što treba da se štampa čuvamo u okviru promenjive $widget_string”. Možemo da koristimo funkcije “ob_start() i ob_get-clean()” ili jednostavnu konkatenaciju string-a.

Šablon klase za izradu widget-a

Ovaj šablon klase za pravljenje custom widget-a je nastao modifikacijom koda originalnog šablona “Widget Boilerplate” od autora Tom McFariln-a. Ceo kod šablona može da se iskopira u functions.php ali je bolje rešenje da se izdvoji u poseban fajl, pa da se pozove u functions.php sa naredbom:

include_once locate_template('/include/widget.php');

1	include_once locate_template('/include/widget.php');

Nakon kopiranja koda šablona treba prilagoditi kod našim potrebama, promeniti nazive na mestima gde se pojavljuje reč “prosistem”,a dodati deo koda na mestima “dodati_kod”.

<?php
/**
 * Osnovni Widget Boilerplate "ProSistem Studio"
 * (napravljen na osnovu Tom McFarlin boilerplate)
 *
 * UPUTSTVO ZA KORISCENJE:
 * -----------------------
 * Menjati tamo gde pise "prosistem" a dadati logiku tamo gde piše "dodati_kod"
 *
 * Sadrzaj klase:
 * ----------------------
 *  1. Definise se ime slug-a widgeta
 *  2. Funkcija "get_widget_slug()" - vraca definisani widget slug za koriscenje unutar nase custom klase
 *  3. Funkcija "__construct"
 *      3.1  - Kaci na udicu funkciju "widget_textdomain" koja ucitava textdomain
 *      3.2  - "parent::__construct"
 *             Inicira pojavljivanje widget-a u admin stranici zajedno sa standardnim widget-ima.
 *             Pravi: ID widgeta, naziv widgeta, opis  widgeta (dok čeka da se prevuce), naziv CSS klase
 *      3.3  - Kači na različite udice funkciju  "flush_widget_cache()"
 *  4. Funkcija "form" - stampa widget formu kada se prevuce u widget oblast u okviru Admin stranice
 *  5. Funkcija "update" - aktivira se svaki put kad stisnemo "save" widget u back-endu. Uneti podatak čuva i ispisuje ga u formi i nakon "save".
 *     Unutar ove funkcije se paralelno radi i "validation" i "sanitize" unetih podataka.
 *  6. Funkcija "widget()" - stampa sadrzaj widgeta na javnoj strani sajta
 *      6.1 Deo vezan za Keširanje - Check if there is a cached output
 *      6.2 Pravi promenjive od niza unetih podataka (elemenata forme) preko parametra funkcije $args
 *      6.3 Stampanje widgeta
 *  7. Funkcija "wp_cashe_delete()" za brisanje keširanja
 *  8. Funkcija "widget_textdomain" - ucitava Widget's text domain za localizaciju i prevodjenje iz foldera "lang"
 */

// Prevent direct file access
if ( ! defined( 'ABSPATH' ) ) {
	exit;
}

class Prosistem_Widget extends WP_Widget {
    /**
    * 1. Definise se ime slug-a widget-a
    */
    protected $widget_slug = 'prosistem_widget';

    /**
    * 2. Vraca definisani widget slug za koriscenje unutar nase custom klase
    *
    * @return string - ime widget slug-a koji smo mi prethodno definisali
    */
    public function get_widget_slug() {
       return $this->widget_slug;
    }

    /** 3. Konstruktorska funkcija */
    public function __construct() {
        /** 3.1. Kaci na udicu funkciju "widget_textdomain" koja ucitava textdomain  */
        add_action( 'init', array( $this, 'widget_textdomain' ) );

        /** 3.2 Pridruzuje vrednosti koje mi zelimo promenjivama Superklase "WP_Widget" */
        parent::__construct(
           $this->get_widget_slug(),                                 // $id_base - iz superklase
           __( 'Prosistem Widget', $this->get_widget_slug() ),  // $name - iz superklase
           array(                                                    // $widget_options - iz superklase
             'classname'   => $this->get_widget_slug() . '-class',  //  naziv CSS klase
             'description' => __( 'Prosistem kratak opis widget-a.', $this->get_widget_slug() ) //Opis widget-a
           )
        );

        /** 3.3 Kači na različite udice funkciju  "flush_widget_cache()" */
        add_action( 'save_post',    array( $this, 'flush_widget_cache' ) );
        add_action( 'deleted_post', array( $this, 'flush_widget_cache' ) );
        add_action( 'switch_theme', array( $this, 'flush_widget_cache' ) );
    } // end 1. Constructor

    /**
    * 4. Funkcija "form" - u okviru Admin stranice stampa izgled widget forme kada se widget prevuce u widget oblast
    *
    * @param array $instance The array of keys and values for the widget.
    */
    public function form( $instance ) {
       // TODO: dodati_kod koji definise niz "$defaults" sa defaultnim vrednostima widgeta
       $defaults = array(
         'nesto prosistem'        => 'defaultno nesto prosistem',
       );

       // Konvertovanje (eng.casting)  $instance  u niz i spajanje sa nizom $defaults
       $instance = wp_parse_args(
                                  (array) $instance,
                                  $defaults
       );

      // TODO: dodati_kod koji pravi formu
    } // end Function form

    /**
    * 5. Funkcija  "upadate" se aktivira svaki put kad stisnemo "save" widget u back-endu.
    *    Ostavlje vidljivu vrednost nekog polja ako je uneta i nakon "save"
    *    Sadrzi procese koji prethode cuvanju widget-a kao sto je validacija...
    *
    * @param array $new_instance - nova vrednost instance generisana via the update.
    * @param array $old_instance - prethodna vrednost instance  pre update.
    *
    * @return array $instance - update-ovanu  i validiranu instancu
    */
    public function update( $new_instance, $old_instance ) {
       $instance = $old_instance;

       // TODO: dodati_kod koji obicno radi validaciju vrednosti  unetih preko forme ($new_instance)

       return $instance;
    } // end Function widget

    /**
    * 6. Funkcija "widget" stampa sadrzaj widgeta na stranici korisnika
    *
    * @param array $args     - niz elemenata forme
    * @param array $instance - trenutna instanca widgeta
    *
    * @return int
    */
    public function widget( $args, $instance ) {
        // 6.1  Deo vezan za Keširanje - Check if there is a cached output
        $cache = wp_cache_get( $this->get_widget_slug(), 'widget' );

        if ( !is_array( $cache ) )
         $cache = array();
        if ( ! isset ( $args['widget_id'] ) )

        if ( isset ( $cache[ $args['widget_id'] ] ) )
         return print $cache[ $args['widget_id'] ];

       /** 6.2 Pravi promenjive od niza unetih podataka (elemenata forme) preko parametra funkcije $args
       *      (Pravi $before_widget, $after_widget, $before_title, $after_title  (defined by themes).
       */
       extract( $args, EXTR_SKIP );

       /**
        * 6.3 stampanje izgleda widgeta
        */
         $widget_string = $before_widget;

         ob_start();
         // TODO: dodati_kod - deo vezan za stampanje widgeta na javnoj korisinčkoj strani
         // NAPOMENA: ovde moze da se uradi jednostavna konkatenacija stringa umesto funkcija "ob_start() i ob_get-clean()"
         $widget_string .= ob_get_clean();

         $widget_string .= $after_widget;

         print $widget_string;

         // drugi deo dela vezanog za kesiranje
         $cache[ $args['widget_id'] ] = $widget_string;
         wp_cache_set( $this->get_widget_slug(), $cache, 'widget' );

    } // end Function "widget"

    // 7. funkcija za brisanje keširanja
    public function flush_widget_cache()
    {
        wp_cache_delete( $this->get_widget_slug(), 'widget' );
    } //end Function "flush_widget_cashe"

    /**
    * 8. Funkcija "widget_textdomain" - ucitava Widget's text domain za prevodjenje iz foldera "lang"
    */
    public function widget_textdomain() {

	    // TODO be sure to change 'widget-name' to the name of *your* plugin
	    load_plugin_textdomain( $this->get_widget_slug(), false, plugin_dir_path( __FILE__ ) . 'lang/' );

    } // end Function "widget_textdomain"

} // end class

add_action( 'widgets_init', create_function( '', 'register_widget("Prosistem_Widget");' ) );

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

<?php

/**

* Osnovni Widget Boilerplate "ProSistem Studio"

* (napravljen na osnovu Tom McFarlin boilerplate)

* UPUTSTVO ZA KORISCENJE:

* -----------------------

* Menjati tamo gde pise "prosistem" a dadati logiku tamo gde piše "dodati_kod"

* Sadrzaj klase:

* ----------------------

* 1. Definise se ime slug-a widgeta

* 2. Funkcija "get_widget_slug()" - vraca definisani widget slug za koriscenje unutar nase custom klase

* 3. Funkcija "__construct"

* 3.1 - Kaci na udicu funkciju "widget_textdomain" koja ucitava textdomain

* 3.2 - "parent::__construct"

* Inicira pojavljivanje widget-a u admin stranici zajedno sa standardnim widget-ima.

* Pravi: ID widgeta, naziv widgeta, opis widgeta (dok čeka da se prevuce), naziv CSS klase

* 3.3 - Kači na različite udice funkciju "flush_widget_cache()"

* 4. Funkcija "form" - stampa widget formu kada se prevuce u widget oblast u okviru Admin stranice

* 5. Funkcija "update" - aktivira se svaki put kad stisnemo "save" widget u back-endu. Uneti podatak čuva i ispisuje ga u formi i nakon "save".

* Unutar ove funkcije se paralelno radi i "validation" i "sanitize" unetih podataka.

* 6. Funkcija "widget()" - stampa sadrzaj widgeta na javnoj strani sajta

* 6.1 Deo vezan za Keširanje - Check if there is a cached output

* 6.2 Pravi promenjive od niza unetih podataka (elemenata forme) preko parametra funkcije $args

* 6.3 Stampanje widgeta

* 7. Funkcija "wp_cashe_delete()" za brisanje keširanja

* 8. Funkcija "widget_textdomain" - ucitava Widget's text domain za localizaciju i prevodjenje iz foldera "lang"

// Prevent direct file access

if ( ! defined( 'ABSPATH' ) ) {

exit;

}

class Prosistem_Widget extends WP_Widget {

/**

* 1. Definise se ime slug-a widget-a

protected $widget_slug = 'prosistem_widget';

/**

* 2. Vraca definisani widget slug za koriscenje unutar nase custom klase

* @return string - ime widget slug-a koji smo mi prethodno definisali

public function get_widget_slug() {

return $this->widget_slug;

}

/** 3. Konstruktorska funkcija */

public function __construct() {

/** 3.1. Kaci na udicu funkciju "widget_textdomain" koja ucitava textdomain */

add_action( 'init', array( $this, 'widget_textdomain' ) );

/** 3.2 Pridruzuje vrednosti koje mi zelimo promenjivama Superklase "WP_Widget" */

parent::__construct(

$this->get_widget_slug(), // $id_base - iz superklase

__( 'Prosistem Widget', $this->get_widget_slug() ), // $name - iz superklase

array( // $widget_options - iz superklase

'classname' => $this->get_widget_slug() . '-class', // naziv CSS klase

'description' => __( 'Prosistem kratak opis widget-a.', $this->get_widget_slug() ) //Opis widget-a

)

);

/** 3.3 Kači na različite udice funkciju "flush_widget_cache()" */

add_action( 'save_post', array( $this, 'flush_widget_cache' ) );

add_action( 'deleted_post', array( $this, 'flush_widget_cache' ) );

add_action( 'switch_theme', array( $this, 'flush_widget_cache' ) );

} // end 1. Constructor

/**

* 4. Funkcija "form" - u okviru Admin stranice stampa izgled widget forme kada se widget prevuce u widget oblast

* @param array $instance The array of keys and values for the widget.

public function form( $instance ) {

// TODO: dodati_kod koji definise niz "$defaults" sa defaultnim vrednostima widgeta

$defaults = array(

'nesto prosistem' => 'defaultno nesto prosistem',

);

// Konvertovanje (eng.casting) $instance u niz i spajanje sa nizom $defaults

$instance = wp_parse_args(

(array) $instance,

$defaults

);

// TODO: dodati_kod koji pravi formu

} // end Function form

/**

* 5. Funkcija "upadate" se aktivira svaki put kad stisnemo "save" widget u back-endu.

* Ostavlje vidljivu vrednost nekog polja ako je uneta i nakon "save"

* Sadrzi procese koji prethode cuvanju widget-a kao sto je validacija...

* @param array $new_instance - nova vrednost instance generisana via the update.

* @param array $old_instance - prethodna vrednost instance pre update.

* @return array $instance - update-ovanu i validiranu instancu

public function update( $new_instance, $old_instance ) {

$instance = $old_instance;

// TODO: dodati_kod koji obicno radi validaciju vrednosti unetih preko forme ($new_instance)

return $instance;

} // end Function widget

/**

* 6. Funkcija "widget" stampa sadrzaj widgeta na stranici korisnika

* @param array $args - niz elemenata forme

* @param array $instance - trenutna instanca widgeta

* @return int

public function widget( $args, $instance ) {

// 6.1 Deo vezan za Keširanje - Check if there is a cached output

$cache = wp_cache_get( $this->get_widget_slug(), 'widget' );

if ( !is_array( $cache ) )

$cache = array();

if ( ! isset ( $args['widget_id'] ) )

if ( isset ( $cache[ $args['widget_id'] ] ) )

return print $cache[ $args['widget_id'] ];

/** 6.2 Pravi promenjive od niza unetih podataka (elemenata forme) preko parametra funkcije $args

* (Pravi $before_widget, $after_widget, $before_title, $after_title (defined by themes).

extract( $args, EXTR_SKIP );

/**

* 6.3 stampanje izgleda widgeta

$widget_string = $before_widget;

ob_start();

// TODO: dodati_kod - deo vezan za stampanje widgeta na javnoj korisinčkoj strani

// NAPOMENA: ovde moze da se uradi jednostavna konkatenacija stringa umesto funkcija "ob_start() i ob_get-clean()"

$widget_string .= ob_get_clean();

$widget_string .= $after_widget;

print $widget_string;

// drugi deo dela vezanog za kesiranje

$cache[ $args['widget_id'] ] = $widget_string;

wp_cache_set( $this->get_widget_slug(), $cache, 'widget' );

} // end Function "widget"

// 7. funkcija za brisanje keširanja

public function flush_widget_cache()

{

wp_cache_delete( $this->get_widget_slug(), 'widget' );

} //end Function "flush_widget_cashe"

/**

* 8. Funkcija "widget_textdomain" - ucitava Widget's text domain za prevodjenje iz foldera "lang"

public function widget_textdomain() {

// TODO be sure to change 'widget-name' to the name of *your* plugin

load_plugin_textdomain( $this->get_widget_slug(), false, plugin_dir_path( __FILE__ ) . 'lang/' );

} // end Function "widget_textdomain"

} // end class

add_action( 'widgets_init', create_function( '', 'register_widget("Prosistem_Widget");' ) );

Widget unutar plugina

Struktura plugina

Ukoliko widget pravimo u sklopu plugina, šablon je dopunjen dodatnim elementima vezanim za plugin. Pa struktura foldera plugin-a izgleda ovako:

css
- admin.css
- widget.css
- sass
  - admin.scss
  - widget.scss
js
- admin.js
- widget.js
lang
- plugin.po
views
- admin.php
- widget.php
Prosistem-Widget-Boilerplate.php

Css fajlovi stilizuju izgled plugina, na administratrskoj strani admin.css dok widget.php stilizuje krajnji izgled widget-a na javnoj stranici sajta. Slično važi za javascript fajlove, admin.js sadrži skripte koje se koriste za prikaz na admin stranici dok widget.js sadrži skripte za prikaz na javnoj korisničkoj stranici sajta. Folder “lang” čuva fajlove vezane za prevodjenje plugin-a.

Folder “view” sadrži fajlove u kojima se nalaze izdvojeni delovi php koda. U fajlu admin.php je izdvojen deo iz funkcije “form” koji je zadužen za štampanje sadržaja unutar widget forme kad se prevuče u widget area u okviru admin stranici. Dok je u widget.php fajlu izdvojen deo iz funkcije “widget”.

Šablon Widget klase za plugin

Ovaj šablon sadrži sav kod prethodno objašnjen ali poseduje dodatni deo koji će da registruje i učitava script-e, css fajlove i fajlove vezane za prevodjenje plugin-a.

<?php
/**
 * WordPress Widget Boilerplate uz Plugin by ProSistem Studio
 * @url https://github.com/tommcfarlin/WordPress-Widget-Boilerplate
 *
 * Plugin Name:       @TODO
 * Plugin URI:        @TODO
 * Description:       @TODO
 * Version:           1.0.0
 * Author:            @TODO
 * Author URI:        @TODO
 * Text Domain:       widget-name
 * License:           GPL-2.0+
 * License URI:       http://www.gnu.org/licenses/gpl-2.0.txt
 * Domain Path:       /lang
 * GitHub Plugin URI: https://github.com/...
 *
 *
 * UPUTSTVO:
 * -------------------------------------------------------------------------
 * Menjati tamo gde pise "prosistem" a dadati kod tamo gde piše "dodati_kod"
 */

/**
 * Sadrzaj klase:
 * ----------------------
 * 1. Osnovna setovanja
 *  1.1  Definise se ime slug-a widgeta
 *  1.2. Funnkcija "get_widget_slug()" - vraca definisani widget slug za korišcenje unutar naše custom klase
 *  1.3 __construct
 *      1.3.1 Kaci na udicu funkciju "widget_textdomain" iz dela "Pomocne funkcije"
 *      1.3.2 Registruje udice za funkcije:  "activate()" i "deactivate()" iz dela "Pomocne funkcije"
 *      1.3.3 Funkcija "parent::__construct"
 *            Inicira pojavljivanje widget-a u admin stranici zajedno sa standardnim widget-ima.
 *            Pravi: ID widgeta, naziv widgeta, opis  widgeta (dok čeka da se prevuce), naziv CSS klase
 *      1.3.4 Kaci na udicu funkcije: "register_admin_styles()" i "register_admin_scripts()" iz dela 3. Public function
 *      1.3.5 Kaci na udicu funkcije: "register_widget_styles" i "register_widget_scripts" iz dela 3. Public function
 *      1.3.6 Kaci na razlicite udice 2.2 funkciju  "flush_widget_cache()"
 *
 * 2. API funkcije ( Stampa sadrzaj widget-a)
 *  2.1 Funkcija "widget()" - stampa sadrzaj widgeta
 *     2.1.1 Deo vezan za keširanje
 *     2.1.2 Pravi promenjive od niza unetih podataka (elemenata forme) preko parametra funkcije $args
 *     2.1.3 Štampanje izgleda widgeta
 *  2.2 Funkcija "flush_widget_cache"  - vezana za  brisanje kesiranja
 *  2.3 Funkcija "update" - aktivira se svaki put kad stisnemo "save" widget u back-endu. Uneti podatak čuva i ispisuje ga u formi i nakon "save".
 *      Unutar ove funkcije se paralelno radi i "validation" i "sanitize" unetih podataka.
 *  2.4 Funkcija "form" - stampa widget formu kada se prevuce u widget oblast u okviru Admin stranice
 *
 * 3. Pomocne funkcije
 *  3.1 Funkcija "widget_textdomain" - ucitava Widget's text domain za localizaciju i prevodjenje.
 *  3.2 Funkcija "activate" - aktivira logiku widget-a kada je aktivan widget
 *  3.3 Funkcija "deactive" - deaktivir logiku widget-a kada se iskljuci widget
 *  3.4 Funkcija "register_admin_styles" - ubacuje CSS koji se nalazi u css/admin.css folderu
 *  3.5 Funkcija "register_admin_scripts" - ubacuje JS koji se nalazi u js/admin.js folderu
 *  3.6 Funkcija "register_widget_styles" - ubacuje CSS koji se nalazi u css/widget.css folderu
 *  3.7 Funkcija "register_widget_scripts" - ubacuje JS koji se nalazi u js/widget.js folderu
 */

// Prevent direct file access
  if ( ! defined ( 'ABSPATH' ) ) {
  exit;
}

/*
 * TODO: Definisati ime widgeta
 */
class Prosistem_Widget extends WP_Widget {

  /*--------------------------------------------------*/
  /* 1. Osnovna setovanja
  /*--------------------------------------------------*/
  //1.1 Definiše se ime slug-a widget-a
    protected $widget_slug = 'prosistem_widget';


  // 1.2. Return the widget slug.
  /**
   * @return string - ime widget slug-a koji smo mi prethodno definisali
  */
  public function get_widget_slug() {
  	return $this->widget_slug;
  }


  public function __construct() {
  	// 1.3.1 Kaci na udicu funkciju pod brojem 3.1 iz dela "Pomocne funkcije"
  	add_action( 'init', array( $this, 'widget_textdomain' ) );

  	// 1.3.2 Registruje udice za funkcije:  "activate()" i "deactivate()" iz dela "Pomocne funkcije"
  	register_activation_hook( __FILE__, array( $this, 'activate' ) );
  	register_deactivation_hook( __FILE__, array( $this, 'deactivate' ) );

  	//1.3.3 Daje vrednosti promenjivama metode roditeljske klase
      parent::__construct(
  		$this->get_widget_slug(),                                 // $id_base - iz superklase
  		__( 'Prosistem Widget', $this->get_widget_slug() ),       // $name - iz superklase
  		array(                                                    // $widget_options - iz superklase
  			'classname'  => $this->get_widget_slug().'-class',      //  naziv CSS klase
  			'description' => __( 'Prosistem kratak opis widget-a.', $this->get_widget_slug() ) //Opis widget-a
  		)
  	);

  	// 1.3.4 Kaci na udicu funkcije: "register_admin_styles()" i "register_admin_scripts()" iz dela 3. Public function
  	add_action( 'admin_print_styles', array( $this, 'register_admin_styles' ) );
  	add_action( 'admin_enqueue_scripts', array( $this, 'register_admin_scripts' ) );

  	// 1.3.5 Kaci na udicu funkcije: "register_widget_styles" i "register_widget_scripts" iz dela 3. Public function
  	add_action( 'wp_enqueue_scripts', array( $this, 'register_widget_styles' ) );
  	add_action( 'wp_enqueue_scripts', array( $this, 'register_widget_scripts' ) );

  	// 1.3.6 Kaci na razlicite udice funkciju  "flush_widget_cache()" iz dela 3. Pomocne funkcije
  	add_action( 'save_post',    array( $this, 'flush_widget_cache' ) );
  	add_action( 'deleted_post', array( $this, 'flush_widget_cache' ) );
  	add_action( 'switch_theme', array( $this, 'flush_widget_cache' ) );
  } // end 1. Constructor


  /*--------------------------------------------------*/
  /* 2.  Widget API
  /*--------------------------------------------------*/
  /**
   * 2.1 Funkcija "widget" stampa sadrzaj widgeta
   *
   * @param array $args - niz elemenata forme
   * @param array $instance - trenutna instanca widgeta
   *
   * @return int
   */
  public function widget( $args, $instance ) {
  	// 2.1.1  Deo vezan za Keširanje - Check if there is a cached output
  	  $cache = wp_cache_get( $this->get_widget_slug(), 'widget' );

  	  if ( !is_array( $cache ) )
  	  	$cache = array();
  	  if ( ! isset ( $args['widget_id'] ) )

  	  	if ( isset ( $cache[ $args['widget_id'] ] ) )
  	  		return print $cache[ $args['widget_id'] ];

  	// 2.1.2 Pravi promenjive od niza unetih podataka (elemenata forme) preko parametra funkcije $args (Pravi $before_widget, $after_widget)
  	  extract( $args, EXTR_SKIP );

  	// 2.1.3 Štampanje izgleda widgeta. U ovom delu je logika koja manipulise sa vrednostima koje se dobijaju preko input polja forme
  	  $widget_string = $before_widget;
  	  ob_start();
  	  //TODO: dodati_kod - ovde ide deo vezan za štapanje  moze da se koriste funkcije "ob_start() i ob_get-clean()" kao sto je poceto ili da se obriše i zatim jednostavna konkatenacija stringa
  	  $widget_string .= ob_get_clean();
  	  $widget_string .= $after_widget;

  	  // drugi deo dela vezanog za kesiranje
  	  $cache[ $args['widget_id'] ] = $widget_string;
  	  wp_cache_set( $this->get_widget_slug(), $cache, 'widget' );

  	  print $widget_string;
  } // end  function "widget"


  // 2.2 funkcija za brisanje keširanja
  public function flush_widget_cache()
  {
  	wp_cache_delete( $this->get_widget_slug(), 'widget' );
  }

  /**
   * 2.3 Funkcija  "upadate" aktivira se svaki put kad stisnemo "save" widget u back-endu.
   *     Unutar ove funkcije se paralelno radi i "validation" i "sanitize" unetih podataka.
	 *
   * @param array $new_instance - nova vrednost instance generisana via the update.
   * @param array $old_instance Prethodna vrednost instance  pre update.
   *
   * @return array $instance - update-ovanu  i validiranu instancu
   */
  public function update( $new_instance, $old_instance ) {

  	$instance = $old_instance;

  	// TODO: dodati-kod koji obicno radi validaciju vrednosti  unetih preko forme ($new_instance)

  	return $instance;
  } // end Function "update"

  /**
   * 2.4 Back-end widget forma.
   *
   * @param array $instance The array of keys and values for the widget.
   */
  public function form( $instance ) {

  	// TODO: dodati_kod koji definise niz "$defaults" sa defaultnim vrednostima widgeta

  	// Rasclanjuje  $instance u niz i pridodaje default-ne vrednosti definisane u nizu $defaults
  	$instance = wp_parse_args(
  		(array) $instance,
  		$defaults
  	);

  	// TODO: Store the values of the widget in their own variable

  	// Display the admin form
  	include( plugin_dir_path(__FILE__) . 'views/admin.php' );
  } // end Function "form"



  /*---------------------------------------------------------------------------------------------*/
  /* 3. Pomocne funkcije
  /*---------------------------------------------------------------------------------------------*/

  /**
   * 3.1 Funkcija "widget_textdomain" - ucitava Widget's text domain za localizaciju i prevodjenje iz foldera "lang"
   */
  public function widget_textdomain() {

  	// TODO be sure to change 'widget-name' to the name of *your* plugin
  	load_plugin_textdomain( $this->get_widget_slug(), false, plugin_dir_path( __FILE__ ) . 'lang/' );

  } // end widget_textdomain

  /**
   *  3.2 Funkcija "activate" - aktivira logiku widget-a kada je aktivan widget
   *
   * @param  boolean $network_wide True if WPMU superadmin uses "Network Activate" action, false if WPMU is disabled or plugin is activated on an individual blog.
   */
  public function activate( $network_wide ) {
  	// TODO define activation functionality here
  } // end activate

  /**
   * 3.3 Funkcija "deactive" - deaktivir logiku widget-a kada se iskljuci widget
   *
   * @param boolean $network_wide True if WPMU superadmin uses "Network Activate" action, false if WPMU is disabled or plugin is activated on an individual blog
   */
  public function deactivate( $network_wide ) {
  	// TODO define deactivation functionality here
  } // end deactivate

  /**
   * 3.4 Funkcija "register_admin_styles" - ubacuje CSS koji se nalazi u css/admin.css folderu
   */
  public function register_admin_styles() {

  	wp_enqueue_style( $this->get_widget_slug().'-admin-styles', plugins_url( 'css/admin.css', __FILE__ ) );

  } // end register_admin_styles

  /**
   * 3.5 Funkcija "register_admin_scripts" - ubacuje JS koji se nalazi u js/admin.js folderu
   */
  public function register_admin_scripts() {

  	wp_enqueue_script( $this->get_widget_slug().'-admin-script', plugins_url( 'js/admin.js', __FILE__ ), array('jquery') );

  } // end register_admin_scripts

  /**
   * 3.6 Funkcija "register_widget_styles" - ubacuje CSS koji se nalazi u css/widget.css folderu
   */
  public function register_widget_styles() {

  	wp_enqueue_style( $this->get_widget_slug().'-widget-styles', plugins_url( 'css/widget.css', __FILE__ ) );

  } // end register_widget_styles

  /**
   * 3.7 Funkcija "register_widget_scripts" - ubacuje JS koji se nalazi u js/widget.js folderu
   */
  public function register_widget_scripts() {

  	wp_enqueue_script( $this->get_widget_slug().'-script', plugins_url( 'js/widget.js', __FILE__ ), array('jquery') );

  } // end register_widget_scripts
} // end class


add_action( 'widgets_init', create_function( '', 'register_widget("Prosistem_Widget");' ) );

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

192

193

194

195

196

197

198

199

200

201

202

203

204

205

206

207

208

209

210

211

212

213

214

215

216

217

218

219

220

221

222

223

224

225

226

227

228

229

230

231

232

233

234

235

236

237

238

239

240

241

242

243

244

245

246

247

248

249

250

251

252

253

254

255

256

257

258

259

260

261

262

263

264

265

266

267

268

269

270

271

272

273

274

275

276

<?php

/**

* WordPress Widget Boilerplate uz Plugin by ProSistem Studio

* @url https://github.com/tommcfarlin/WordPress-Widget-Boilerplate

* Plugin Name: @TODO

* Plugin URI: @TODO

* Description: @TODO

* Version: 1.0.0

* Author: @TODO

* Author URI: @TODO

* Text Domain: widget-name

* License: GPL-2.0+

* License URI: http://www.gnu.org/licenses/gpl-2.0.txt

* Domain Path: /lang

* GitHub Plugin URI: https://github.com/...

* UPUTSTVO:

* -------------------------------------------------------------------------

* Menjati tamo gde pise "prosistem" a dadati kod tamo gde piše "dodati_kod"

/**

* Sadrzaj klase:

* ----------------------

* 1. Osnovna setovanja

* 1.1 Definise se ime slug-a widgeta

* 1.2. Funnkcija "get_widget_slug()" - vraca definisani widget slug za korišcenje unutar naše custom klase

* 1.3 __construct

* 1.3.1 Kaci na udicu funkciju "widget_textdomain" iz dela "Pomocne funkcije"

* 1.3.2 Registruje udice za funkcije: "activate()" i "deactivate()" iz dela "Pomocne funkcije"

* 1.3.3 Funkcija "parent::__construct"

* Inicira pojavljivanje widget-a u admin stranici zajedno sa standardnim widget-ima.

* Pravi: ID widgeta, naziv widgeta, opis widgeta (dok čeka da se prevuce), naziv CSS klase

* 1.3.4 Kaci na udicu funkcije: "register_admin_styles()" i "register_admin_scripts()" iz dela 3. Public function

* 1.3.5 Kaci na udicu funkcije: "register_widget_styles" i "register_widget_scripts" iz dela 3. Public function

* 1.3.6 Kaci na razlicite udice 2.2 funkciju "flush_widget_cache()"

* 2. API funkcije ( Stampa sadrzaj widget-a)

* 2.1 Funkcija "widget()" - stampa sadrzaj widgeta

* 2.1.1 Deo vezan za keširanje

* 2.1.2 Pravi promenjive od niza unetih podataka (elemenata forme) preko parametra funkcije $args

* 2.1.3 Štampanje izgleda widgeta

* 2.2 Funkcija "flush_widget_cache" - vezana za brisanje kesiranja

* 2.3 Funkcija "update" - aktivira se svaki put kad stisnemo "save" widget u back-endu. Uneti podatak čuva i ispisuje ga u formi i nakon "save".

* Unutar ove funkcije se paralelno radi i "validation" i "sanitize" unetih podataka.

* 2.4 Funkcija "form" - stampa widget formu kada se prevuce u widget oblast u okviru Admin stranice

* 3. Pomocne funkcije

* 3.1 Funkcija "widget_textdomain" - ucitava Widget's text domain za localizaciju i prevodjenje.

* 3.2 Funkcija "activate" - aktivira logiku widget-a kada je aktivan widget

* 3.3 Funkcija "deactive" - deaktivir logiku widget-a kada se iskljuci widget

* 3.4 Funkcija "register_admin_styles" - ubacuje CSS koji se nalazi u css/admin.css folderu

* 3.5 Funkcija "register_admin_scripts" - ubacuje JS koji se nalazi u js/admin.js folderu

* 3.6 Funkcija "register_widget_styles" - ubacuje CSS koji se nalazi u css/widget.css folderu

* 3.7 Funkcija "register_widget_scripts" - ubacuje JS koji se nalazi u js/widget.js folderu

// Prevent direct file access

if ( ! defined ( 'ABSPATH' ) ) {

exit;

}

* TODO: Definisati ime widgeta

class Prosistem_Widget extends WP_Widget {

/*--------------------------------------------------*/

/* 1. Osnovna setovanja

/*--------------------------------------------------*/

//1.1 Definiše se ime slug-a widget-a

protected $widget_slug = 'prosistem_widget';

// 1.2. Return the widget slug.

/**

* @return string - ime widget slug-a koji smo mi prethodno definisali

public function get_widget_slug() {

return $this->widget_slug;

}

public function __construct() {

// 1.3.1 Kaci na udicu funkciju pod brojem 3.1 iz dela "Pomocne funkcije"

add_action( 'init', array( $this, 'widget_textdomain' ) );

// 1.3.2 Registruje udice za funkcije: "activate()" i "deactivate()" iz dela "Pomocne funkcije"

register_activation_hook( __FILE__, array( $this, 'activate' ) );

register_deactivation_hook( __FILE__, array( $this, 'deactivate' ) );

//1.3.3 Daje vrednosti promenjivama metode roditeljske klase

parent::__construct(

$this->get_widget_slug(), // $id_base - iz superklase

__( 'Prosistem Widget', $this->get_widget_slug() ), // $name - iz superklase

array( // $widget_options - iz superklase

'classname' => $this->get_widget_slug().'-class', // naziv CSS klase

'description' => __( 'Prosistem kratak opis widget-a.', $this->get_widget_slug() ) //Opis widget-a

)

);

// 1.3.4 Kaci na udicu funkcije: "register_admin_styles()" i "register_admin_scripts()" iz dela 3. Public function

add_action( 'admin_print_styles', array( $this, 'register_admin_styles' ) );

add_action( 'admin_enqueue_scripts', array( $this, 'register_admin_scripts' ) );

// 1.3.5 Kaci na udicu funkcije: "register_widget_styles" i "register_widget_scripts" iz dela 3. Public function

add_action( 'wp_enqueue_scripts', array( $this, 'register_widget_styles' ) );

add_action( 'wp_enqueue_scripts', array( $this, 'register_widget_scripts' ) );

// 1.3.6 Kaci na razlicite udice funkciju "flush_widget_cache()" iz dela 3. Pomocne funkcije

add_action( 'save_post', array( $this, 'flush_widget_cache' ) );

add_action( 'deleted_post', array( $this, 'flush_widget_cache' ) );

add_action( 'switch_theme', array( $this, 'flush_widget_cache' ) );

} // end 1. Constructor

/*--------------------------------------------------*/

/* 2. Widget API

/*--------------------------------------------------*/

/**

* 2.1 Funkcija "widget" stampa sadrzaj widgeta

* @param array $args - niz elemenata forme

* @param array $instance - trenutna instanca widgeta

* @return int

public function widget( $args, $instance ) {

// 2.1.1 Deo vezan za Keširanje - Check if there is a cached output

$cache = wp_cache_get( $this->get_widget_slug(), 'widget' );

if ( !is_array( $cache ) )

$cache = array();

if ( ! isset ( $args['widget_id'] ) )

if ( isset ( $cache[ $args['widget_id'] ] ) )

return print $cache[ $args['widget_id'] ];

// 2.1.2 Pravi promenjive od niza unetih podataka (elemenata forme) preko parametra funkcije $args (Pravi $before_widget, $after_widget)

extract( $args, EXTR_SKIP );

// 2.1.3 Štampanje izgleda widgeta. U ovom delu je logika koja manipulise sa vrednostima koje se dobijaju preko input polja forme

$widget_string = $before_widget;

ob_start();

//TODO: dodati_kod - ovde ide deo vezan za štapanje moze da se koriste funkcije "ob_start() i ob_get-clean()" kao sto je poceto ili da se obriše i zatim jednostavna konkatenacija stringa

$widget_string .= ob_get_clean();

$widget_string .= $after_widget;

// drugi deo dela vezanog za kesiranje

$cache[ $args['widget_id'] ] = $widget_string;

wp_cache_set( $this->get_widget_slug(), $cache, 'widget' );

print $widget_string;

} // end function "widget"

// 2.2 funkcija za brisanje keširanja

public function flush_widget_cache()

{

wp_cache_delete( $this->get_widget_slug(), 'widget' );

}

/**

* 2.3 Funkcija "upadate" aktivira se svaki put kad stisnemo "save" widget u back-endu.

* Unutar ove funkcije se paralelno radi i "validation" i "sanitize" unetih podataka.

* @param array $new_instance - nova vrednost instance generisana via the update.

* @param array $old_instance Prethodna vrednost instance pre update.

* @return array $instance - update-ovanu i validiranu instancu

public function update( $new_instance, $old_instance ) {

$instance = $old_instance;

// TODO: dodati-kod koji obicno radi validaciju vrednosti unetih preko forme ($new_instance)

return $instance;

} // end Function "update"

/**

* 2.4 Back-end widget forma.

* @param array $instance The array of keys and values for the widget.

public function form( $instance ) {

// TODO: dodati_kod koji definise niz "$defaults" sa defaultnim vrednostima widgeta

// Rasclanjuje $instance u niz i pridodaje default-ne vrednosti definisane u nizu $defaults

$instance = wp_parse_args(

(array) $instance,

$defaults

);

// TODO: Store the values of the widget in their own variable

// Display the admin form

include( plugin_dir_path(__FILE__) . 'views/admin.php' );

} // end Function "form"

/*---------------------------------------------------------------------------------------------*/

/* 3. Pomocne funkcije

/*---------------------------------------------------------------------------------------------*/

/**

* 3.1 Funkcija "widget_textdomain" - ucitava Widget's text domain za localizaciju i prevodjenje iz foldera "lang"

public function widget_textdomain() {

// TODO be sure to change 'widget-name' to the name of *your* plugin

load_plugin_textdomain( $this->get_widget_slug(), false, plugin_dir_path( __FILE__ ) . 'lang/' );

} // end widget_textdomain

/**

* 3.2 Funkcija "activate" - aktivira logiku widget-a kada je aktivan widget

* @param boolean $network_wide True if WPMU superadmin uses "Network Activate" action, false if WPMU is disabled or plugin is activated on an individual blog.

public function activate( $network_wide ) {

// TODO define activation functionality here

} // end activate

/**

* 3.3 Funkcija "deactive" - deaktivir logiku widget-a kada se iskljuci widget

* @param boolean $network_wide True if WPMU superadmin uses "Network Activate" action, false if WPMU is disabled or plugin is activated on an individual blog

public function deactivate( $network_wide ) {

// TODO define deactivation functionality here

} // end deactivate

/**

* 3.4 Funkcija "register_admin_styles" - ubacuje CSS koji se nalazi u css/admin.css folderu

public function register_admin_styles() {

wp_enqueue_style( $this->get_widget_slug().'-admin-styles', plugins_url( 'css/admin.css', __FILE__ ) );

} // end register_admin_styles

/**

* 3.5 Funkcija "register_admin_scripts" - ubacuje JS koji se nalazi u js/admin.js folderu

public function register_admin_scripts() {

wp_enqueue_script( $this->get_widget_slug().'-admin-script', plugins_url( 'js/admin.js', __FILE__ ), array('jquery') );

} // end register_admin_scripts

/**

* 3.6 Funkcija "register_widget_styles" - ubacuje CSS koji se nalazi u css/widget.css folderu

public function register_widget_styles() {

wp_enqueue_style( $this->get_widget_slug().'-widget-styles', plugins_url( 'css/widget.css', __FILE__ ) );

} // end register_widget_styles

/**

* 3.7 Funkcija "register_widget_scripts" - ubacuje JS koji se nalazi u js/widget.js folderu

public function register_widget_scripts() {

wp_enqueue_script( $this->get_widget_slug().'-script', plugins_url( 'js/widget.js', __FILE__ ), array('jquery') );

} // end register_widget_scripts

} // end class

add_action( 'widgets_init', create_function( '', 'register_widget("Prosistem_Widget");' ) );

Originalni kod od autora Tom McFarlina možete pogledti na njegovom github nalogu github.com/tommcfarlin/WordPress-Widget-Boilerplate/tree/master/widget-boilerplate

Podelite:

Web Programiranje

Skripte

Uvod

Osnovni kostur widget klase

Pojašnjenje funkcija unutar klase

Funkcija “__construct”

Primer

Funkcija “form”

Defaultne vrednosti u formi u vidu niza $defaults

Sjedinjenje dva niza

Forma widgeta

Dinamički elementi forme

Radio button i Check box

Dropdown meni

Sprečavanje XSS napada (eng.escaping)

Primer

Funkcija “update”

Primer

Funkcija “widget”

Šablon klase za izradu widget-a

Widget unutar plugina

Struktura plugina

Šablon Widget klase za plugin

Ostavite komentar