Wie kann ich JavaScript-Dateien im untergeordneten Design überschreiben?


35

Ich lade einige JavaScript-Dateien im übergeordneten Design. Der Pfad im übergeordneten Thema lautet:

scripts > custom.js

Im untergeordneten Thema erstelle ich denselben Pfad ( scripts > custom.js) und ändere einige der jQuery-Elemente in der custom.jsDatei.

Das Problem ist, dass die Änderungen nicht übernommen werden. Ist dies der falsche Weg, um Änderungen an diesen Dateien im untergeordneten Design vorzunehmen?


1
Was ist das übergeordnete Thema? Wie werden die Skripte vom übergeordneten Theme aufgerufen ?
Chip Bennett

Antworten:


51

Untergeordnete Designs überschreiben nur PHP-Dateien (wie header.php), die in Funktionen wie get_template_part oder get_header usw. enthalten sind.

Der richtige Weg, um Skripte zu WordPress hinzuzufügen, ist mit wp_enqueue_script . Wenn Ihr übergeordnetes Thema dies verwendet, können Sie die JS-Dateien mit wp_dequeue_script überschreiben und Ihre eigenen in die Warteschlange stellen.

Wie so ...

<?php
// hook in late to make sure the parent theme's registration 
// has fired so you can undo it. Otherwise the parent will simply
// enqueue its script anyway.
add_action('wp_enqueue_scripts', 'wpse26822_script_fix', 100);
function wpse26822_script_fix()
{
    wp_dequeue_script('parent_theme_script_handle');
    wp_enqueue_script('child_theme_script_handle', get_stylesheet_directory_uri().'/scripts/yourjs.js', array('jquery'));
}

Wenn das übergeordnete Design nicht wp_enqueue_script verwendet, wird es wahrscheinlich in wp_head (oder wp_footer) eingebunden, um die Skripte dort auszugeben. Sie würden also remove_action verwenden , um diese Funktionen zu entfernen , die die Skripte wiedergeben, und dann Ihr eigenes Skript in die Warteschlange stellen.

Wenn das Skript in der Vorlagendatei fest programmiert ist, müssen Sie diese Vorlagendatei nur in Ihrem untergeordneten Design ohne das Skript-Tag ersetzen.

Wenn sie wp_enqueue_script-Aufrufe verwenden, die get_stylesheet_directory_uri verwenden , sollten Sie nichts tun müssen. Da dies nicht geschieht, müssen Sie nur herumstöbern und sehen, was der Autor des Themas getan hat.


2
wenn die Mutter Thema Verwendungen enqueue Skripte get_stylesheet_directory_uri, dann wird das Kind Thema haben , um alle Skripte zu duplizieren damit die Warteschlange eingereiht, weil sonst woun't sie gefunden werden. Es gibt keinen Fallback-Mechanismus in get_stylesheet_directory_uri, mit dem überprüft werden kann, ob eine einzelne Datei im untergeordneten Design vorhanden ist, und bei Bedarf auf die Datei des übergeordneten Designs zurückgegriffen werden kann.

Aus dem Codex: „wp_print_scripts sollten nicht zum Einreihen von Stilen oder Skripten auf der Titelseite verwendet werden. Verwenden Sie stattdessen wp_enqueue_scripts. ” Codex.wordpress.org/Plugin_API/Action_Reference/…
Christian Lescuyer

Denken Sie daran, wann dies geschrieben wurde: vor zwei Jahren. Vorher wp_enqueue_scriptskonnte verwendet werden, um nur Skripts auf dem Front-End in die Warteschlange zu stellen. Aktualisiert. Wenn Sie feststellen, dass etwas veraltet ist, können Sie es jederzeit bearbeiten.
Chrisguitarguy

4
Beachten Sie, dass Sie möglicherweise eine verspätete Priorität festlegen müssen (z. B. 100), um sicherzustellen, dass die Löschung nach der Enqueue des übergeordneten Themas erfolgt. add_action( 'wp_enqueue_scripts', 'wpse26822_script_fix', 100 ); von codex.wordpress.org/Function_Reference/wp_dequeue_script
Spone

4
Update für 2016: Laut stackoverflow.com/questions/23507179/… müssen wir auch verwenden wp_deregister_script('parent-script-handle');, um das übergeordnete Skript vollständig zu entfernen. In der Tat hat es ohne mich nicht funktioniert. WP 4.6.1
PhiLho

1

In einigen Fällen ist es wichtig, die Funktionsaufrufe add_action und wp_enqueue_script wie folgt zu priorisieren:

add_action('wp_enqueue_scripts', 'wpse26822_script_fix', 20120207);
function wpse26822_script_fix()
{
    wp_dequeue_script('storefront-navigation');
    wp_enqueue_script('my_storefront-navigation', get_stylesheet_directory_uri().'/js/navigation.min.js', array('jquery'),20151110,true);
}

In diesem Fall wurde wp_enqueue_scripts vom übergeordneten Element mit einer Priorität von 20120206 (dem Datum) aufgerufen. Daher wird diese Aktion mit einer Priorität hinzugefügt, die kaum höher ist, sodass sie sofort aus der Warteschlange entfernt wird. Anschließend wird die folgende Enqueue-Anweisung tatsächlich priorisiert, um sicherzustellen, dass sie geladen wird, nachdem die alte Anweisung aus der Warteschlange entfernt wurde. Das true ist in diesem Fall auch wichtig, da dies angibt, dass es in die Fußzeile eingereiht werden soll, in der das übergeordnete Skript zuerst eingereiht wurde.

Ich kann es auch nicht ganz erklären, aber ich stelle fest, dass Sie das Laden des ersten Skripts anfangs effektiv verhindern können, wenn Sie vorsichtig sind, das erste Skript unmittelbar nach dem Einreihen aus der Warteschlange zu entfernen.


1
Die Funktion wp_enqueue_scripthat keinen Prioritätsparameter, sondern nur eine Versionsnummer, die als Abfragezeichenfolge an das Ende des Pfads angehängt wird. Dieser Parameter wird verwendet, um sicherzustellen, dass die richtige Version unabhängig vom [...] Caching an den Client gesendet wird
Emile Bergeron,

1

Rufen Sie wp_deregister_script auf, bevor Sie Ihre eigene Version registrieren


1
Warum? Dies ist nur erforderlich, wenn Sie denselben Griff verwenden - etwas, das Sie nicht tun müssen. Das sollten Sie wahrscheinlich auch nicht, da es einfacher ist, Code zu debuggen, dessen Quelle klar ist.
fuxia

1
// enqueue your required script file
add_action('wp_enqueue_scripts', 'your_child_theme_js_file_override');
function your_child_theme_js_file_override(){
    wp_enqueue_script( 'child_theme_script_handle', get_stylesheet_directory_uri() . '/assets/js/your-file.js', array('jquery' ) );
}

// dequeue your required script file
function your_child_theme_js_file_dequeue() {
   wp_dequeue_script( 'parent_theme_script_handle' );
}
add_action( 'wp_print_scripts', 'your_child_theme_js_file_dequeue', 100 );
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.