Ce guide vous montrera comment augmenter la vitesse de chargement du site Web Wordpress avec le plug-in W3 Total Cache et un compte gratuit CDN CloudFlare. Dans ce didacticiel, le système Wordpress CMS est installé au-dessus d'une pile LAMP (Linux + serveur HTTP Apache + MariaDB RDBMS et PHP) sur une machine virtuelle auto-hébergée Debian 9, mais la même procédure peut être appliquée avec succès, avec quelques modifications mineures , sur n'importe quel site Wordpress, qu'il soit déployé sur un serveur dédié, un VPS ou sur un environnement d'hébergement mutualisé.
CONFIGURATIONS
- Un site Web Wordpress disponible sur un domaine public enregistré. Si vous souhaitez déployer votre propre site Web Wordpress au-dessus d'une pile LAMP, vous devriez envisager de lire les instructions de ce tutoriel :https://www.howtoforge.com/tutorial/install-wordpress-on-lamp-in-debian -9/
- Plug-in W3 Total Cache installé et activé dans Wordpress
- Un compte gratuit CloudFlare
Remarque initiale :
Si votre site Web Wordpress est installé sur un serveur dédié au-dessus d'une pile LAMP, la première chose que vous devez vérifier est de savoir si vous pouvez installer de nouveaux plugins à partir du tableau de bord Wordpress sans qu'un serveur FTP soit installé localement. Si vous êtes invité à entrer un compte FTP afin d'installer de nouveaux plugins, vous devez activer la méthode d'écriture directe du système de fichiers Wordpress. Pour activer cette fonctionnalité Wordpress, ouvrez le wp-config.php fichier situé dans le répertoire racine de votre site Web et ajoutez la ligne de code suivante n'importe où dans le contenu du fichier.
define('FS_METHOD', 'direct'); Vous pouvez également exécuter la commande suivante afin d'obtenir la même chose, sans mettre à jour manuellement wp-config.php fichier, comme illustré dans la capture d'écran ci-dessous.
echo "define('FS_METHOD', 'direct');" | tee -a /path/to/website/wp-config.php
Avant de configurer le plug-in W3 Total Cache avec CloudFlare CDN, visitez le site Web de GTmetrix au lien suivant https://gtmetrix.com et effectuez un test de performance pour votre domaine afin de comparer les résultats après l'intégration du CDN.
Partie 1 - Installer W3 Total Cache
- Pour installer W3 Total Cache plugin, connectez-vous au tableau de bord WordPress et cliquez sur Plugins -> Ajouter nouveau lien. Dans le champ de recherche, écrivez W3 Total Cache et appuyez sur Installer maintenant pour démarrer le processus d'installation comme illustré dans l'image suivante.
- Une fois l'installation du plug-in W3 Total Cache terminée, appuyez sur Activer Plug-in W3 Total Cache bouton pour activer le plug-in.
Partie 2 – Configurer le plugin W3 Total Cache
1. Pour configurer le plug-in W3 Total Cache, accédez au tableau de bord Wordpress et accédez à Plugins -> Plugins installés dans le menu de gauche et appuyez sur Paramètres lien depuis W3 Total Cache afin de lancer le processus de configuration.
2. Ensuite, accédez aux Paramètres généraux et activez le Cache de la page option. Utiliser Disque :Amélioré méthode de cache de page et faites défiler vers le bas pour passer à l'option suivante.
3. Ensuite, faites défiler vers le bas et désactivez Minify, Database Cache et Object Cache , car CloudFlare CDN se chargera de réduire les fichiers javascript, CSS et HTML de votre site Web et fournira également son propre mécanisme de mise en cache.
Vous devez désactiver le cache de la base de données si le site Web Wordpress est installé sur un environnement d'hébergement partagé.
4. Ensuite, faites défiler vers le bas et activez le cache du navigateur comme illustré dans l'image ci-dessous.
5. Faites défiler vers le bas et désactivez CDN et Reverse Proxy option, puis passez à Divers et activez l'option suivante :Vérifier les règles de réécriture . Assurez-vous de désactiver toutes les autres options comme présenté dans l'image ci-dessous.
6. Ensuite, faites défiler vers le bas et désactivez toutes les options de débogage . Enfin, cliquez sur Enregistrer tous les paramètres bouton pour appliquer la configuration. De plus, ici, vous avez la possibilité d'exporter la configuration du plug-in W3 Total Cache ou de réinitialiser le plug-in aux paramètres par défaut en cas de problème.
7. Les prochaines configurations couvriront le cache de page option dans le menu de gauche. Allez dans Général et activez les options suivantes comme illustré dans la capture d'écran ci-dessous.
- Page d'accueil du cache
- Flux de cache :site, catégories, balises, commentaires
- Mettre en cache les requêtes SSL (https)
- Ne pas mettre en cache les pages des utilisateurs connectés
- Ne mettez pas en cache les pages des rôles d'utilisateur suivants :administrateur, éditeur, auteur, contributeur et abonné.
8. Ensuite, faites défiler vers le bas et activez Cache alias hostnames option. Écrivez tous les alias de votre site Web (avec ou sans www) dans URL d'accueil supplémentaires et faites défiler jusqu'à l'option suivante.
9. Sur le C préchargement du mal tab enable Amorcer automatiquement le cache de la page . Ne modifiez pas les valeurs de l'intervalle de mise à jour et des pages par intervalle. En outre, vous devez ajouter un plan de site URL XML pour le site Web. Assurez-vous également d'activer Précharger le post-cache lors de la publication d'événements option.
10. Ensuite, faites défiler vers le bas et activez Page d'accueil, Page de publication, Flux de blog, Pages de commentaires de publication etrss2 options de la politique de purge :écran de cache de page comme décrit dans l'image ci-dessous.
11. Enfin, faites défiler jusqu'à l'onglet Avancé et activez uniquement le mode de compatibilité option. Laissez toutes les autres options par défaut et appuyez sur Enregistrer tous les paramètres bouton pour appliquer les modifications apportées jusqu'à présent.
12. Ensuite, accédez au Cache du navigateur menu et sur Général assurez-vous d'activer les options suivantes comme présenté dans la capture d'écran ci-dessous.
- Définir l'en-tête de dernière modification
- Définir l'en-tête d'expiration
- Définir l'en-tête de contrôle du cache
- Définir la balise d'entité
- Définir l'en-tête de cache total W3
- Activer la compression HTTP gzip
13. Continuez à faire défiler vers le bas et activez les options suivantes pour CSS &JS, XTML &XML et Médias et autres fichiers onglets comme décrit ci-dessous :
- Définir l'en-tête de dernière modification
- Définir l'en-tête d'expiration
- Définir l'en-tête de contrôle du cache
- Politique de contrôle du cache défini sur cache avec max-age et validation ("max-age=EXPIRES_SECONDS, public, must-revalidate, proxy-revalidate")
- Définir la balise d'entité (ETag)
- Définir l'en-tête de cache total W3
- Activer la compression HTTP gzip
14. Enfin, appuyez sur Enregistrer tous les paramètres bouton pour appliquer la configuration du plugin W3 Total Cache. Cependant, vous devez modifier les paramètres du plug-in W3 Total Cache et effectuer des tests afin de déterminer les meilleures options pour votre site Web.
Partie 3 - Configurer le CDN CloudFlare
15. Pour activer le plugin CloudFlare dans Wordpress, accédez à Performance -> Extensions - CloudFlare et appuyez sur Activer lien comme illustré dans l'image suivante.
16. Pour configurer le plugin CloudFlare, appuyez sur Paramètres lien dans le menu Extensions comme présenté dans la capture d'écran ci-dessous.
17. CloudFlare est un service de réseau de diffusion de contenu (CDN) qui agit comme un accélérateur de proxy inverse pour les sites Web. Entre autres fonctionnalités, dont certaines seront payantes, CloudFlare propose des DNS et des services de sécurité intégrés pour les sites Web en cache. Pour intégrer un site Web à CloudFlare CDN, il vous suffit de créer un compte gratuit sur le lien suivant https://www.cloudflare.com/a/login et d'ajouter votre domaine à leurs réseaux comme illustré dans le capture d'écran ci-dessous.
18. Attendez environ une minute que CloudFlare analyse les enregistrements DNS de votre domaine et cliquez sur Continuer pour passer à l'écran des enregistrements DNS. Sur l'écran des enregistrements DNS détectés, vérifiez si tous vos enregistrements de domaine sont découverts. Si tous vos enregistrements DNS sont présents dans la liste, cliquez sur Continuer bouton pour continuer. Utilisez les captures d'écran ci-dessous comme guide.
19. Ensuite, vous devez choisir un forfait CloudFlare pour votre domaine et cliquer sur Continuer bouton pour passer à l'écran suivant. Dans ce didacticiel, nous choisirons un plan de site Web gratuit.
20. Sur l'écran suivant, notez les serveurs de noms DNS CloudFlare et mettez à jour vos serveurs de noms de domaine en conséquence. Vous devez vous connecter à votre panneau d'enregistrement de domaine afin de changer vos serveurs de noms de domaine et les nouveaux enregistrements doivent être mis à jour le plus rapidement possible. Les serveurs de noms de domaine doivent pointer exactement vers les serveurs de noms CloudFlare et aucun autre enregistrement ns. Lorsque vous avez terminé, appuyez sur le bouton Continuer pour terminer le processus d'intégration. Cependant, vous pouvez appuyer sur Continuer bouton et mettre à jour les enregistrements DNS ns chez votre registrar plus tard.
21. Après avoir modifié vos serveurs de noms de domaine, cliquez sur Revérifier les serveurs de noms bouton pour forcer le processus d'activation. La propagation DNS du domaine dans le cloud Internet prend jusqu'à 24 heures. Cependant, pendant cette période, votre site Web ne sera en aucun cas affecté. Pas de temps d'arrêt !
22. Ensuite, accédez au panneau Web CloudFlare et appuyez sur Vitesse bouton de menu. Ici, activez Auto Minify option pour JavaScript, HTML et CSS comme illustré dans l'image ci-dessous. Ce paramètre compressera tous les fichiers javascript, CSS et HTML afin de réduire leur volume et de les livrer plus rapidement aux navigateurs des clients finaux.
23. Faites défiler vers le bas et activez Automatique mode pour Chargeur de fusée comme illustré ci-dessous.
24. Ensuite, cliquez sur Crypto bouton et définissez le cryptage SSL à Complet . Ensuite, rendez-vous sur l'écran principal afin d'obtenir la clé API et d'activer l'extension Wordpress CloudFlare. Appuyez sur Obtenez votre clé API lien, sélectionnez Clé API globale et cliquez sur Afficher la clé API bouton. Une nouvelle fenêtre pop-up devrait s'ouvrir. Copiez la chaîne de la clé API dans le presse-papiers et fermez la fenêtre contextuelle.
25. Revenez au site Web Wordpress et accédez à Performance -> Extensions -> CloudFlare et cliquez sur Paramètres lien. Dans l'écran CloudFlare, cliquez sur Autoriser et ajoutez l'adresse e-mail que vous avez inscrite à CloudFlare et la clé API que vous avez copiée à partir de la clé API globale. Lorsque vous avez terminé, appuyez sur Suivant bouton pour continuer.
26. Sélectionnez votre zone de domaine et appuyez sur le bouton Suivant pour terminer le processus d'autorisation. Ensuite, vous pouvez commencer à gérer les paramètres CDN CloudFlare pour votre domaine via le plugin CloudFlare dans Wordpress.
27. Si vous avez déjà mis à jour les enregistrements DNS ns chez votre bureau d'enregistrement, vous pouvez attendre quelques heures, puis vous connecter au panneau CloudFlare. Le site Web doit être activé avec succès sur CloudFlare.
Attendez quelques jours que le service CloudFlare CDN mette complètement en cache le contenu de votre site Web et analyse à nouveau la vitesse de votre site Web sur le site Web https://gtmetrix.com. Comparez les résultats avec le rapport initial afin de déterminer l'avantage de performance fourni par CloudFlare CDN.