Přidání javascriptu a externího stylu do šablony – správný způsob

Pracujete na nové šabloně a potřebujete do ní přidat například fancybox? Není nic jednoduššího, než nahrát složku do šablony a pak nalinkovat z head.php potřebné soubory. Jak postupně pracujete webem, přidáváte nové a nové pluginy, až zničeho nic, přestane fancybox fungovat.

WordPress totiž přidává potřebné externí styly a js soubory pomocí wp_head(), je to doporučený způsob a při více použitých scriptech, jak je u moderních šablon běžné, jediný možný, jak si udržet kontrolu nad případnými konflikty. Pro vložení stylů a js scriptu u výše zmíněného fancyboxu použijeme funkce wp_enqueue_style() a wp_enqueue_script().

Do souboru functions.php vložíme následující řádky:

function my_eneque() {
    wp_register_style( 'fancybox', get_template_directory_uri() 
    . '/fancybox/jquery.fancybox-1.3.4.css' );
 
    wp_enqueue_style( 'fancybox' );
 
    wp_register_script( 'fancybox', get_template_directory_uri() 
    . '/fancybox/jquery.fancybox-1.3.4.pack.js', null, null );
 
    wp_enqueue_script( 'fancybox' );
 
}
 
add_action('wp_enqueue_scripts', 'my_eneque');

Do této funkce si můžeme postupně vkládat další soubory a máme tak naprostý přehled nad tím, co do šablony vkládáme.
Pokud chceme mít jistotu, že wordpress použije jQuery, který chceme, nejprve jej deregistrujeme a pak vložíme námi preferovaný:

Edit:  deregister query po vyzkoušení nedoporučuji, je lepší zavolat jen wp_enqueue_script( ‚jquery‘ );, WordPress pak sám vloží knihovnu.

About The Author

Zajímá mne Wordpress, responsivní šablony a zkrátka vše kolem tohoto skvělého redakčního systému.

Related posts

3 Comments

  1. Pingback: Jak vytvořit vlastní šablonu pro WordPress – 2 díl | Musilda.cz

  2. Lukenzi

    Na deregistraci JQuery bych byl opatrný, zvlášť v administraci. WordPress obsahuje svou verzi JQuery, která je odladěná pro aktuální verzi. Pokud tuto funkční verzi deregistrujeme a použijeme nějakou svou vlastní (je jedno jestli novější nebo starší) může nám něco závislé pouze na této verzi přestat fungovat.

    Klasický případ je aktivace nějakého pluginu, který si „dotáhne“ vlastní verzi JQuery a následně přestane třeba fungovat vizuální editor pro psaní článků. Samozřejmě totéž platí i na frontendu, pokud je nějaký plugin závislý na konkrétní verzi a my ji takto nahradíme jinou automaticky přestane fungovat (slidery, share tlačítka apod.).

    Reply
  3. Pingback: Funkce wp_enqueue_script | Musilda.cz

Leave a Reply

Vaše emailová adresa nebude zveřejněna. Vyžadované informace jsou označeny *

Chcete mít přehled o dění ve světě WordPressu?

Přímo do vašeho emailu

Pravidelný přehled o novinkách, trendech a událostech, které se točí kolem WordPressu. Souhrn toho nejzajímavějšího od nás i ze zahraničí.