Guides

Comment configurer MaxCDN dans WordPress avec W3 Total Cache –

Par Julian, le décembre 30, 2020
Comment configurer MaxCDN dans WordPress avec W3 Total Cache -

Un site Web rapide est l’un des facteurs essentiels pour offrir une bonne expérience utilisateur. Un site Web rapide sera mieux classé dans les moteurs de recherche, améliorera les conversions (c’est-à-dire que plus de personnes achèteront votre produit) et ouvrira la voie à ce qui pourrait s’avérer être une excellente expérience utilisateur.

Il existe de nombreuses façons d’accélérer un site Web:

  • Mise en cache des pages, des disques et des objets
  • Compression JavaScript et CSS
  • Optimisation d’image
  • Utilisation optimale des objets Web
  • Utilisation d’un réseau de diffusion de contenu (CDN)

L’un des moyens les plus populaires et les plus simples d’accélérer le site Web consiste à utiliser un réseau de diffusion de contenu, communément appelé CDN. Ce tutoriel vous montre comment configurer et installer MaxCDN avec WordPress à l’aide du plugin W3 Total Cache. J’ai écrit ce tutoriel en gardant à l’esprit le débutant absolu. Chaque étape est décrite à l’aide de captures d’écran pertinentes. Si vous avez des questions, n’hésitez pas à les poser dans la section commentaires.

MaxCDN

Pour ceux d’entre vous qui sont nouveaux sur WordPress et / ou W3 Total Cache, je vous conseillerais de configurer un site Web de démonstration afin de réaliser un essai de ce tutoriel, puis de le configurer pour votre site Web principal. Commençons.

Installez W3 Total Cache

Nous commençons par installer le plugin W3 Total Cache. Vous pouvez le faire de deux manières.

Le chemin le plus long est le suivant:

  1. Téléchargez le fichier zip sur votre ordinateur
  2. Extraire l’archive (vous constaterez que les fichiers sont toujours contenus dans un dossier)
  3. Téléchargez le dossier du plugin dans WP_INSTALL_DIR / wp-content / plugins via le protocole de transfert de fichier (pour ceux qui ne sont pas familiers, WP_INSTALL_DIR est un nom de macro que j’ai choisi au hasard pour votre répertoire d’installation WordPress)
  4. Une fois téléchargé, activez le plugin

Cette méthode, aussi fastidieuse soit-elle (et c’est vraiment le cas), est très utile pour le débogage. Dans certains cas rares, lorsque votre hébergeur n’a pas activé cURL ou que vous ne pouvez pas installer le plugin via le tableau de bord WordPress, vous devrez suivre cette méthode.

Maintenant pour le moyen facile. Cela devrait fonctionner pour 99,9% des gens là-bas.

installer le cache total w3
Installation de W3 Total Cache à partir du tableau de bord WordPress
  1. Allez simplement Tableau de bord WordPress> Plugins> Ajouter un nouveau
  2. Rechercher « w3 total cache »
  3. Installez et activez le premier résultat

Vous pouvez également télécharger le fichier zip à l’aide du tableau de bord WordPress à partir de Plugins> Ajouter nouveau> Télécharger.

Activation du cache total W3
Activation du cache total W3

Une fois que vous avez installé le plugin, vous trouverez le message suivant. Cliquer sur Activez le plugin. Nous sommes maintenant prêts à configurer W3 Total Cache.

Configuration du cache total W3 (W3TC)

Onglet CDN Sous performance W3 Total Cache

Comme vous le savez tous, W3 Total Cache est le plugin de mise en cache WordPress le mieux noté et le plus polyvalent du marché. De AT&T à Mashable – tous ces sites haute performance utilisent W3 Total Cache.

Notre tutoriel se concentre sur la mise en place d’un réseau de diffusion de contenu pour WordPress. Avant de faire cela, je vais passer par le réglage optimal du plugin. Cela serait utile à ceux qui sont nouveaux sur WordPress et / ou W3 Total Cache.

Nous ouvrons d’abord la page des paramètres généraux du plugin. Vous pouvez le trouver sous Performances> Paramètres généraux dans le coin inférieur gauche de votre tableau de bord WordPress. Vous noterez que le plugin est désactivé. Vous trouverez également un grand nombre de boîtes (ou de modules comme certains d’entre vous préféreront peut-être l’appeler) – chacune contenant un paramètre particulier.

Notez que je suppose que vous utilisez un serveur d’hébergement partagé ou un serveur virtuel ou dédié et non un service d’hébergement WordPress géré tel que WP Engine.

