WpGuida

Guida Wordpress è una raccolta di tutorials e guide su temi, plugin e sviluppo in wordpress

  • Home
  • Notizie
  • Guide
    • Guida WordPress – Le Basi
    • Guida WordPress Avanzata
    • Guida W3 Total Cache
  • Tutorials
    • Ottimizzare WordPress
    • WordPress Plugins
    • WordPress Temi
    • WordPress Development
  • Tips and Tricks
  • Hosting WordPress
  • Software
  • Velocizzare WordPress
Ti trovi qui: Home / Wordpress Plugins / Guida W3 Total Cache: Minify
Guida W3 Total Cache - Minify

Guida W3 Total Cache: Minify

24 Aprile 2015 di Dario Vinci 5 commenti

È arrivato il momento di affrontare la sezione delle impostazioni di w3 total cache dedicata al minify ma prima di analizzare le opzioni disponibili è necessario capire in cosa consiste e cosa possiamo ottenere da questa funzione.

Il termine minify può essere tradotto in “rendere piccolo”; lo scopo di questa funzione è infatti quello di rimuovere tutti i caratteri non necessari, spazi compresi, presenti all’interno delle vostre pagine e consolidare il codice con l’intento di ottenere delle pagine più leggere che quindi richiederanno dei tempi di caricamento inferiori. Questo processo può naturlmente essere applicato anche ai vostri file css e javascript i quali a loro volta potranno essere consolidati all’interno di un unico file col fine di ridurre il numero di “chiamate” effettuate durante il caricamento delle vostre pagine.

Se non avete ancora ben compreso in cosa consiste questa procedura date uno sguardo al codice sorgente di wpguida, vedrete come il tutto risulta compresso, senza spazi e commenti che sono stati rimossi grazie al minify.

ATTENZIONE

Il mio consiglio è di lavorare usando due browser (uno in cui effettuate le modifiche e uno di controllo in cui non siete loggati) e attivare singolarmente ciascuna opzione verificando di volta in volta il comportamento del vostro sito.

Può infatti succedere che attivando il minify il vostro sito risulti spaginato e non venga visualizzato correttamente. Se ciò dovesse accadere cancellate la cache di ciascun browser e riprovate. Se il problema persiste sarà necessario intervenire sulla configurazione, più avanti vedremo come.

W3 TOTAL CACHE MINIFY

Per prima cosa andiamo ad abilitare l’opzione minify in Performance->General Settings cosi come mostra lo screenshot sottostante:

W3 Total Cache Minify Settings

Nel mio caso ho scelto di usare come cache method Memcached ma se avete installato APC va bene uguale. Se invece avete un hosting condiviso e non potete installare memcached o APC allora selezionate la voce Disk.

Nel caso in cui abbiate installato Memcached sarà necessario andare a modificare le impostazioni avanzate presenti in Performance->Minify per inserire l’indirizzo e la porta di riferimento di Memcached:

w3 total cache minify - advanced settings

Dopo aver abilitato il w3 total cache minify possiamo passare alle impostazioni avanzate. Portiamoci quindi in Performance->Minify.

W3 Total Cache Minify Advanced Settings

Abilitate Rewrite URL structure. Quando questa opzione è disabilitata i link ai file css e JS appariranno in questo modo:

wp-content/w3tc/min/index.php?file=whatever.css
wp-content/w3tc/min/index.php?file=whatever.js

Abilitando questa opzione invece, verrà aggiunta la seguente riga al file wp-content/w3tc/min/.htaccess :

RewriteRule ^(.+\.(css|js))$ index.php?file=$1 [L]

Questo andrà a rimuovere la porzione “index.php?file=” , col fine di ottenere delle url più semplici. Esempio:

wp-content/w3tc/min/whatever.css
wp-content/w3tc/min/whatever.js

Vi consiglio inoltre di abilitare la notifica degli errori lato Admin per monitorare col tempo, se sono necessari ulteriori aggiustamenti.

W3 TOTAL CACHE MINIFY – HTML

A questo punto portiamoci nella sezione dedicata al codice HTML e andiamo ad abilitare le impostazioni cosi come mostra lo screenshot sottostante:

w3 total cache minify - html settings

