Ininet

Képek, JavaScript és CSS fájlok optimalizálása WordPress weboldalon

Sok WordPress téma tucatnyi külön CSS és JavaScript fájlt tölt be, és ettől lassabban jelenik meg az oldal. Segít, ha ezeket a fájlokat tömöríteni (minify) és összevonni lehet, a képeket pedig csak akkor tölti be a böngésző, amikor a látogató odagörget (lazy load).

cPanel tárhelyen: AccelerateWP

cPanel tárhelyen ehhez nem kell külön bővítményt keresni. A cPanel „Szoftver” részében található AccelerateWP a tárhelyen lévő WordPress oldalaknál egy kattintással bekapcsolja a CSS és JavaScript optimalizálást és a képek késleltetett betöltését, a gyorsítótárral együtt. A beállítást a gyorsítótárazásról szóló cikk írja le. Ha az AccelerateWP be van kapcsolva, nem érdemes mellé más optimalizáló bővítményt, például Autoptimize-ot telepíteni.

Autoptimize bővítménnyel

Az inimix tárhelyeken az ingyenes, ma is rendszeresen frissülő Autoptimize bővítmény végzi el ugyanezt. A képek angol nyelvű WordPress adminból készültek, a menüpontok magyar felületen magyarul szerepelnek.

  1. Belépés a WordPress adminba

    Az admin felület alapesetben a https://domainnev.hu/wp-admin címen érhető el.

  2. Új bővítmény hozzáadása

    A bal oldali menüben a „Bővítmények” (Plugins) alatt az „Új bővítmény hozzáadása” (Add New Plugin) pontra kell kattintani.

  3. Az Autoptimize telepítése

    A jobb felső keresőbe az Autoptimize szót kell beírni.

    A találatnál az „Install Now” gomb telepíti a bővítményt.

    A telepítés után az „Activate” gomb kapcsolja be, és visszavisz a bővítmények listájához.

  4. CSS és JavaScript optimalizálása

    A bővítmények listájában az Autoptimize sorában a „Settings” linkre kell kattintani.

    A „JS, CSS & HTML” fülön be kell pipálni az „Optimize JavaScript Code?” és az „Optimize CSS Code?” opciót, majd a lap alján a „Save Changes and Empty Cache” gombbal menteni. Az „Exclude scripts from Autoptimize” mező alapértékén nem érdemes változtatni.

  5. Képek késleltetett betöltése

    Az „Images” fülön a „Lazy-load images?” opciót kell bepipálni, majd a „Save Changes” gombbal menteni.

Beállítás után érdemes végignézni a weboldalt. Ha valami nem működik, például nem nyílik le egy menü vagy nem töltődik be egy csúszka, az „Optimize JavaScript Code?” kikapcsolása általában megoldja. Ha minden rendben van, a Google PageSpeed Insightsszal lehet ellenőrizni az eredményt.