it-swarm.com.de

Wie kann ich ein Skript einreihen, wenn das Widget auf der Seite angezeigt wird?

Ich habe ein Widget erstellt, das ein jquery-Plugin verwendet, und ich habe is_active_widget verwendet, um das Skript in die Warteschlange zu stellen. Es funktioniert einwandfrei, schließt das Skript jedoch auch auf Seiten ein, auf denen dieses Widget nicht angezeigt wird. Gibt es eine Möglichkeit, das Skript nur dann in die Warteschlange zu stellen, wenn dieses Widget angezeigt wird?

danke im Voraus.

8
Pierre

Sie sollten in der Lage sein, wp_enqueue_script() als Teil Ihrer Widget-Ausgabe aufzurufen.

Bearbeiten

Schnell und schmutzig, mit dem Bare-Bones Widgets API Klassenbeispiel:

<?php
class wpse48337_Widget extends WP_Widget {

    public function __construct() {
        // widget actual processes
    }

    public function form( $instance ) {
        // outputs the options form on admin
    }

    public function update( $new_instance, $old_instance ) {
        // processes widget options to be saved
    }

    public function widget( $args, $instance ) {
        // outputs the content of the widget
    }

}
register_widget( 'wpse48337_Widget' );
?>

Füge deine wp_enqueue_script() call inline in die output - deines Widgets ein, d. H. In die public function widget():

<?php    
    public function widget( $args, $instance ) {
        // outputs the content of the widget

    // Enqueue a script needed for
    // the Widget's output
    wp_enqueue_script( 'jquery-pluginname', $path, $deps );

    // Rest of widget output goes here...
    }
?>
10
Chip Bennett

Wenn das Skript in den Abschnitt <head> verschoben werden muss:

class Your_Widget extends WP_Widget{

  protected static $did_script = false;

  function __construct(){

    // parent::__construct() ...

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

  }

  function scripts(){

    if(!self::$did_script && is_active_widget(false, false, $this->id_base, true)){
      wp_enqueue_script('your-script');
      self::$did_script = true;
    }           

  }


}

Andernfalls kann die Lösung von Chip Bennett zum Einreihen in die Fußzeile verwendet werden.

Die statische Variable $did_script ist nicht erforderlich. Ich habe sie nur verwendet, um weitere unnötige Aufrufe von wp_enqueue_script zu vermeiden, wenn mehrere Widget-Instanzen auf der Seite vorhanden sind.

6
onetrickpony

Pierre,

Ich gehe mit wp_enqueue_script und wp_dequeue_script um und verwende eine Instanzvariable $is_active in der Klasse Your_Widget

Führen Sie also den wp_enqueue_script basierend auf is_active_widget aus, der das Skript auf allen Seiten in die Warteschlange stellt, wobei der Parameter footer auf true festgelegt ist. Beachten Sie, dass die Löschung mit einer Priorität ausgeführt wird, um sicherzustellen, dass sie ausgeführt wird, bevor die Skripte ausgegeben werden.

function enqueue_scripts() {
  if ( is_active_widget( false, $this->id, $this->id_base, true ) ) {
    wp_enqueue_script( 'your-script-handle', 'your-script-url', array(), '1.0', true );
    add_action( 'wp_footer', array($this,'dequeue_redundant_scripts'), 1 );
  }

}

Geben Sie dann in der Widget-Funktion an, ob das Widget auf dieser Seite aktiv ist

function widget( $args, $instance ) {
    // outputs the content of the widget
    $this->is_active = true;  
}

Dann in der Fußzeile das Skript entfernen, wenn das Widget auf dieser Seite nicht aktiv ist

function dequeue_redundant_scripts() {
    if (! $this->is_active) {
        wp_dequeue_script('your-script-handle');
    }
}

Dieser Ansatz, die Warteschlange zu entfernen, wenn sie nicht verwendet wird, funktioniert auch für Plugins, die Shortcodes definieren, für die Skripte erforderlich sind

2

Ich habe den Haken 'wp_footer' in Betracht gezogen, da dieser Haken in der Fußzeile ausgeführt wird und wahrscheinlich die beste Möglichkeit ist, Skripte nur dort hinzuzufügen, wo das Widget verwendet wird.

class Your_Widget extends WP_Widget{

    function widget( $args, $instance ) {

         add_action('wp_footer',array($this,'front_end_scripts'));

    }

    function front_end_scripts(){
       ?><script type="text/javascript">
          console.log('this works!');
        /*
          Or if you need external scripts then you may use 
          $.getScript([your-script-url] );
        */
        </script> <?php
    }



}
0
Dipesh KC