Vil du fjerne filer (CSS & JS), der blokerer for indlæsning af sider på WordPress? Hvis du tester dit websted på Google Insights PageSpeed, vil du sandsynligvis se et forslag om at eliminere scripts, der blokerer sider for indlæsning. I denne vejledning viser vi dig, hvordan du løser disse filer, der blokerer for indlæsning af dine sider for at forbedre din Google PageSpeed-score.

Sådan korrigeres gengivelsen af ​​wordpress-sider

Hvad blokerer indlæsningen af ​​sider?

Hvert WordPress-sted har et tema og plugins, der tilføjer JavaScript og CSS-filer i slutningen og før siden er synlig i browseren. Disse scripts kan øge indlæsningstiden for dit websteds side, og de kan også blokere gengivelsen af ​​siden.

En brugers browser skal indlæse scripts og CSS, før sideindholdet indlæses. Dette betyder, at brugere på en langsommere forbindelse bliver nødt til at vente et par millisekunder mere for at se siden.

Webstedejere, der forsøger at opnå en god Google PageSpeed-score, skal løse dette problem.

1 - Sådan retter du side gengivelse med Autoptimering

Denne metode er enklere og anbefales for de fleste brugere.

Den første ting du skal gøre er at installere og aktivere plugin " Autoptimize ". For flere detaljer, se vores trinvise guide til, hvordan du installerer et WordPress-plugin.

Efter aktivering af plugin skal du besøge " Indstillinger> Optimer automatisk Sådan konfigureres plugin-indstillingerne.

Autoptimerer indstillinger for wordpress-indstillinger

Du kan starte med at markere afkrydsningsfeltet JavaScript og CSS og derefter klikke på knappen "Gem ændringer".

Du kan nu teste din Websted ved hjælp af PageSpeed ​​​​værktøjet. Hvis der stadig er scripts, der blokerer sidegengivelse, skal du gå tilbage til siden med plugin-indstillinger og klikke på knappen "Vis avancerede indstillinger" øverst.

Optimer automatisk plugin-indstillinger

Her kan du tillade, at pluginet inkluderer JS inline og fjerne scripts, der som standard er ekskluderet som "seal.js" eller "jquery.js".

Rul derefter ned til CSS-indstillingen, og lad pluginnet kombinere alle CSS-filer.

Klik på knappen "Gem ændringer og tøm cache" for at gemme dine ændringer og ryd cachen plugin.

Når du er færdig, skal du gå videre og tjekke din Websted igen med PageSpeed-værktøjet.

Sørg for at teste dit websted grundigt for at se, at alt fungerer korrekt efter optimering af dine JavaScripts eller CSS-filer.

2 - Fix fil gengivelse med W3 Total Cache

Denne metode kræver lidt mere arbejde og anbefales til dem, der allerede har W3 Total Cache på deres websted.

Først skal du installere og aktivere W3 Total Cache-plugin. Hvis du har brug for hjælp, se vores komplette vejledning om W3 Total Cache.

Derefter skal du besøge "Ydeevne> Generelle indstillinger" og rulle ned til "minify" sektionen.

Formindskelse wordpress plugin w3 samlet cache

Først og fremmest skal du markere afkrydsningsfeltet "Aktivér" og derefter vælge "Manuel" for indstillingen til minificeringstilstand.

Klik på knappen Gem alle indstillinger For at gemme dine indstillinger.

Derefter skal du tilføje scripts og CSS, som du vil krympe.

Du kan få URL'erne til alle scripts og stilark, der skal kombineres i henhold til Google PageSpeed ​​Insights.

Under forslagene, hvor det står, " Eliminer Render blokering Javascript og CSS ", Klik på" Vis hvordan man løser ". Det viser dig listen over scripts og stilark.

Flyt musen over et script, så viser den dig den fulde URL. Du kan vælge denne URL og derefter bruge CTRL + C på dit tastatur (Command + C på Mac) til at kopiere URL'en.

Gå nu til dit WordPress admin board og gå til " ydeevne > minifier '.

Først skal du tilføje JavaScript-filer, som du vil komprimere. Rul ned til JS-sektionen og derefter under indstillingen "operationer i zoner" af typen indlejret til "ikke blokere ved hjælp af 'async'" for sektionen .

Indlæser filer w3 samlet cache-filkomprimering

Så skal du klikke på knappen Tilføj et script Og start derefter med at tilføje script-webadresser, som du kopierede fra Google PageSpeed-værktøjet.

Når du er færdig, skal du rulle ned til CSS-sektionen og klikke på knappen "Tilføj stilark". Begynd nu med at tilføje typografi-urlerne, du har kopieret med Google PageSpeed-værktøjet.

Samlet cache css w3 filkomprimering

Klik nu på knappen Gem indstillinger og ryd cache For at gemme dine indstillinger.

Besøg Google PageSpeed-værktøjet, og test dit websted igen.

Sørg for, at du også tester dit websted omhyggeligt for at se, at alt fungerer fint.

Det er alt for denne tutorial, jeg håber, at den vil give dig mulighed for at forbedre ydeevnen af ​​din WordPress blog.