Optimiser un site WordPress avec W3 Total Cache

L’objectif de cet article est de réaliser l’installation et la configuration du plugin W3 Total Cache pour WordPress afin d’optimiser le système de cache du site.

W3 Total Cache va vous permettre de d’optimiser l’affichage de vos pages en :

  • diminuant de manière significative le temps de réponse de vos page
  • optimisant le code généré par wordpress

Prérequis

Pour suivre la suite, il faut bien évidemment avoir au préalable créé un site avec WordPress.

Vous pouvez télécharger W3 Total Cache à l’adresse suivante : http://wordpress.org/extend/plugins/w3-total-cache/

Installation de W3 Total Cache

  1. Vérifier dans un premier temps que vous n’avez pas déjà installé un autre gestionnaire de cache, si c’est le cas, il faut ou désactiver les modules ou carrément les désinstaller
  2. Modifier le fichier à la racine de votre blog wp-config.php en ajoutant la ligne suivante avant l’include require_once(ABSPATH . ‘wp-settings.php’);
    define(‘WP_CACHE’, true);
  3. Sur un serveur il faut procéder aux modifications des droits le temps de l’installation, attention ces modifications sont bien évidemment temporaires :
    # chmod 777 /var/www/vhosts/domain.com/httpdocs/wp-content
  4. Connectez vous à l’administration de votre site
  5. Dans la partie extension, sélectionnez « Ajouter »
  6. Utiliser le moteur de recherche en cherchant w3 total cache ou envoyer directement le fichier zip si vous l’avez déjà télécharger
  7. Activer l’extension
  8. Modifier les permissions de wp-content et wp-content/uploads en faisant chmod 755

Voila l’extension est maintenant installée et activée. Il vous faut maintenant la configurer.

Configuration de W3 Total Cache

Avant toute chose, vous devez vérifier la compatibilité de votre installation. Pour cela il suffit de cliquer sur le bouton « compatibilty check ».

Une « popup » s’ouvre comprenant des informations sur :

  • votre serveur : ressources et modules activés
  • votre installation de wordpress

Pour une utilisation optimale de W3 Total Cache il faut évidemment paramétrer le serveur de manière à ce que les différents modules soient en vert.

Il faut notamment avoir activé les modules suivant dans la configuration apache dans le fichier httpd.conf :


LoadModule headers_module modules/mod_headers.so
LoadModule deflate_module modules/mod_deflate.so
LoadModule expires_module modules/mod_expires.so

Onglet « General Settings »

Cet onglet permet d’activer / désactiver les différentes options et réaliser la gestion de :

  • options générales
  • cache des pages
  • minify pour les javascript et les CSS
  • cache de la base de données
  • cache des objets
  • paramétrage des Content Delivery Nework (CDN)
  • cache de l’explorateur Internet (cache browser)

Il permet également activer / désactiver la preview mode. Si celle option est activée il est nécessaire pour chaque modification de configuration de déployer à l’aide du bouton deploy pour que celles-ci soient prises en compte.

Enfin vous pouvez paramétrer :

  • un lien de support du plugin
  • gestion du debug : cette option permet d’afficher dans chaque page les actions de cache
  • module d’import / export : permet d’importer et exporter des configurations de W3 Total Cache

Onglet « Page Cache »

Cet onglet permet une gestion fine des paramétrages :

Paramètres généraux, permet d’activer / désactiver:

  1. le cache pour les utilisateurs connectés
  2. le cache de la page d’accueil
  3. le cache des différents flux du site : mots-clés, catégories, commentaires, etc.

Cet onglet permet également un paramétrage avancé que je ne vais pas présenter ici.

Onglet « Minify »

Les paramétrages possible dans cet onglet sont très important.

Vous pouvez obtenir de l’aide quand au paramétrage en cliquant sur le bouton « help ».

Un paramétrage personnalisé permet d’optimiser grandement le temps de chargement des différents composants javascript et css de votre site.

HTML :

paramétrage minify - HTML


Javascript :
Paramétrage Minify : CSS et Javascript


Le paramétrage de la partie Javascript permet d’ajouter manuellement des scripts en cliquant sur le bouton « add a script » :
Minify Settings - Ajouter un script Javascript

Cette partie vous permet d’intégrer manuellement tout les différents scripts JS qui sont utilisés par les différents plugins que vous avez installé.
Vous pouvez également sélectionner l’emplacement dans le code HTML de l’appel du Javascript, cela permet d’améliorer le chargement des JS en les chargeant en fin de page.

Les autres onglets

Je ne vous présente pas dans cet article le fonctionnement des autres onglets, vous pouvez trouver les différents paramétrages dans la documentation du plugin W3 Total Cache.
Des informations complémentaires sont accessibles dans la feuille de questions/réponses accessible par le lien suivant :http://wordpress.org/extend/plugins/w3-total-cache/faq/

Mesurer l’impact des paramétrages avec Yslow

Afin de mesurer l’impact des modifications réalisées, je vous conseille d’utiliser le plugin Yslow pour firebug sous Firefox.

Pour cela il faut installer les plugins suivants :

Pour aller plus loin

Pour compléter vos connaissances sur le fonctionnement de W3 Total Cache vous pouvez lire les sites suivants :

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *