Script betöltése a láblécben, WordPress alatt – Weboldal gyorsítás tippek #1

Hogyan gyorsíthatjuk WordPress honlapunk?

A WordPress bővítmények és sablonok többsége a fejlécben hívja meg a stíluslapok és a script fájlokat is, sőt sok esetben még a simán beszúrt javascript kódot is. Ezek közül a stíluslapok meghívása, ami a megjelenéshez feltétlen szükséges, annak a fejlécben a helye, hogy meg legyen hívva. A script kódok 99%-nak viszont a láblécben is jó, ha onnan van meghívva. Ezzel nyerhetünk kis időt és sok kicsi, sokra megy. Ezt szinte minden weboldal sebesség mérő is figyelni szokta.

Hogyan helyezzük át a script meghívásokat a láblécben?

Ha kevésbé értünk a kódhoz, bővítménnyel:

Van erre kész bővítmény: Scripts to footer. Ezzel a bővítménnyel szinte valamennyi .js fájl meghívása átkerül a láblécben, a wp_footer() meghívásba. Bővítmény az egyszerűbb módja, hogy picit gyorsítsunk a honlapunkon.

A bővítményt miután telepítettük és aktiváltuk, be kell állítanunk. Az alábbi beállítás lehetőségek vannak:

• Blog page: A bejegyzés listázós első oldalon a script-ek a láblécbe kerüljenek-e vagy nem
• Search result: Keresési találatoknál a script-ek a láblécbe kerüljenek-e vagy nem
• Post type / Bejegyzés típus: Melyiknél legyenek a script-ek a láblécbe vagy nem
• Taxonomy archives: Melyik taxonómiánál legyenek a script-ek a láblécbe vagy nem
• Author archives: Szerzők bejegyzés listázásánál legyenek a script-ek a láblécbe vagy nem
• Other archives: Egyéb archív (bejegyzés listázó) oldalakon legyenek a script-ek a láblécbe vagy nem
• Keep jQuery in the header: A jqery betöltése maradjon a fejlécben? (Sok sablon használ jquery-t, így pl. slider-ek hibásan jelenhetnek meg, amíg be nem tölt teljesen a weboldal. Ezt érdemes összetettebb sablon használata esetén bepipálni.)

Kód megadással script-ek áthelyezése

Ha saját magunk készítünk sablont vagy akár csak módosítunk, legyünk igényesek és úgy tervezzük. Számomra mindig is fontos, hogy amely feladatnál szükséges, ott a lehető legjobb megoldást válasszam. Ezért ha script meghívása szükséges, azt mérlegelem és ha kell, egyből optimalizálást elősegítendő módon, a láblécben hívom meg. A lenti példában lévő kódot a functions.php -be írjuk be, csak ne felejtsük el a saját script-jeinkre lecserélni.

A kód:

// Script betoltes a lablecbe - Rotisoft.hu - START
 
function script_athelyezes() {
   remove_action('wp_head', 'wp_print_scripts');
   remove_action('wp_head', 'wp_print_head_scripts', 9);
   remove_action('wp_head', 'wp_enqueue_scripts', 1);
 
   add_action('wp_footer', 'wp_print_scripts', 5);
   add_action('wp_footer', 'wp_enqueue_scripts', 5);
   add_action('wp_footer', 'wp_print_head_scripts', 5);
}
add_action( 'wp_enqueue_scripts', 'script_athelyezes' );
 
// Script betoltes a lablecbe - VEGE

Miért is fontos a weboldal optimalizálás?

A gyorsabb betöltődés, jobb konverziót képes adni és így növelni weblapunk hatékonyságát. A keresőoptimalizálásban is fontos szempont a weboldal sebessége.

Segédanyagok:

• Functions.php fájl szerkesztése: Magyar nyelvű, saját cikkem.

Források:

• Script to footer bővítmény (angol)
• Quick FIX (megszűnt hivatkozás – speedrak.com, angol) leírás, cikk