Cea mai bună metodă de a include scripturi pe o anumită pagină de template

Question

Cea mai bună metodă de a include scripturi pe o anumită pagină de template

17 mar. 2012, 23:47:02

Vizualizări: 13.9K

Voturi: 2

Acesta este un subiect care m-a confuzat mereu și aș avea nevoie de ajutor.

Vreau să fac patru lucruri direct deasupra tag-ului de închidere body:

să includ jQuery (versiunea WordPress este ok)
să includ un plugin jQuery care depinde de jQuery, sub acesta
să inițializez plugin-ul direct sub acest plugin ȘI să evit problemele de conflict folosind $ în loc de jQuery
să fac asta doar pe anumite șabloane de pagini sau fișiere de temă

Înțeleg că probabil ar trebui să folosesc wp_enqueue_script, dar nu sunt sigur dacă ar trebui să-l folosesc în functions.php sau direct pe pagina unde îl doresc.

Referitor la punctul 3, am văzut soluții precum:

jQuery(function ($) {
/* Poți folosi $ în siguranță în acest bloc de cod pentru a referi jQuery */
});

Dar sunt sincer confuz în legătură cu implementarea.

Care este cea mai bună metodă de a realiza acest lucru?

Mulțumesc mult.

jw60660

1.55K

jquery wp enqueue script

Toate răspunsurile la întrebare

Comentarii

Mulțumesc pentru răspuns. Aveți vreun sfat cu privire la problema variabilei jQuery $ și utilizarea corectă a scurtăturilor pentru a ocoli această problemă? Nu sunt sigur cum să procedez. Este nevoie de această soluție doar pentru scriptul care lansează pluginul pe pagină, sau trebuie să modific și fișierul jQuery plugin care este încărcat prin enqueue?

jw60660

18 mar. 2012 01:54:04

@jw60660 Știu că a trecut ceva timp (6 ani), dar în caz că altcineva are nevoie, puteți scrie fișierul .js astfel: jQuery(document).ready(function ($) { //cod_aici }); iar cod_aici poate folosi variabila $ în loc de jQuery.

dev_masta

19 mar. 2018 17:16:36

Mulțumesc mult. Ultimul tău paragraf m-a salvat Alternativ, dacă utilizați versiunea 3.3+ și tema dumneavoastră apelează wp_footer(), atunci puteți apela pur și simplu wp_enqueue_script('my_custom_script') direct în pagina de șablon.

Shady Mohamed Sherif

14 iul. 2019 08:55:08

Comentarii

Acel articol era despre short-coduri. :D

Stephen Harris

18 mar. 2012 00:11:07

Stephen Harris 32.6K · Answer 1 · 2012-03-18T00:09:25Z

Următoarele (în fișierul functions.php al temei) vor înregistra scriptul tău și vor seta jQuery ca dependență. Astfel, atunci când îl încărci, jQuery va fi de asemenea încărcat.

function my_scripts_method() {
   // înregistrează locația scriptului, dependențele și versiunea
   wp_register_script('my_custom_script',
       get_template_directory_uri() . '/js/custom_script.js',
       array('jquery'),
       '1.0' );

}
add_action('wp_enqueue_scripts', 'my_scripts_method');

Apoi poți încărca scriptul în unul din cele două moduri. În fișierul functions.php al temei poți folosi filtrul template_include pentru a obține template-ul folosit utilizând is_page_template()

add_filter( 'template_include', 'my_load_script_for_template', 1000 );
function my_load_script_for_template( $template ){
     if(is_page_template('my-template.php'))
        wp_enqueue_script('my_custom_script');

return $template;
}

Alternativ, dacă folosești WordPress 3.3+ și tema ta apelează wp_footer(), atunci poți apela direct wp_enqueue_script('my_custom_script') în interiorul paginii de template.

Jeremy Jared 3.36K · Answer 2 · 2012-03-18T00:04:22Z

Nu sunt sigur că este încă (sau a fost vreodată) "cea mai bună metodă", deoarece nu am avut timp să verific cele mai recente actualizări de dezvoltare, dar voi începe prin a posta cum o fac eu:

function my_slider_script() {
  if ( !is_page_template( 'slider.php' ) )
  return;
    wp_enqueue_script('jquery-ui-core');
    wp_enqueue_script('jquery-ui-tabs');
    wp_enqueue_script( 'my_rotator_script', get_template_directory_uri() . '/js/photo_rotator_tabs.js', array('jquery'));
  }
add_action( 'template_redirect', 'my_slider_script' )

Primele două folosesc JavaScript inclus în WordPress, iar 'my_rotator_script' este un script pe care l-am inclus în folderul template-ului meu, într-un folder js în rădăcina temei, numit photo_rotator_tabs.js. Acesta este inclus doar pe paginile care folosesc șablonul de pagină slider.php.

Cred că Scribu a scris un articol foarte detaliat pe această temă, dar nu îmi amintesc linkul. Cred că el folosește metoda wp_print_scripts, sau metoda "WordPress Ninja". Poate că el te va ajuta dacă metoda mea este depășită.