it-swarm.com.de

Wie werden Bootstrap- und JQuery-Javascripts ordnungsgemäß hinzugefügt?

Ich entwickle mein WordPress-Theme mit Material Bootstrap Design (MDB), einer Materialvariante, die Bootstrap 4 plus eigenen Code verwendet.

Es ruft auf mit den folgenden Skripten ...

<!-- JQuery -->
<script type="text/javascript" src="/wp-content/themes/blankslate/mdb/js/jquery-2.2.3.min.js"></script>

<!-- Bootstrap tooltips -->
<script type="text/javascript" src="/wp-content/themes/blankslate/mdb/js/tether.min.js"></script>

<!-- Bootstrap core JavaScript -->
<script type="text/javascript" src="/wp-content/themes/blankslate/mdb/js/bootstrap.min.js"></script>

<!-- MDB core JavaScript -->
<script type="text/javascript" src="/wp-content/themes/blankslate/mdb/js/mdb.min.js"></script>

Ich hatte diese einfach unten in meinen footer.php eingefügt. Aber jetzt habe ich gelesen, dass ich Javascripts ordnungsgemäß zu WordPress hinzufügen soll, dh durch Anstehen.

Bisher habe ich das benutzt ...

// Add Javascripts for my Bootstrap theme
function bootstrap_scripts_with_jquery()
{
    // Register the script like this for a theme:
    wp_enqueue_script( 'bootstra-jquery', get_stylesheet_directory_uri() . '/mdb/js/jquery-2.2.3.min.js', array( 'jquery' ) );
    wp_enqueue_script( 'bootstrap-jquery-min', get_stylesheet_directory_uri() . '/mdb/js/jquery.min.js' );
    wp_enqueue_script( 'bootstrap', get_stylesheet_directory_uri() . '/mdb/js/bootstrap.min.js' );
    wp_enqueue_script( 'bootstrap-material', get_stylesheet_directory_uri() . '/mdb/js/mdb.min.js' );
}
add_action( 'wp_enqueue_scripts', 'bootstrap_scripts_with_jquery' );
// http://stackoverflow.com/questions/26583978/how-to-load-bootstrap-script-and-style-in-functions-php-wordpress

Dies funktioniert bis zu einem gewissen Punkt - es fügt dem Code meine vier Zeilen hinzu (obwohl ich nicht weiß, ob dies auf diese Weise einen Unterschied macht).

In meinem Header werden jedoch auch zwei verbleibende/standardmäßige JS-Zeilen angezeigt, die ich nicht hinzugefügt habe ...

<script type='text/javascript' src='http://www.example.com/wp-includes/js/jquery/jquery.js?ver=1.12.4'></script>
<script type='text/javascript' src='http://www.example.com/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.4.1'></script>
<script type='text/javascript' src='http://www.example.com/wp-content/themes/blankslate/mdb/js/jquery-2.2.3.min.js?ver=4.6.1'></script>
<script type='text/javascript' src='http://www.example.com/wp-content/themes/blankslate/mdb/js/jquery.min.js?ver=4.6.1'></script>
<script type='text/javascript' src='http://www.example.com/wp-content/themes/blankslate/mdb/js/bootstrap.min.js?ver=4.6.1'></script>
<script type='text/javascript' src='http://www.example.com/wp-content/themes/blankslate/mdb/js/mdb.min.js?ver=4.6.1'></script>

Und ich sehe diese Zeile immer noch in der Fußzeile, obwohl ich sie nicht hinzugefügt habe (ich glaube, ich möchte das hier lassen, oder?) ...

<script type='text/javascript' src='http://www.example.com/wp-includes/js/wp-embed.min.js?ver=4.6.1'></script>

Die Hauptfrage ist dann: Wie soll ich damit umgehen, dass WordPress jquery.js?ver=1.12.4 und jquery-migrate.min.js?ver=1.4.1 enthält, wenn mein Thema sie nicht fordert? Gibt es hier einen Konflikt? Wenn die WordPress-eigene JQuery durch Übergabe einer Versionsnummer bedient wird, kann ich sie möglicherweise zwingen, Version 2.2.3 zu verwenden, wie von meinem Thema gefordert? Und was ist mit dieser "migrieren" -Version?

Mir ist bekannt, dass Sie Skripte aus der Warteschlange entfernen können, und ich habe gelesen, dass Sie eine benutzerdefinierte Version mithilfe eines Filters erzwingen könnenoder ähnliches . Aber ich habe auch gelesen, dass Sie nicht daran herumspielen sollten, die Standardversion von WordPress von JQuery zu entfernen.

Ich bin verwirrt.

Und muss ich CSS in die Warteschlange stellen?

2
Robert Andrews

WordPress lädt jQuery, da Plugins und Themes davon ausgehen, dass dies der Fall ist. Wenn Sie eine andere Version von jQuery für Ihr Design wünschen, besteht die Gefahr, dass die von Ihnen verwendeten Plugins nicht funktionieren, da sie (wenn sie gut gepflegt werden) so ausgelegt sind, dass sie mit der Standard-jQuery funktionieren.

Das heißt, wenn Sie darauf bestehen, Ihre eigene Version von jQuery zu verwenden, können Sie diese einfach abmelden, wie Sie herausgefunden haben. Wenn Sie keine öffentliche Veröffentlichung Ihres Themas planen, können Sie die Konsequenzen steuern.

Und ja, Sie sollten Stile einreihen auch. Der Grund dafür ist, dass Sie damit Abhängigkeiten festlegen können. Dies ist wichtig, wenn Sie beispielsweise ein untergeordnetes Thema erstellen und die Registrierung der übergeordneten Stile aufheben möchten.

1
cjbj

Vielleicht ist das ja gar keine so große WordPress-Frage. Aber soweit ich gesehen habe, funktioniert das Bootstrap 4 mit jQuery 1.2.0. Getestet von Simon Padburys Bootstrap 4 Starter Theme für WordPress, das WordPress auf der (vorregistrierten) jQuery in die Warteschlange stellt.

https://github.com/SimonPadbury/b4st/blob/master/functions/enqueues.php

0
Jesper Nilsson