Dans tous les cas, si vous ne possédez pas l’expertise technique pour configurer W3 Total Cache, je ne recommanderais pas d’expérimenter des paramètres inconnus sur un site en direct. Si vous testez des choses dans un environnement de test, je vous encourage à parcourir le guide de mise en cache WordPress de John Saddington pour un cours avancé!

Paramètres généraux et de cache de page dans W3TC

La première boîte que vous trouverez est la Général boîte de paramètres. N’utilisez cette case que lorsque vous souhaitez désactiver complètement le plugin. Nous allons activer des modules spécifiques et en discuter dans les paragraphes suivants. Le premier module que nous voulons activer est Cache de page. Cochez simplement la case et sélectionnez Disque amélioré comme le Méthode de cache de page.

Cache de page W3 Total Cache avec options
Paramètres de cache de page dans W3 Total Cache

Si votre environnement d’hébergement autorise d’autres méthodes (avancées) de mise en cache, sélectionnez-les. Mon serveur de test me permet d’utiliser APC, Qui veut dire Cache PHP accéléré. C’est une forme de Mise en cache de l’opcode. Ces conditions peuvent être nouvelles pour vous. Ne t’inquiète pas. Sélectionnez simplement Disque amélioré en cas de doute et que vous êtes prêt à partir. Ne pas cliquer sur Enregistrer les paramètres à l’instant.

Réduire le paramètre dans le cache total W3

Le module suivant est Minifier. Il combine essentiellement vos fichiers JavaScript et CSS et supprime les espaces blancs indésirables (blancs), etc. et les compresse jusqu’au dernier octet. Il en résulte des transferts plus rapides et donc un temps de réponse plus court.

Parfois, l’activation de Minify peut entraîner la décomposition du CSS du thème. Il est donc préférable d’intégrer d’abord avec succès MaxCDN, puis de tester A / B les paramètres Minify pour voir ce qui fonctionne. Ainsi, nous n’activerons pas les paramètres Minify pour le moment.

Autres paramètres dans W3 Total Cache

Le reste des paramètres comprend Cache de base de données, Cache d’objets et Cache du navigateur, les trois devraient être activés.

Paramètres du cache de base de données dans le cache total W3
Paramètres du cache de base de données dans le cache total W3
Paramètres du cache d'objets dans le cache total W3
Paramètres du cache d’objets dans le cache total W3
Paramètres de cache du navigateur dans W3 Total Cache
Paramètres de cache du navigateur dans W3 Total Cache

Une fois que vous avez vérifié tous les modules pertinents, cliquez sur Enregistrer les paramètres.

Configurer MaxCDN avec W3 Total Cache dans WordPress

Maintenant, pour le jeu final. Nous avons activé avec succès les paramètres de mise en cache recommandés dans W3TC et procédons maintenant à l’intégration de MaxCDN.

Créer une nouvelle zone de tirage dans MaxCDN

Premièrement, nous devons créer un nouveau Zone de tirage à partir de notre panel MaxCDN. Connectez-vous à votre compte MaxCDN et sélectionnez le Zones icône suivie de Zones de tirage onglet puis sur Créer une zone de tirage. Ensuite, nous configurons la nouvelle zone de tirage (il s’agit d’un très crucial partie).

Créer une nouvelle zone de tirage dans MaxCDN
Créer une nouvelle zone de tirage dans MaxCDN

Il y a trois champs:

  1. Nom de la zone d’extraction: Il doit être alphanumérique et ne peut pas contenir de caractères spéciaux, y compris des espaces.
  2. URL du serveur d’origine: Ce doit être l’URL de base de votre site. Même si WordPress est installé dans un dossier distinct, vous devez entrer l’URL de base. Par exemple, si WordPress est installé sous http://www.example.com/blog/ entrez juste http://www.example.com. N’ajoutez pas le «/» de fin. Si votre site n’a pas www dans son URL de base, omettez cette partie. Dans ce tutoriel, j’utilise un sous-domaine et WordPress est installé sous http://stage.thinkingteapot.com/Julian. Notez ce que j’ai entré dans ce champ.
  3. Étiquette: Cela peut être le texte de votre choix – tout ce qui vous aide à classer cette zone de tirage. J’ai utilisé le nom du site de démonstration.
Configuration de la zone de tirage
Configuration de la zone de tirage

Une fois que vous avez entré les données, appuyez sur Créer. Une nouvelle zone d’extraction doit être créée en quelques minutes:

