Cum să forțezi încărcarea jQuery ca primul script în header în frontend?
Cum să forțez jQuery să se încarce ca primul script în header?
Momentan este ultimul ;( așa:
<link type="text/css" rel="stylesheet" href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/css/bootstrap-combined.min.css" />
<link type="text/css" rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/jquery.selectboxit/3.6.0/jquery.selectBoxIt.css" />
<link type="text/css" rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/themes/base/jquery-ui.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery.selectboxit/3.6.0/jquery.selectBoxIt.min.js"></script>
<script type='text/javascript' src='http://localhost/wp-includes/js/jquery/jquery.js?ver=1.8.3'></script>
iar eu vreau să fie în această ordine:
<script type='text/javascript' src='http://localhost/wp-includes/js/jquery/jquery.js?ver=1.8.3'></script>
<link type="text/css" rel="stylesheet" href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/css/bootstrap-combined.min.css" />
<link type="text/css" rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/jquery.selectboxit/3.6.0/jquery.selectBoxIt.css" />
<link type="text/css" rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/themes/base/jquery-ui.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery.selectboxit/3.6.0/jquery.selectBoxIt.min.js"></script>
Iar header-ul meu arată astfel:
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>" />
<meta name="viewport" content="width=device-width" />
<title><?php wp_title( '|', true, 'right' ); ?></title>
<link rel="profile" href="http://gmpg.org/xfn/11" />
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
<?php // Încarcă fișierul JavaScript HTML5 pentru suport în versiuni mai vechi de IE ?>
<!--[if lt IE 9]>
<script src="<?php echo get_template_directory_uri(); ?>/js/html5.js" type="text/javascript"></script>
<![endif]-->
<?php wp_enqueue_script("jquery"); ?>
<link type="text/css" rel="stylesheet" href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/css/bootstrap-combined.min.css" />
<link type="text/css" rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/jquery.selectboxit/3.6.0/jquery.selectBoxIt.css" />
<link type="text/css" rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/themes/base/jquery-ui.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery.selectboxit/3.6.0/jquery.selectBoxIt.min.js"></script>
<?php wp_head(); ?>
</head>

Trebuie să setezi variabila de dependințe a funcției wp_enqueue_script()
pentru a include jQuery, jQuery UI core și orice alte componente din jQuery UI de care ai nevoie. Nu ar trebui să le adaugi prin CDN-uri externe. Pentru fiabilitate și compatibilitate, folosește bibliotecile încorporate în WordPress dacă este posibil. Dacă o bibliotecă nu este încorporată, adaug-o în directorul temei tale.
De asemenea, nu ar trebui să adaugi niciun script sau stil în header.php. Folosește o funcție legată de acțiunea wp_enqueue_scripts
în functions.php pentru a face acest lucru.
Poți vedea lista de biblioteci încorporate și înregistrate automat de WordPress, precum și identificatorii (handles) lor la:
EDIT: Nu pot recomanda suficient acest articol pentru a înțelege cum să adaugi scripturi în teme în mod corect.

Tot JavaScript-ul care este încorporat corect va fi adăugat în header exact în punctul unde tu, sau designerul temei, ați inclus wp_head()
.
În mod ideal, ar trebui să încorporezi și scripturile tale personalizate în același mod și să le faci dependente de jQuery - WordPress le va încărca apoi în mod natural după jQuery.
Dacă totuși vrei (așa cum presupun că faci acum) să incluzi JS manual în header, atunci fă-o simplu după wp_head()
, dacă JS-ul depinde de jQuery.

De ce să folosești hook-ul wp_head? Întreaga logică a dependențelor presupune că folosești wp_enqueue_scripts? Nu văd niciun avantaj în utilizarea wp_head în loc să faci lucrurile corect.

@JPollock: Desigur, există un hook numit wp_head
. Dar nu am recomandat niciodată să-l folosești. Când te conectezi la wp_enqueue_scripts
- unde crezi că vor fi incluse scripturile în tema? --> Unde au fost plasate tag-urile de șablon wp_head()
sau wp_footer()
(observă parantezele după numele funcției)... --> Încearcă să folosești wp_enqueue_script()
în timp ce elimini wp_head()
din header.php - vei realiza că nu funcționează.
