Vai al contenuto principale

Come rendere veloce il tuo blog: gestire i file CSS e JS

Divi: il tema WordPress più semplice da usare

Divi: il miglior tema WordPress di tutti i tempi!

più Download di 701.000, Divi è il tema WordPress più popolare al mondo. È completo, facile da usare e viene fornito con oltre i modelli gratuiti 62. [Consigliato]

Vuoi eliminare i file (CSS e JS) che bloccano il caricamento delle pagine su WordPress? Se stai testando il tuo sito su Google Insights PageSpeed, probabilmente vedrai un suggerimento per eliminare gli script che bloccano il caricamento delle pagine. In questo tutorial, ti mostreremo come correggere questi file che bloccano il caricamento delle tue pagine, per migliorare il tuo punteggio di Google Page Speed.

Come correggere il rendering delle pagine wordpress

Cosa sta bloccando il caricamento delle pagine?

Ogni sito WordPress ha un tema e plugin che aggiungono file JavaScript e CSS alla fine e prima che la pagina sia visibile sul browser. Questi script possono aumentare il tempo di caricamento della pagina del tuo sito e possono anche bloccare il rendering della pagina.

Il browser di un utente dovrà caricare script e CSS prima di caricare il contenuto della pagina. Ciò significa che gli utenti con una connessione più lenta dovranno attendere qualche millisecondo in più per visualizzare la pagina.

I proprietari di siti che cercano di ottenere un buon punteggio di Google Page Speed ​​dovranno risolvere questo problema.

1 - Come correggere il rendering della pagina con Autoptimize

Questo metodo è più semplice e consigliato per la maggior parte degli utenti.

La prima cosa che devi fare è installare e attivare il plugin " Autoptimize ". Per maggiori dettagli, vedi la nostra guida passo passo su come installare un plugin per WordPress.

Dopo aver attivato il plug-in, è necessario visitare " Impostazioni> Ottimizzazione automatica Per configurare le impostazioni del plugin.

Impostazioni di ottimizzazione automatica delle impostazioni di wordpress

Puoi iniziare selezionando la casella delle opzioni JavaScript e CSS e quindi fare clic sul pulsante "Salva modifiche".

Ora puoi testare il tuo sito web utilizzando lo strumento PageSpeed. Se sono ancora presenti script che bloccano il rendering delle pagine, è necessario tornare alla pagina delle impostazioni del plugin e fare clic sul pulsante "Mostra impostazioni avanzate" in alto.

Ottimizza automaticamente le impostazioni del plugin

Crea facilmente il tuo sito Web con Elementor

Elementor ti consente di creare facilmente qualsiasi design di sito Web con un aspetto professionale. Smetti di pagare caro per quello che puoi fare da solo. [Free]

Qui puoi consentire al plugin di includere JS inline e rimuovere gli script esclusi per impostazione predefinita come "seal.js" o "jquery.js".

Quindi scorri verso il basso fino all'opzione CSS e consenti al plug-in di combinare tutti i file CSS.

Fare clic sul pulsante Salva modifiche e svuota cache per salvare le modifiche e cancellare la cache del plug-in.

Una volta che hai finito, vai avanti e controlla di nuovo il tuo sito web con lo strumento PageSpeed.

Assicurati di testare attentamente il tuo sito per vedere che tutto funziona correttamente dopo aver ottimizzato i tuoi file JavaScript o CSS.

2 - Correzione del rendering dei file con W3 Total Cache

Questo metodo richiede un po 'più di lavoro ed è consigliato a coloro che hanno già W3 Total Cache sul loro sito web.

Per prima cosa dovrai installare e attivare il plugin W3 Total Cache. Se hai bisogno d'aiuto, Vedi la nostra guida completa W3 Total Cache.

Quindi è necessario visitare "Prestazioni> Impostazioni generali" e scorrere verso il basso fino alla sezione "Riduci a icona".

Minificazione wordpress plugin w3 cache totale

Stai cercando i migliori temi e plugin per WordPress?

Scarica i migliori plugin e temi WordPress su Envato e crea facilmente il tuo sito web. Già più di 49.720.000 download. [ESCLUSIVO]

Prima di tutto, è necessario selezionare la casella "Abilita" e quindi selezionare "Manuale" per l'opzione della modalità di minimizzazione.

Clicca sul bottone Salva tutte le impostazioni Per salvare le tue impostazioni.

Allora avete bisogno di aggiungere script e CSS da ridursi.

Puoi ottenere gli URL di tutti gli script e i fogli di stile che devono essere combinati in base a Google Page Speed ​​Insights.

Sotto i suggerimenti in cui si dice " Eliminare il rendering di blocco JavaScript e CSS ", Fare clic su" Mostra come risolvere ". Ti mostrerà l'elenco degli script e dei fogli di stile.

Muovi il mouse su uno script e ti mostrerà l'URL completo. Puoi selezionare questo URL, quindi utilizzare CTRL + C sulla tastiera (Comando + C su Mac) per copiare l'URL.

Ora vai al tuo pannello di amministrazione di WordPress e vai al " performance > minifier '.

Per prima cosa devi aggiungere i file JavaScript che vuoi comprimere. Scorri verso il basso fino alla sezione JS quindi sotto l'insieme "operazioni nelle zone" di tipo incorpora fino a "non bloccare utilizzando 'asincrono'" per la sezione .

Caricamento dei file w3 compressione totale dei file della cache

Quindi devi fare clic sul pulsante Aggiungere script E quindi inizia ad aggiungere gli URL degli script che hai copiato dallo strumento Google Page Speed.

Al termine, scorri verso il basso fino alla sezione CSS e fai clic sul pulsante "Aggiungi foglio di stile". Ora inizia ad aggiungere gli URL del foglio di stile che hai copiato con lo strumento Google Page Speed.

Cache totale css w3 compressione file

Crea facilmente il tuo negozio online

Scarica gratuitamente WooCommerce, i migliori plug-in di e-commerce per vendere i tuoi prodotti fisici e digitali su WordPress. [Consigliato]

Ora fai clic sul pulsante Salva impostazioni ed elimina cache Per memorizzare le tue impostazioni.

Visita lo strumento Google Page Speed ​​e prova di nuovo il tuo sito web.

Assicurati inoltre di testare attentamente il tuo sito Web per verificare che tutto funzioni correttamente.

Questo è tutto per questo tutorial, spero che ti aiuterà a migliorare le prestazioni del tuo blog WordPress.

Questo articolo contiene i commenti 0

Lascia un commento

L'indirizzo email non verrà pubblicato. I campi obbligatori sono contrassegnati *

Questo sito utilizza Akismet per ridurre indesiderati. Ulteriori informazioni su come vengono utilizzati i dati dei commenti.

Torna in alto
23 azioni
quota18
Tweet1
Enregistrer4