Musilda.cz

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ý:

wp_deregister_script( 'jquery' );
wp_register_script( 'jquery', 'http://code.jquery.com/jquery-1.8.0.min.js', null, null);
wp_enqueue_script( 'jquery' );

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

Exit mobile version