Fatto ciò assicuratevi che le opzioni per il CSS e il JS siano disabiliate, quindi salvate le impostazioni e verificate che il vostro sito funzioni a dovere. Non fermatevi solo alla homepage ma aprite qualche articolo e controllate che tutto sia in ordine. Se state usando Chrome cliccate con il tasto destro del mouse e selezionate la voce Visualizza Sorgente Pagina; il vostro codice html dovrebbe risultare tutto compresso e attaccato senza interruzzioni o spazi vuoti.

Nel caso in cui notaste dei malfunzionamenti provate a disabilitare per prima la voce Inline JS minification ed eventualmente se il problema non dovesse risolversi provate a disabilitare l’Inline CSS minification. Queste due opzioni hanno lo scopo di comprime il codice CSS e JS in linea che quindi non viene caricato nell’header tramite chiamata al file css o js.

W3 TOTAL CACHE MINIFY – CSS

Passiamo ora alla sezione dedicata al codice CSS e configuriamola come segue:

w3 total cache minify - CSS settings

salvate le impostazioni e controllate l’impaginazione del vostro sito. È possibile che abilitando questa opzione il vostro sito risulti spaginato. Qui le cose si complicano un pochino. La prima cosa che vi consiglio di fare è quella di attivare l’opzione Combine only la quale ha lo scopo di inserire in un unico file tutti i fogli di stile css senza comprimerli. In questo modo potremo capire se il problema è dovuto alla compressione. Successivamente vi consiglio di disabilitare completamente la funzione minify, visualizzare il codice sorgente delle vostre pagine e copiare in un foglio di testo tutti i link ai file css. Quindi portiamoci nella sezione advanced ed in particolare nel riquadro Never minify the following CSS files. Incolliamo qui tutti i ink ai file css. In questo modo, una volta attivata la funzione minify questi file non verranno processati e resteranno cosi per come sono. A questo punto procediamo alla rimozione di un link per volta fino a trovare i responsabili e lasciamo i loro link in quella sezione di modo che vengano saltati durante il processo di minify.

W3 TOTAL CACHE MINIFY – JS

Qui di seguito trovate le impostazioni per la sezione JS:

w3 total cache minify - JS settings

 

Nel mio caso ho dovuto disabilitare la voce la voce Line break removal in quanto creava dei problemi. Anche in questo caso possiamo però intervenire andando a disabilitare il minify di tutti i file JS usando il riquadro Never minify the following JS files presente nella sezione advanced per trovare i file JS responsabili del non corretto funzionamento del nostro sito.

Per qualsiasi problema o per ulteriori chiarimenti lasciate pure un commento.

Archiviato in:Wordpress Plugins Contrassegnato con: W3 Total Cache

Dario Vinci

Appassionato di Wordpress e del mondo tecnologico in generale, proud to be an apple fanboy and android lover.

Ti è piaciuto questo articolo?

Se vuoi ricevere via email tutti i miei nuovi articoli e tutorials su WordPress compila il box qui a fianco. Tranquillo, non riceverai alcuna email di spam ma solo contenuti di qualità!

Cerca

Facebook

WpGuida

Newsletter

Scarica ebook Guida Wordpress 4.x

Potrebbe Interessarti

Rigenerare i thumbnail wordpress

Rigenerare i Thumbnail wordpress

10 Maggio 2015 da Dario Vinci

WordPress 4.2 Changelog: addio schermata di aggiornamento

23 Aprile 2015 da Dario Vinci

10 consigli per velocizzare wordpress

Dieci utili consigli su come velocizzare WordPress

23 Agosto 2016 da Dario Vinci

Creare un template di pagina wordpress

Come creare un template di pagina wordpress

21 Agosto 2014 da Dario Vinci

Wordpress 4.1.2 Changelog

WordPress 4.1.2 Changelog: fix di sicurezza

22 Aprile 2015 da Dario Vinci

Random Post

Aggiornare temi wordpress e plugin wordpress

Aggiornare temi WordPress e Plugin

Commenti Wordpress: quale sistema utilizzare?

Commenti WordPress: Facebook, Disqus o tradizionali?

Search Meter un plugin per analizzare le query di ricerca interne in wordpress

Query di ricerca interne: capire cosa cercano i nostri utenti

Copyright © · 2019 WpGuida