MaxCDN PullZone créé
Message de réussite

Une fois la nouvelle zone de tirage créée, dirigez-vous vers sa Aperçu panneau et copiez le URL CDN.

URL de la zone d'extraction
Informations sur la zone d’extraction nouvellement créées

Nous devrons entrer ces données dans W3 Total Cache. Je recommande de ne pas fermer cet onglet ni de se déconnecter de MaxCDN, car nous devrons autoriser MaxCDN avec W3 Total Cache.

Autoriser MaxCDN avec W3 Total Cache

Autoriser MaxCDN avec W3 Total Cache
Autoriser MaxCDN avec W3 Total Cache

Les paramètres CDN de W3 Total Cache se trouvent sous Performance> CDN à partir du tableau de bord WordPress. Pour que W3 Total Cache puisse accéder à MaxCDN et fonctionner en synchronisation avec lui, nous devrons autoriser W3 Total Cache à utiliser l’API de MaxCDN.

C’est super facile et seulement le clic d’un bouton. Ouvrez les paramètres CDN dans W3 Total Cache et cliquez sur le Autoriser bouton. Si vous ne vous êtes pas déconnecté de MaxCDN à l’étape précédente, vous serez automatiquement redirigé vers le panneau de MaxCDN. Dans tous les autres cas, vous devrez vous reconnecter. Après quelques secondes, vous devriez voir quelque chose comme ceci:

Clé d'API MaxCDN
Clé d’API MaxCDN

Copiez la clé et collez-la dans le Clé d’autorisation dans la page des paramètres CDN du W3TC et cliquez sur le Valider bouton. Vous devriez voir un message comme celui-ci:

Autorisation réussie
Autorisation réussie

Connexion de MaxCDN avec W3 Total Cache

Une fois l’autorisation réussie, configurez les options restantes comme indiqué dans l’image ci-dessous.

  • Sélectionnez la zone de tirage: Devrait être la nouvelle zone que vous venez de créer
  • Remplacez le nom d’hôte du site par: l’URL CDN que vous avez copiée juste après avoir créé la nouvelle zone (recherchez-la dans l’autre onglet si vous ne l’avez pas fermée)
Paramètres finaux MaxCDN
Paramètres additionnels

Une fois terminé, cliquez sur le Tester MaxCDN bouton et vous devriez voir un vert Test réussi message de réussite. En ce moment, inspirez profondément, expirez, fixez l’infini et tapotez-vous dans le dos – vous avez réussi à intégrer MaxCDN dans votre site WordPress en utilisant W3 Total Cache.

Cliquez enfin sur le Enregistrer tous les paramètres bouton. Vous devriez voir ce message en haut une fois la page actualisée:

Intégration MaxCDN activée
Intégration MaxCDN activée

Conclusion

Une expérience est considérée comme réussie lorsque des résultats pertinents sont produits. Cela devrait être le cas avec un tutoriel. Je vous ai montré comment installer et configurer le CDN dans votre site WordPress nouveau ou existant. J’ai également évalué le site expérimental avant et après la configuration du CDN à l’aide de GTmetrix. Voici les résultats:

GTmetrix Benchmark - Avant CDN
GTmetrix Benchmark – Avant CDN
GTmetrix Benchmark - Après l'installation de CDN
GTmetrix Benchmark – Après l’installation de CDN

Obtenez MaxCDN

Comme vous pouvez le voir, l’utilisation d’un CDN a un effet profond sur les performances globales du site. Je vous encourage à en savoir plus en visitant le site officiel de MaxCDN.

J’espère que vous avez apprécié ce didacticiel et que vous seriez ravi d’entendre vos commentaires à ce sujet. Si vous avez déjà utilisé un CDN, j’aimerais savoir qui est votre fournisseur préféré? En outre, quelle différence cela a-t-il eu sur les performances de votre site Web?

Je serais ravi d’entendre vos pensées, alors s’il vous plaît laissez un commentaire ci-dessous si vous le pouvez.

Merci,
Sourav

Julian

Julian

Je suis correspondant principal chez WebVZ; le site hebdomadaire consacré à l'avenir des médias, la technologie, la culture (série, film, musique) et jeux-vidéo. J'anime parfois (en plus de mes articles), une série de d'interviews percutantes avec les principaux acteurs de l'industrie des médias et de la technologie.

Commentaires

Laisser un commentaire

Votre commentaire sera révisé par les administrateurs si besoin.