Želite li eliminirati datoteke (CSS i JS) koje blokiraju učitavanje stranica na WordPressu? Ako svoje web mjesto testirate na Google Insights PageSpeedu, vjerojatno ćete vidjeti prijedlog za uklanjanje skripti koje blokiraju učitavanje stranica. U ovom vodiču pokazat ćemo vam kako popraviti datoteke koje blokiraju učitavanje vaših stranica kako biste poboljšali svoj Google PageSpeed ​​rezultat.

Kako ispraviti prikazivanje wordpress stranica

Što blokira učitavanje stranica?

Svaka stranica WordPress-a ima temu i dodatke koji dodaju JavaScript i CSS datoteke na kraju i prije nego što je stranica vidljiva u pregledniku. Te skripte mogu povećati vrijeme učitavanja stranice na vašoj web lokaciji, a također mogu blokirati prikazivanje stranice.

Korisnikov preglednik trebat će učitati skripte i CSS prije nego što se učita sadržaj stranice. To znači da će korisnici na sporijoj vezi morati pričekati još nekoliko milisekundi da bi vidjeli stranicu.

Vlasnici web lokacija koji pokušavaju postići dobar rezultat Google PageSpeeda morat će riješiti ovaj problem.

1 - Kako ispraviti prikaz stranice automatskim optimiziranjem

Ova je metoda jednostavnija i preporučuje se većini korisnika.

Prvo što trebate učiniti je instalirati i aktivirati dodatak " Autoptimize ”. Za više detalja pogledajte naš korak po korak vodič o tome kako instalirati dodatak za WordPress.

Nakon aktiviranja dodatka, morate posjetiti " Postavke> Automatski optimiziraj Za konfiguriranje postavki dodatka.

Automatski optimizirajte postavke wordpress postavki

Možete započeti s označavanjem okvira za JavaScript i CSS, a zatim kliknite gumb "Spremi promjene".

Sada možete testirati svoje web stranica pomoću alata PageSpeed ​​​​. Ako i dalje postoje skripte koje blokiraju iscrtavanje stranice, morate se vratiti na stranicu postavki dodatka i kliknuti gumb "Prikaži napredne postavke" na vrhu.

Automatski optimizirajte postavke dodatka

Ovdje možete dopustiti dodatku da uključuje JS umetnuti i ukloniti skripte koje su prema zadanim postavkama izuzete poput "seal.js" ili "jquery.js".

Zatim se pomaknite prema dolje do opcije CSS i dopustite dodatku da kombinira sve CSS datoteke.

Kliknite gumb "Spremi promjene i isprazni predmemoriju" da biste spremili promjene i ispraznite predmemoriju dodatka.

Nakon što ste gotovi, samo naprijed i provjerite svoje web stranica ponovno s alatom PageSpeed ​​​​.

Obavezno temeljito testirajte svoju web stranicu da biste vidjeli je li sve ispravno nakon optimizacije vaših JavaScripts ili CSS datoteka.

2 - Popravite prikazivanje datoteka s W3 Total Cache-om

Ova metoda zahtijeva malo više rada i preporučuje se onima koji već imaju W3 Total Cache na svom web stranica.

Prvo ćete morati instalirati i aktivirati dodatak W3 Total Cache. Ako trebate pomoć, pogledajte naš cjelovit vodič o W3 Total Cacheu.

Zatim morate posjetiti "Performanse> Opće postavke" i pomaknuti se dolje do odjeljka "Smanjiti".

Umanjeni wordpress dodatak w3 ukupna predmemorija

Prije svega, morate potvrditi okvir "Omogući", a zatim odabrati "Ručno" za opciju načina umanjivanja.

Kliknite na gumb Spremi sve postavke Da biste spremili svoje postavke.

Zatim morate dodati skripte i CSS koje želite smanjiti.

Možete dobiti URL-ove svih skripti i tablica stilova koji se moraju kombinirati u skladu s Google PageSpeed ​​Insights.

Pod prijedlozima gdje piše: " Uklonite Render koji blokira Javascript i CSS ", Kliknite" Pokaži kako riješiti ". Pokazat će vam popis skripti i tablica stilova.

Pređite mišem preko skripte i ona će vam prikazati puni URL. Možete odabrati ovaj URL, a zatim pritisnite CTRL + C na tipkovnici (Command + C na Macu) da biste kopirali URL.

Sada idite na svoju WordPress admin ploču i idite na " predstava > Minifier ".

Prvo morate dodati JavaScript datoteke koje želite komprimirati. Pomaknite se dolje do JS odjeljka, a zatim pod skupom "operacije u zonama" tipa ugrađenog do "ne blokiraj pomoću" async "za odjeljak .

Učitavanje datoteka sa ukupnim sažimanjem datoteka predmemorije

Tada morate kliknuti na gumb Dodaj skriptu A zatim počnite dodavati URL-ove skripte koje ste kopirali iz alata Google PageSpeed.

Nakon što završite, pomaknite se dolje do odjeljka CSS i kliknite gumb "Dodaj stil listu". Sada počnite dodavati URL-ove tabele stilova koje ste kopirali pomoću alata Google PageSpeed.

Kompresija ukupne predmemorije css w3

Sada kliknite na gumb Spremi postavke i očisti predmemoriju Za pohranjivanje vaših postavki.

Posjetite alat Google PageSpeed ​​i ponovo testirajte svoje web mjesto.

Obavezno pažljivo testirajte i svoju web stranicu kako biste vidjeli da sve funkcionira u redu.

To je sve za ovaj vodič, nadam se da će vam omogućiti da poboljšate performanse vašeg WordPress blog.