Come configurare WP Rocket per il tema NewsPaper di TagDiv
WP Rocket e NewsPaper sono rispettivamente, uno dei più popolari plugin di cache e un tema di riferimento per gli utenti di WordPress. Vi propongo la mia esperienza per usarli insieme al meglio.
NewsPaper è un tema che con il tempo ha conosciuto molte ottimizzazioni che aiutano a velocizzare i tempi di caricamento del tuo blog di viaggi. Sebbene L'autore del tema consigli WP Super Cache, che è gratuito e WP Rocket sia un plug-in a pagamento, se vuoi avere una performance superiore, soprattutto su Mobile, ritengo che valga la pena acquistarlo.
WP Rocket funziona bene con praticamente ogni sito Web creato con WordPress e nel caso qualcosa vada storto, l'assistenza è comunque veloce e risolutiva.
Leggi anche Aprire un blog di viaggi da zero
Alcuni link in questo articolo possono essere sponsorizzati, ovvero, se comprate tramite il link a voi non costa nulla, ma mi viene riconosciuta una commissione. Inserisco i link solo se pertinenti e dopo averli verificati.
Pronti per partire?
Se hai già NewsPaper di TagDiv e non hai WP Rocket installato puoi acquistare WP Rocket per il tuo blog.
Se hai intenzione di ottimizzare il tema NewsPaper, ho scritto un articolo specifico per questo. Puoi leggere questo articolo per ottimizzare il tema del giornale.
In questo articolo specifico, parlo solo della configurazione di WP Rocket per NewsPaper di TagDiv, eventuali altre ottimizzazioni al tema le riporto in un altro articolo.
Perché utilizzo WP Rocket
Ti racconto la mia esperienza con WP Rocket soprattutto per l'ottimizzazione della velocità su Mobile e parto dal presupposto che tu non abbia abilitato il Tema Mobile Tagdiv, per qualche motivo. Nel mio caso non l'ho fatto perché non era possibile diversificare i modelli per ciascuna categoria.
Per questo ho dovuto creare un modello Desktop per ogni categoria con un modello Mobile associato, allo scopo di inserire specifici link correlati a mia scelta e consigli pertinenti sulla base delle mie esperienze per le varie destinazioni.
Se abiliti il tema mobile probabilmente non avrai bisogno di WP Rocket, se invece usi modelli diversi per desktop e mobile e la velocità non ti soddisfa, continua a leggere l'articolo.
Perché non utilizzo WP Super Cache
Con la mi configurazione l'utilizzo di Wp Super Cache crea non pochi problemi di visualizzazione su dispositivi mobili. Infatti la maggior parte delle volte che c'è un accesso da un dispositivo Mobile, viene visualizzata la pagina desktop, con conseguente penalizzazione delle performances, Questo accade perché il plugin non gestisce correttamente la cache separata, cosa che invece WP Rocket fa in maniera egregia.
Performance prima e dopo l'installazione di WP Rocket
Dopo aver abilitato il plugin WP Rocket per il tuo blog, la velocità della pagina del mio sito web aumenta da 35 a 95.
Puoi confrontare la velocità della pagina con il sito Web prima e dopo aver installato solo WP Rocket.
Configurazione di WP Rocket per il tema NewsPaper
Dopo aver fatto il login, caricato e attivato il plugin WP Rocket che avrete scaricato dal sito, farete conoscenza con l'interfaccia utente di WP-Rocket.
Cache di WP Rocket
Andiamo subito alla prima etichetta, quella della Cache.
Se hai installato il tema NewsPaper di TagDiv, abilita file di cache separati per dispositivi mobili e tutte le altre impostazioni, questa parte è relativamente semplice.
Abilitando i file di cache separati per i dispositivi mobili, WP Rocket crea un file di cache separato dedicato a temi e plugin mobili specifici.
Ottimizzazione file
In questa categoria puoi minimizzare e ottimizzare i file CSS e Javascript. L'opzione potrebbe causare alcuni problemi di visualizzazione o corrompere il tema, quindi ti consiglio di controllare bene il sito sia lato Desktop che lato Mobile, utilizzando un browser diverso da quello che stai usando per modificare il sito o una finestra privata.
Per il tema NewsPaper, ho testato tutte le opzioni che elenco di seguito.
Se hai installato altri plugin, alcune specifiche funzioni potrebbero funzionare in maniera diversa, quindi ti consiglio di nuovo di verificare come indicato precedentemente.
CSS
Disabilitare " Minifica file CSS " per mia esperienza crea problemi con i menu su Mobile.
Questa funzione rimuove commenti e spazi bianchi e aiuta a ridurre le dimensioni del file del sito web in generale. In teoria non dovrebbe causare problemi e velocizzare il sito, dai miei test causa qualche problema coi menu senza apportare alcun miglioramento. Disabilitalo.
Disabilita Combina file CSS. Non è consigliato per un sito Web che utilizza HTTP/2. Anche l'abilitazione di questa opzione spesso causa problemi di visualizzazione.
Puoi verificare se il tuo sito web utilizza HTTP/2 o meno nel controllo HTTP.
Abilita Ottimizza pubblicazione CSS. Testando queste funzionalità, ho che NewsPaper e WP Rocket entrano in conflitto e causano problemi nel menu Mobile. Ho segnalato il problema a TagDiv e con un prossimo aggiornamento mi hanno detto che l'avrebbero risolto. Val la pena di riprovarci.
Abilita Rimuovi il CSS inutilizzato. Dopo iniziali false partenze l'opzione funziona egregiamente ed ha portato la mia velocità ad oltre 90 su mobile, un vero Razzo.
Rimuovi CSS inutilizzato
L'aggiornamento di WP Rocket n.3.11 del 24 marzo 2022 ha portato molti miglioramenti all'opzione, e funziona in maniera veramente egregia, pertanto val la pena di provare questa opzione testandola sempre in maniera accurata sia su Desktop che su Mobile.
Puoi escludere alcuni CSS se causano problemi, questo è il mio elenco delle Esclusioni per "Remove Unused CSS"
/wp-content/plugins/liker/css/(.*).css /wp-content/plugins/liker/css/duDialog.css /wp-content/plugins/liker/css/duDialog.min.css /wp-content/plugins/liker/css/liker.css /wp-content/plugins/liker/css/liker.min.css /wp-content/themes/Newspaper/td-theme.min.css /wp-content/themes/Newspaper/style.css (.*).td-image-container (.*).td-module-thumb (.*).td-image-wrap (.*).mdp-liker-box (.*).mdp-liker-button (.*).mdp-liker-buttons
Javascript
Abilita Minimizza file Javascript. Rimuove commenti e spazi bianchi e aiuta a ridurre le dimensioni del file del sito web in generale. Nella mia esperienza non causa problemi come la minimizzazione del CSS
Disabilita Combina file Javascript. Non è consigliato per un sito Web che utilizza HTTP/2.
Abilita Carica Javascript in modalità differita. Aiuta a differire il JS che blocca il rendering sul tuo sito e migliora il tempo di caricamento del tuo sito web.
Puoi escludere alcuni Javascript che causano problemi di visualizzazione se ritardati. Quelli che ho testato sono:
liker.js
du_dialog.min.js
du_dialog.js
liker.min.js
cdn.shortpixel.ai
Abilita Rimanda l'esecuzione del JavaScript. Questa opzione aiuta a velocizzare il sito rimandando il caricamento dei file JavaScript fino all'interazione con l'utente (ad es. scroll, clic).
Puoi escludere alcuni Javascript che causano problemi di visualizzazione se rimandati. Puoi escludere indicando il js o parole chiave. Quelli che ho testato sono:
/jquery-?[0-9.](.*)(.min|.slim|.slim.min)?.js js-(before|after) (?:/wp-content/|/wp-includes/)(.*) /jquery/jquery.min.js /jquery-migrate(.min)?.js tagdiv_theme.min.js tdBlocksArray liker.js du_dialog.min.js du_dialog.js liker.min.js cdn.shortpixel.ai menu
Disabilita Lazyload: il tema NewsPaper ha le proprie funzionalità di lazyload per le immagini e quella di WP Rocket è superflua o addirittura nociva.
Abilita il lazyload per iframe e video, se utilizzi video di Youtube, abilita anche Sostituisci l'iframe YouTube con un'immagine di anteprima.
Abilita Aggiungi dimensioni immagini mancanti: questo aiuterà ad aggiungere attributi di larghezza e altezza mancanti alle immagini. Io uso Shortpixel Adaptive Images e questa opzione non la consiglio.
Abilita (Disabilita incorporamenti di WordPress): impedisce ad altri di incorporare contenuti dal tuo sito, ti impedisce di incorporare contenuti da altri siti (non consentiti) e rimuove le richieste JavaScript relative agli incorporamenti di WordPress.
Compatibilità WebP: abilita questa opzione se fornisci immagini Webp sui tuoi siti web.
Precaricamento
Si compone di quattro parti.
Precarica cache: attiva il precaricamento e il precaricamento della cache basato sulla mappa del sito. Riprenderà automaticamente la mappa del sito in base ai tuoi plugin SEO, se utilizzi Yoast Seo, è integrato.
Precaricamento dei link: non consiglio di abilitarlo, ma non incide un granché
Precarica le richieste DNS: il precaricamento DNS può velocizzare il caricamento di file esterni, specialmente su reti mobili. Aggiungi i seguenti URL comuni per il precaricamento.
//fonts.googleapis.com //www.googletagmanager.com //www.googletagservices.com //tpc.googlesyndication.com //use.typekit.net //netdna.bootstrapcdn.com //www.google-analytics.com //cdnjs.cloudflare.com //ajax.googleapis.com //cdn.shortpixel.ai
Precarica i font: migliora le prestazioni aiutando i browser a scoprire i caratteri nei file CSS. Aggiungi i seguenti caratteri per il precaricamento.
/wp-content/themes/Newspaper/images/icons/newspaper.woff
CDN
Seleziona Abilita il Content Delivery Network, puoi scegliere la CDN di WP Rocket o, se hai un budget limitato utilizza . Se utilizzi la CDN di ShortPixel per le immagini abilitalo solo per CSS e JS.
Add-on di WP Rocket
Abilita l' integrazione con Cloudflare per velocizzare i tempi di caricamento ed è fatta.
Goditi il tuo nuovo blog di viaggi ottimizzato!
Se ti è piaciuto l'articolo su come ottimizzare NewsPaper e WP Rocket clicca su "mi piace" in fondo alla pagina o acquista WP Rocket per il tuo blog.
Pacman
Nostradamus
Magical Cat Adventure
Snake