Wie man JavaScripts in ein Plugin einreiht


14

Dieses Mal habe ich große Probleme damit, JavaScript-Dateien in den Plugin-Ordner aufzunehmen.

Ich versuche ein Plugin zu erstellen, indem ich Widget-Dateien aus dem Themes-Verzeichnis übertrage. Ich habe die Widget-Datei kopiert, aber diese Widget-Datei hing von einer JavaScript-Datei ab, also habe ich einen / js / -Ordner im Plugin-Verzeichnis erstellt. wo diese Dateien gehostet werden "jquery.repeatable.js"

Ich habe diesen Code verwendet, aber er scheint die js-Datei nicht zu enthalten.

function Zumper_widget_enqueue_script()
{   
    wp_enqueue_script( 'my_custom_script', plugin_dir_url( __FILE__ ) . 'js/jquery.repeatable.js' );
}
add_action('admin_enqueue_scripts', 'Zumper_widget_enqueue_script');

Ich habe dies auf Forum- /programming/31489615/call-a-js-file-from-a-plugin-directory gesucht

Trotzdem war das nicht hilfreich.

Ich fasse meine Frage noch einmal zusammen. In meinem Plugin-Verzeichnis befindet sich eine js-Datei unter diesem Ordner - / js /

Ich möchte angeben, was der richtige Vorgang ist. Muss ich auch etwas registrieren?

Stimmt etwas mit dieser Portion nicht - 'admin_enqueue_scripts'?


Antworten:


28

Ihr Code scheint korrekt zu sein, aber das Skript wird nur im Administrationsbereich geladen, da Sie das Skript in admin_enqueue_scriptsAktion in die Warteschlange stellen .

Verwenden Sie zum Laden des Skripts im Frontend die wp_enqueue_scriptsAktion (die nicht mit der wp_enqueue_script()Funktion identisch ist ):

function Zumper_widget_enqueue_script() {   
    wp_enqueue_script( 'my_custom_script', plugin_dir_url( __FILE__ ) . 'js/jquery.repeatable.js' );
}
add_action('wp_enqueue_scripts', 'Zumper_widget_enqueue_script');

Außerdem scheint dieses Skript von jQuery abhängig zu sein, daher sollten Sie deklarieren, dass dependencie oder das Skript vor jQuery geladen werden können und nicht funktionieren. Außerdem empfehle ich dringend, die Version des Scripots zu deklarieren. Auf diese Weise lädt der Browser das Skript, wenn Sie es auf eine neue Version aktualisieren, erneut herunter und verwirft die Kopie, die sich möglicherweise im Cache befindet.

Wenn die Version des Skripts beispielsweise 1.0 lautet:

function Zumper_widget_enqueue_script() {   
    wp_enqueue_script( 'my_custom_script', plugin_dir_url( __FILE__ ) . 'js/jquery.repeatable.js', array('jquery'), '1.0' );
}
add_action('wp_enqueue_scripts', 'Zumper_widget_enqueue_script');

Wenn Sie es im Admin-Bereich laden möchten:

function Zumper_widget_enqueue_script() {   
    wp_enqueue_script( 'my_custom_script', plugin_dir_url( __FILE__ ) . 'js/jquery.repeatable.js', array('jquery'), '1.0' );
}
add_action('admin_enqueue_scripts', 'Zumper_widget_enqueue_script');

1

AKTUALISIERT:

Verwenden Sie stattdessen diesen Code

function Zumper_widget_enqueue_script()
{   
    wp_enqueue_script( 'my_custom_script', plugin_dir_url( __FILE__ ) . 'js/jquery.repeatable.js', array('jquery'), '1.0.0', false );
}
add_action('admin_enqueue_scripts', 'Zumper_widget_enqueue_script');

Der dritte Parameter deklariert die Abhängigkeit und der vierte Parameter definiert die Version.

5. Parameter von wp_enqueue_script()bis einstellen true. Das heißt, diese Datei wird in die Fußzeile geladen.


Der dritte Parameter von wp_enqueue_script()ist, die Skriptabhängigkeiten zu deklarieren. Der fünfte Parameter ist derjenige, der ausgewählt wird, ob Sie das Skript in die Fußzeile oder in die Kopfzeile laden möchten. Wie auch immer, ich glaube nicht, dass der Ort, an dem geladen wird, einen Unterschied macht.
Cybmeta

Vielen Dank. Ich habe irgendwo in einem anderen Plugin gelesen, dass jemand so vorgeht - wp_enqueue_script ('zumper', get_template_directory_uri (). '/Js/jquery.zumper.min.js',array('jquery'),false,true); Sie sagten, wenn Sie den 3. Platz auf true setzen, wird dies in die Fußzeile geladen. Was bedeutet dann diese falsche, wahre Kombination?
Das WP Intermediate

Ich habe meine Antwort aktualisiert. Funktioniert es?
mukto90

1

Normalerweise verwende ich die Methode plugins_url () , um Enqueue zu erreichen.

function Zumper_widget_enqueue_script()
{   
    wp_enqueue_script( 'my_custom_script', plugins_url('js/jquery.repeatable.js', __FILE__ ), '1.0.0', false );
}
add_action('admin_enqueue_scripts', 'Zumper_widget_enqueue_script');
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.