Chcete vylúčiť súbory (CSS a JS), ktoré blokujú načítanie stránok na WordPress? Ak testujete svoj web v službe Google Insights PageSpeed, pravdepodobne sa vám zobrazí návrh na vylúčenie skriptov, ktoré blokujú načítanie stránok. V tejto príručke vám ukážeme, ako opraviť tieto súbory, ktoré blokujú načítanie vašich stránok, aby ste zlepšili svoje skóre Google PageSpeed.

Ako opraviť vykreslenie stránok wordpress

Čo blokuje načítanie stránok?

Každý web WordPress má motív a doplnky, ktoré pridávajú súbory JavaScript a CSS na koniec a pred tým, ako je stránka viditeľná v prehliadači. Tieto skripty môžu zvýšiť čas načítania stránky vášho webu a môžu tiež blokovať vykreslenie stránky.

Prehliadač používateľa bude musieť pred načítaním obsahu stránky načítať skripty a CSS. To znamená, že používatelia s pomalším pripojením si budú musieť na zobrazenie stránky počkať ešte niekoľko milisekúnd.

Majitelia stránok, ktorí sa snažia dosiahnuť dobré skóre Google PageSpeed, budú musieť tento problém vyriešiť.

1 - Ako opraviť vykreslenie stránky pomocou automatického dokončovania

Táto metóda je jednoduchšia a odporúčaná pre väčšinu používateľov.

Prvá vec, ktorú musíte urobiť, je nainštalovať a aktivovať doplnok “ Autoptimize ". Pre viac informácií pozri náš podrobný návod, ako nainštalovať doplnok WordPress.

Po aktivácii doplnku musíte navštíviť „ Nastavenia> Automaticky optimalizovať Konfigurácia nastavení doplnku.

Automaticky optimalizuje nastavenia nastavení wordpressu

Môžete začať začiarknutím políčka JavaScript a CSS a potom kliknúť na tlačidlo „Uložiť zmeny“.

Teraz môžete otestovať svoje webové stránky pomocou nástroja PageSpeed. Ak stále existujú skripty, ktoré blokujú vykresľovanie stránky, musíte sa vrátiť na stránku nastavení doplnku a kliknúť na tlačidlo „Zobraziť rozšírené nastavenia“ v hornej časti.

Automaticky optimalizovať nastavenia doplnku

Tu môžete povoliť doplnku, aby obsahoval vložené JS a odstraňoval skripty, ktoré sú v predvolenom nastavení vylúčené, napríklad „seal.js“ alebo „jquery.js“.

Potom prejdite nadol na možnosť CSS a nechajte doplnku kombinovať všetky súbory CSS.

Kliknutím na tlačidlo „Uložiť zmeny a vyprázdniť vyrovnávaciu pamäť“ uložte zmeny a Vyprázdniť vyrovnávaciu pamäť plugin.

Po dokončení pokračujte a skontrolujte svoje webové stránky opäť pomocou nástroja PageSpeed.

Po optimalizácii súborov JavaScriptu alebo CSS nezabudnite svoj web poriadne otestovať, aby ste zistili, či všetko funguje správne.

2 - Oprava vykresľovania súborov pomocou W3 Total Cache

Táto metóda vyžaduje trochu viac práce a odporúča sa pre tých, ktorí už majú W3 Total Cache webové stránky.

Najskôr budete musieť nainštalovať a aktivovať doplnok W3 Total Cache. Ak potrebujete pomoc, Pozrite sa na našu kompletný sprievodca W3 Total Cache.

Potom musíte navštíviť stránku „Výkon> Všeobecné nastavenia“ a posúvať nadol do sekcie „minifikovať“.

Minifikácia wordpress pluginu w3 celková medzipamäť

Najskôr musíte zaškrtnúť políčko „Povoliť“ a potom zvoliť možnosť „Ručne“ pre možnosť režimu minifikácie.

Kliknite na tlačidlo Uložte všetky nastavenia Uloženie nastavení.

Potom je potrebné pridať skripty a CSS, ktoré chcete zmenšiť.

Môžete získať adresy URL všetkých skriptov a šablón štýlov, ktoré sa musia kombinovať podľa štatistík Google PageSpeed ​​Insights.

Podľa návrhov, kde sa hovorí, „ Zlikvidovať činí blokovanie JavaScript a CSS ", Kliknite na" Zobraziť, ako vyriešiť ". Zobrazí sa vám zoznam skriptov a šablón štýlov.

Prejdite myšou na skript a zobrazí sa vám úplná adresa URL. Môžete zvoliť túto adresu URL a potom skopírovať adresu URL pomocou kombinácie klávesov CTRL + C na klávesnici (v počítačoch Mac klávesová skratka Command + C).

Teraz choďte na svoju administrátorskú dosku WordPress a choďte na výkon > Minifier ".

Najprv musíte pridať súbory JavaScript, ktoré chcete komprimovať. Posuňte sa nadol do sekcie JS a potom v časti „operácie v zónach“ typu vloženého do časti „neblokujte pomocou funkcie„ asynchronizácia ““. .

Načítanie súborov s celkovou kompresiou medzipamäte w3

Potom musíte kliknúť na tlačidlo Pridať skript Potom začnite pridávať adresy URL skriptov, ktoré ste skopírovali z nástroja Google PageSpeed.

Po dokončení sa posuňte nadol do sekcie CSS a kliknite na tlačidlo „Pridať šablónu štýlov“. Teraz začnite pridávať adresy URL štýlov, ktoré ste skopírovali pomocou nástroja Google PageSpeed.

Celková vyrovnávacia pamäť css súbor w3

Teraz kliknite na tlačidlo Uložiť nastavenia a vyčistiť medzipamäť Uloženie nastavení.

Navštívte nástroj Google PageSpeed ​​a znova otestujte svoje webové stránky.

Svoj web tiež starostlivo otestujte, aby ste zistili, či všetko funguje dobre.

To je všetko pre tento tutoriál, dúfam, že vám umožní zlepšiť výkon vášho WordPress blog.