web-dev-qa-db-fra.com

Est-il possible de mettre en file d'attente un script à partir d'une méthode de widget (de l'objet WP_Widget étendu)?

Je crée un plug-in de widget dans lequel un utilisateur peut potentiellement utiliser plusieurs itérations du widget plusieurs fois sur une seule zone de widget/plusieurs zones de widget sur une seule page. En raison de ses fonctionnalités, il y aura différentes variables au niveau des widgets sur lesquelles j’aurai besoin de passer individuellement de PHP à JavaScript pour pouvoir prendre des mesures (via jQuery). J'ai utilisé un $widget_id pour envelopper le widget qui fonctionne très bien au niveau HTML.

Cependant, je ne parviens pas à transmettre les informations à JavaScript, du moins lorsque je tente d'utiliser wp_localize_script pour transmettre des informations au fichier JavaScript. Ma tentative pour y parvenir a été effectuée en ajoutant l'action-hook pour mettre en file d'attente le JavaScript dans la méthode du widget. Malheureusement, il semble que je ne puisse même pas obtenir le code JavaScript pour être mis en file d'attente à partir de là, et encore moins que je puisse lui transmettre des informations!

Voici ce que j'ai

class my_widget extends WP_Widget {
   private $widget_id;
   private $variable; 
   private $plugin_location;

  function my_widget() {
    parent::WP_Widget(false, $name = 'My Widget Plugin');
    $this->plugin_location = plugin_dir_url(__FILE__);
  }

  function widget($args, $instance) {   
    $this->widget_id="widget-".time().Rand(1,100).Rand(1,100); //make a unique id for widget, i know there are probably better ways to do this... but this works for now...
    extract( $args );
    $this->variable = $instance['variable'];
    add_action('wp_enqueue_scripts', array( &$this, 'plugin_scripts' ));
    echo '<div id="' . $this->widget_id . '">';
    ...
    create & output widget
    ..
    echo '</div>';
   }

   ... irrelevant widget administration functions ...
  public function plugin_scripts(){
    //here we set up & pass relevant information specific to EACH INDIVIDUAL widget (can have multiple in a single widget-area) for jQuery to execute functions & methods on to the JavaScript file
    $widget_info_to_pass = array(
      "widget_id"  =>  $this->widget_id,
      "variables"  =>  $this->variables
    );

    wp_register_script( 'my-site-script'.$this->widget_id, $this->plugin_location . "js/my.js", array('jquery'),'1.2.0');
    wp_enqueue_script( 'my-site-script'.$this->widget_id );
    wp_localize_script('my-site-script'.$this->widget_id, 'php_params', $widget_id_to_pass);
  }      

}

  add_action('widgets_init', create_function('', 'return register_widget("my_widget");'));

Cela ne met pas le script en file d'attente, je suis assez certain, car le widget ne se déclenche qu'après le passage de wp_enqueue_scripts.

Important à noter: il apparaît que pour utiliser wp_localize_script, vous devez appeler la fonction avant wp_head.

À cette note, j'ai essayé la plupart des points d'ancrage et je ne pouvais même pas avoir le script mis en file d'attente, et encore moins mis en file d'attente avant wp_head. Si je pouvais même obtenir la méthode de widget pour mettre en file d'attente un script, je pourrais en quelque sorte ajouter manuellement du code JavaScript incorporé définissant les informations pour chaque instance de widget (peut-être un tableau associatif?) - mais je ne peux pas l'obtenir pour mettre en file d'attente aucun script.

Est-il possible de mettre en file d'attente un script à partir de la méthode widget de l'objet étendu WP_Widget ou est-ce que je mène une bataille impossible à gagner ici? Est-ce que les autres façons de faire cela me manquent?

------------------- METTRE À JOUR ---------------------

Je l'ai mis à jour en utilisant vos conseils comme ceci:

class my_widget extends WP_Widget {
   private $widget_id;
   private $variable; 
   private $plugin_location;

  function my_widget() {
    parent::WP_Widget(false, $name = 'My Widget Plugin');
    $this->plugin_location = plugin_dir_url(__FILE__);
  }

  function widget($args, $instance) {   
    $this->widget_id="widget-".time().Rand(1,100).Rand(1,100); //make a unique id for widget, i know there are probably better ways to do this... but this works for now...
    extract( $args );
    $this->variable = $instance['variable'];
   //here we set up & pass relevant information specific to EACH INDIVIDUAL widget (can have multiple in a single widget-area) for jQuery to execute functions & methods on to the javascript file
    $widget_info_to_pass = array(
      "widget_id"  =>  $this->widget_id,
      "variable"  =>  $this->variable
    );
    wp_register_script( 'my-site-script'.$this->widget_id, $this->plugin_location . "js/my.js", array('jquery'),'1.2.0');
    wp_enqueue_script( 'my-site-script'.$this->widget_id );
    wp_localize_script('my-site-script'.$this->widget_id, 'php_params', $widget_id_to_pass);
    echo '<div id="' . $this->widget_id . '">';
    ...
    create & output widget
    ..
    echo '</div>';
   }

   ... irrelevant widget administration methods ...

}

  add_action('widgets_init', create_function('', 'return register_widget("my_widget");'));

Pour m'assurer que les informations appropriées sont transmises, j'ai fait en sorte que my.js contienne les éléments suivants:

widget_id = php_params.widget_id;
variable = php_params.variable;
console.log(widget_id + "---" + variable);

Malheureusement, il ne transmet à la console que le widget_id FINAL et la variable trois fois.

Une raison pour laquelle cela se produit? Avez-vous une idée de la façon de faire les itérations appropriées?

2
setterGetter

Ce n'est pas vrai que vous devez utiliser wp_localise_script avant wp_head .

Depuis la version 3.3, vous pouvez utiliser wp_enqueue_script dans le corps du document (par exemple, dans un widget ou un rappel de shortcode) et le script est chargé dans le pied de page .

Voici une classe squelette que j'ai utilisée pour ajouter des variables à chaque instance d'un widet dans un tableau, puis en utilisant wp_localise_script pour ajouter l'intégralité de ce tableau au document. Cela charge le script et les variables dans le pied de page.

D'abord enregistrez votre script sur le hook init.

class my_widget extends WP_Widget {

  static $variables=array();

  function my_widget() {
      //initialiser function
  }

  function widget($args, $instance) {   
     //Display widget

     //Then make sure our options will be added in the footer
     add_action('wp_footer', array(__CLASS__, 'add_options_to_script'));

     //Enqueue the script (registered on init)
     wp_enqueue_script( 'my_script');

     //Add the data to the (static) class variable `$variables`, using the widget ID.
     $id = $args['widget_id'];
     self::$variables[$id] = 'my variable for this instance'
   }

   //... irrelevant widget administration functions ...

  function add_options_to_script(){
       //If there is data to add, add it
       if(!empty(self::$widget_cal))
            wp_localize_script( 'my_script', 'my_var', self::$variables);   
  }      

}

  add_action('widgets_init', create_function('', 'return register_widget("my_widget");'));
1
Stephen Harris

wp_enqueue_scripts est déjà passé. mettez le script en file d'attente directement dans votre fonction de widget et exportez-le dans le pied de page.

0
Milo