Brancher Organisateur
Cache Ou chargement ?
Chargement sélectif pour les appareils mobiles
Boostez votre vitesse de chargement mobile
L'organisateur de plugins augmente la vitesse de la page
Organisateur de plugins est un plugin très utile pour WordPress. En termes de plugins, il est très ancien puisqu’il a été écrit en 2012 lorsque le responsive design en était à ses balbutiements. Cependant, le plugin a résisté à l'épreuve du temps et constitue la base d'une très bonne astuce qui aide les sites Web créés avec des constructeurs de pages tels que Elementor, DIVI ou WP Bakery, etc.
Le plugin fait arrêter le chargement des plugins sur les pages. Ce qui fait que cela fonctionne si bien, c'est qu'il peut également arrêter le chargement des plugins par appareil. Les vitesses mobiles étant bien plus lentes que celles des ordinateurs de bureau, cela peut s’avérer très utile. Cela peut également être utile si un plugin ne convient pas à la disposition restreinte d'un appareil mobile, mais convient à la disposition du bureau.
Restreindre le chargement des plugins JS lourds sur les appareils mobiles peut faire une grande différence pour votre scores de vitesse de page. Mais ce n’est pas seulement la restriction du chargement qui rend ce plugin si spécial. Il offre également une flexibilité totale lorsqu'il est combiné avec le Plugin d'extraits HTML. Utiliser les deux ensemble vous permet de charger sélectivement contenu sur ordinateur, mais laissez-le de côté sur mobile.
Il s’agit d’un moment d’ampoule de contenu, car il empêche Lighthouse de signaler n’importe quelle vidéo lorsque vous l’avez masquée sur mobile dans le générateur de pages. Si vous avez masqué une vidéo sur mobile, vérifiez vos scores mobiles. La vidéo est-elle toujours signalée dans votre rapport mobile ? Si tel est le cas, j'expliquerai comment résoudre ce problème ci-dessous.
Cache Ou chargement ?
Chargement sélectif pour les appareils mobiles
Boostez votre vitesse de chargement mobile
Brancher Organisateur Augmente la vitesse de la page
Organisateur de plugins est un plugin très utile pour WordPress. En termes de plugins, il est très ancien puisqu’il a été écrit en 2012 lorsque le responsive design en était à ses balbutiements. Cependant, le plugin a résisté à l'épreuve du temps et constitue la base d'une très bonne astuce qui aide les sites Web créés avec des constructeurs de pages tels que Elementor, DIVI ou WP Bakery, etc.
Le plugin fait arrêter le chargement des plugins sur les pages. Ce qui fait que cela fonctionne si bien, c'est qu'il peut également arrêter le chargement des plugins par appareil. Les vitesses mobiles étant bien plus lentes que celles des ordinateurs de bureau, cela peut s’avérer très utile. Cela peut également être utile si un plugin ne convient pas à la disposition restreinte d'un appareil mobile, mais convient à la disposition du bureau.
Restreindre le chargement de plugins JS lourds sur les appareils mobiles peut faire une grande différence dans vos scores de vitesse de page. Mais ce n’est pas seulement la restriction du chargement qui rend ce plugin si spécial. Il offre également une flexibilité totale lorsqu'il est combiné avec le Plugin d'extraits HTML. L'utilisation des deux ensemble vous permet de charger sélectivement du contenu sur le bureau, mais de le laisser de côté sur le mobile.
Il s’agit d’un moment d’ampoule de contenu, car il empêche Lighthouse de signaler n’importe quelle vidéo lorsque vous l’avez masquée sur mobile dans le générateur de pages. Si vous avez masqué une vidéo sur mobile, vérifiez vos scores mobiles. La vidéo est-elle toujours signalée dans votre rapport mobile ? Si tel est le cas, j'expliquerai comment résoudre ce problème ci-dessous.
Organisateur de plugins est un plugin très utile pour WordPress. En termes de plugins, il est très ancien puisqu’il a été écrit en 2012 lorsque le responsive design en était à ses balbutiements.
Cependant, le plugin a résisté à l'épreuve du temps et constitue la base d'une très bonne astuce qui aide les sites Web créés avec des constructeurs de pages tels que Elementor, DIVI ou WP Bakery, etc.
Le plugin fait arrêter le chargement des plugins sur les pages. Ce qui fait que cela fonctionne si bien, c'est qu'il peut également arrêter le chargement des plugins par appareil. Les vitesses mobiles étant bien plus lentes que celles des ordinateurs de bureau, cela peut s’avérer très utile. Cela peut également être utile si un plugin ne convient pas à la disposition restreinte d'un appareil mobile, mais convient à la disposition du bureau.
Restreindre le chargement de plugins JS lourds sur les appareils mobiles peut faire une grande différence dans vos scores de vitesse de page. Mais ce n’est pas seulement la restriction du chargement qui rend ce plugin si spécial. Il offre également une flexibilité totale lorsqu'il est combiné avec le Plugin d'extraits HTML. L'utilisation des deux ensemble vous permet de charger sélectivement du contenu sur le bureau, mais de le laisser de côté sur le mobile.
Il s’agit d’un moment d’ampoule de contenu, car il empêche Lighthouse de signaler n’importe quelle vidéo lorsque vous l’avez masquée sur mobile dans le générateur de pages. Si vous avez masqué une vidéo sur mobile, vérifiez vos scores mobiles. La vidéo est-elle toujours signalée dans votre rapport mobile ? Si tel est le cas, j'expliquerai comment résoudre ce problème ci-dessous.
Sélectivement Charger les plugins
C'est Comment Accélérez le chargement mobile
Utiliser l'organisateur de plugins
La première chose à faire est Installer l'organisateur de plugins et activez-le. Après avoir fait cela, accédez à la page des paramètres du plugin dans votre WordPress Tableau de bord
Le Le plus important Chose
Dans les paramètres, assurez-vous que « Chargement sélectif » ET Le « Chargement mobile sélectif » est activé. Cela vous donne le contrôle du chargement de différents plugins sur différents appareils. Si vous allez ensuite dans « Paramètres globaux » dans les paramètres du plugin, vous pouvez voir quels plugins vous souhaitez charger/décharger sur l'ensemble du site. Cliquez simplement sur chacun d'eux pour passer au vert pour « on » ou au rouge pour « off ».
Une chose à noter ici est l'endroit où il est écrit « Plateforme ». Vous pouvez cliquer dessus pour passer au standard (ordinateur de bureau) ou au mobile. Cliquez sur « Mobile » et configurez individuellement les plugins pour désactiver le chargement sur mobile uniquement.
Si vous modifiez ensuite chaque page individuellement et faites défiler vers le bas, vous verrez une multitude de barres vertes. C'est l'organisateur du plugin. Ici, vous pouvez configurer les plugins pour qu'ils se chargent/déchargent sur cette page uniquement. Ceux que vous avez précédemment désactivés globalement seront rouges. Ceux qui sont autorisés à charger seront verts. Cliquez simplement sur la barre verte pour l'activer/désactiver pour cette page, en n'oubliant pas de modifier la plate-forme en « Mobile » pour désactiver le plugin sur mobile. C'est parfait pour les pages de marque/de destination, où vous pouvez avoir des plugins plus volumineux que vous souhaitez charger sur cette page uniquement à des fins visuelles.
C'est très simple à prendre en main et cela vous permet un contrôle total sur les plugins que vous souhaitez charger, où et sur quels appareils.
Combinaison avec des extraits HTML
Les constructeurs de pages sont excellents car ils vous permettent de concevoir des pages en toute simplicité. La plupart des sites Web sont créés avec Elementor, DIVI ou WP Bakery. Cependant, il y a un problème avec chacun d’entre eux, ce qui ralentit vraiment le chargement sur mobile. Il s'agit du contenu de la page et de son chargement sur mobile. Ce qui se passe, c'est qu'un concepteur peut créer une vidéo ou créer une grande image destinée uniquement aux appareils de bureau. Tous les constructeurs de pages ont la possibilité de masquer cela. Alors tu le caches. Cela empêchera également son apparition sur mobile. Cela devrait réduire le poids de la page mobile, car elle ne contient aucune vidéo. Droite?
Faux!
Les constructeurs de pages « cachent » uniquement le contenu. Cacher et charger sont des choses très différentes. Si vous avez une vidéo en cours de chargement sur votre bureau et que vous l'avez configurée pour qu'elle soit masquée sur mobile, allez faire un test de vitesse de page. Dans le rapport de la page mobile, votre vidéo est-elle toujours répertoriée n'importe où sur la page ? Si tel est le cas, le chargement continue, ce qui nuit vraiment à la vitesse de votre page et aux temps de chargement globaux sur mobile.
C'est là qu'interviennent les extraits de code HTML. Les masquer n'empêche pas leur chargement. Mais utiliser Plugin Organizer avec des extraits HTML le fait.
Comment puis-je Faites ceci?
Si Plugin Organizer est installé, allez installer Extraits HTML. Accédez ensuite aux paramètres du plugin HTML Snippets et cliquez sur « Ajouter un nouvel extrait ». À partir de là, saisissez le code HTML de votre vidéo ou de tout autre contenu que vous ne souhaitez pas charger sur mobile. De nombreux constructeurs de pages disposent d'un module vidéo dans lequel vous venez d'insérer la vidéo, donc si vous souhaitez que le code HTML brut affiche une vidéo sans plugins, utilisez une variante du code ci-dessous :
Lecteur vidéo Youtube
<iframe width=”100%” height=”auto” src=”URL YOUTUBE” frameborder =”0″allowfullscreen>
Lecteur vidéo auto-hébergé
N'oubliez pas de remplacer les URL par votre propre URL pour votre vidéo. Les dimensions de taille « 100% » et « auto » permettront à votre conteneur vidéo de répondre à votre site Web. Si vous avez besoin de dimensions spécifiques pour la vidéo, remplacez simplement ces valeurs par les tailles dont vous avez besoin.
Enregistrez l'extrait. Ensuite, une fois que vous l'avez enregistré, prenez simplement la vidéo existante dehors de la page elle-même, et remplacer avec le shortcode que HTML Snippets vous a fourni pour votre nouvelle vidéo. Maintenant, chargez-le. Si tout va bien, la vidéo s'affichera sur le bureau et mobile.
La dernière étape maintenant est sur la page où se trouve le contenu, faites défiler vers le bas de la page où se trouve le contenu et désactivez l'organisateur du plugin. sur le mobile. Maintenant, vérifiez à nouveau votre mobile. La vidéo ne devrait pas être là. Videz maintenant vos caches et effectuez un autre test de vitesse de page. Voyez que la vidéo se charge sur le bureau, mais a disparu de votre rapport mobile – avec une page beaucoup plus légère et un temps de chargement complet plus rapide !
Aller encore plus loin
HTML Snippets a également un plugin sœur appelé Extraits PHP. Ce plugin fonctionne exactement de la même manière que les extraits HTML, vous pouvez donc également installer celui-ci et créer du contenu à afficher sur mobile uniquement, et ne pas le charger sur le bureau.
Il vous suffit de suivre exactement les mêmes instructions que celles expliquées ci-dessus, sauf cette fois pour désactiver le contenu sur le bureau, il suffit de le désactiver lors du chargement 'Standard' et de l'activer sur 'Mobile'. Avec les deux plugins installés vous disposez d’une flexibilité totale en matière de conception et de performances. Vous pouvez avoir du contenu spécifique pour mobile et ordinateur de bureau, sans que le constructeur de pages charge absolument tout et le cache simplement.
Où d’autre est-ce utile ?
Je ne l'utilise généralement que sur du contenu mobile, limitant le chargement de grandes quantités de contenu pour augmenter les scores mobiles.
Qu'en est-il de Scripts?
Heureux que vous ayez demandé ! C’est l’autre chose pour laquelle Plugin Organizer aide vraiment. De nombreux plugins comme Slider Revolution ont une fonctionnalité de désactivation sur mobile, mais ils ne désactivent pas vraiment tout, ce qui entraîne le chargement de scripts inutiles. Slider Revolution ne chargera pas le curseur lui-même. mais WordPress chargera toujours les scripts eux-mêmes. C'est le seul moyen simple de désactiver complètement ces scripts sur les appareils mobiles, ce qui permet d'économiser énormément de temps de chargement et d'augmenter la vitesse de votre page.
Organisateur de plugins – Terminé !
Étape 7 : chargement des polices
Débarrassons-nous de ces erreurs de police
Accélérer Mobile
Utilisation du plugin
La première chose à faire est Installer l'organisateur de plugins et activez-le. Après avoir fait cela, accédez à la page des paramètres du plugin dans votre tableau de bord WordPress.
Le Le plus important Chose
Dans les paramètres, assurez-vous que « Chargement sélectif » ET Le « Chargement mobile sélectif » est activé. Cela vous donne le contrôle du chargement de différents plugins sur différents appareils. Si vous allez ensuite dans « Paramètres globaux » dans les paramètres du plugin, vous pouvez voir quels plugins vous souhaitez charger/décharger sur l'ensemble du site. Cliquez simplement sur chacun d'eux pour passer au vert pour « on » ou au rouge pour « off ».
Une chose à noter ici est l'endroit où il est écrit « Plateforme ». Vous pouvez cliquer dessus pour passer au standard (ordinateur de bureau) ou au mobile. Cliquez sur « Mobile » et configurez individuellement les plugins pour désactiver le chargement sur mobile uniquement.
Si vous modifiez ensuite chaque page individuellement et faites défiler vers le bas, vous verrez une multitude de barres vertes. C'est l'organisateur du plugin. Ici, vous pouvez configurer les plugins pour qu'ils se chargent/déchargent sur cette page uniquement. Ceux que vous avez précédemment désactivés globalement seront rouges. Ceux qui sont autorisés à charger seront verts. Cliquez simplement sur la barre verte pour l'activer/désactiver pour cette page, en n'oubliant pas de modifier la plate-forme en « Mobile » pour désactiver le plugin sur mobile. C'est parfait pour les pages de marque/de destination, où vous pouvez avoir des plugins plus volumineux que vous souhaitez charger sur cette page uniquement à des fins visuelles.
C'est très simple à prendre en main et cela vous permet un contrôle total sur les plugins que vous souhaitez charger, où et sur quels appareils.
Extraits HTML
Les constructeurs de pages sont excellents car ils vous permettent de concevoir des pages en toute simplicité. La plupart des sites Web sont créés avec Elementor, DIVI ou WP Bakery. Cependant, il y a un problème avec chacun d’entre eux, ce qui ralentit vraiment le chargement sur mobile. Il s'agit du contenu de la page et de son chargement sur mobile. Ce qui se passe, c'est qu'un concepteur peut créer une vidéo ou créer une grande image destinée uniquement aux appareils de bureau. Tous les constructeurs de pages ont la possibilité de masquer cela. Alors tu le caches. Cela empêchera également son apparition sur mobile. Cela devrait réduire le poids de la page mobile, car elle ne contient aucune vidéo. Droite?
Faux!
Les constructeurs de pages « cachent » uniquement le contenu. Cacher et charger sont des choses très différentes. Si vous avez une vidéo en cours de chargement sur votre bureau et que vous l'avez configurée pour qu'elle soit masquée sur mobile, allez faire un test de vitesse de page. Dans le rapport de la page mobile, votre vidéo est-elle toujours répertoriée n'importe où sur la page ? Si tel est le cas, le chargement continue, ce qui nuit vraiment à la vitesse de votre page et aux temps de chargement globaux sur mobile.
C'est là qu'interviennent les extraits de code HTML. Les masquer n'empêche pas leur chargement. Mais utiliser Plugin Organizer avec des extraits HTML le fait.
Comment puis-je Faites ceci?
Si Plugin Organizer est installé, allez installer Extraits HTML. Accédez ensuite aux paramètres du plugin HTML Snippets et cliquez sur « Ajouter un nouvel extrait ». À partir de là, saisissez le code HTML de votre vidéo ou de tout autre contenu que vous ne souhaitez pas charger sur mobile. De nombreux constructeurs de pages disposent d'un module vidéo dans lequel vous venez d'insérer la vidéo, donc si vous souhaitez que le code HTML brut affiche une vidéo sans plugins, utilisez une variante du code ci-dessous :
Lecteur vidéo Youtube
<iframe width=”100%” height=”auto” src=”URL YOUTUBE” frameborder =”0″allowfullscreen>
Lecteur vidéo auto-hébergé
N'oubliez pas de remplacer les URL par votre propre URL pour votre vidéo. Les dimensions de taille « 100% » et « auto » permettront à votre conteneur vidéo de répondre à votre site Web. Si vous avez besoin de dimensions spécifiques pour la vidéo, remplacez simplement ces valeurs par les tailles dont vous avez besoin.
Enregistrez l'extrait. Ensuite, une fois que vous l'avez enregistré, prenez simplement la vidéo existante dehors de la page elle-même, et remplacer avec le shortcode que HTML Snippets vous a fourni pour votre nouvelle vidéo. Maintenant, chargez-le. Si tout va bien, la vidéo s'affichera sur le bureau et mobile.
La dernière étape maintenant est sur la page où se trouve le contenu, faites défiler vers le bas de la page où se trouve le contenu et désactivez l'organisateur du plugin. sur le mobile. Maintenant, vérifiez à nouveau votre mobile. La vidéo ne devrait pas être là. Videz maintenant vos caches et effectuez un autre test de vitesse de page. Voyez que la vidéo se charge sur le bureau, mais a disparu de votre rapport mobile – avec une page beaucoup plus légère et un temps de chargement complet plus rapide !
Aller plus loin
HTML Snippets a également un plugin sœur appelé Extraits PHP. Ce plugin fonctionne exactement de la même manière que les extraits HTML, vous pouvez donc également installer celui-ci et créer du contenu à afficher sur mobile uniquement, et ne pas le charger sur le bureau.
Il vous suffit de suivre exactement les mêmes instructions que celles expliquées ci-dessus, sauf cette fois pour désactiver le contenu sur le bureau, il suffit de le désactiver lors du chargement 'Standard' et de l'activer sur 'Mobile'. Avec les deux plugins installés, vous disposez d’une flexibilité totale en matière de conception et de performances. Vous pouvez avoir du contenu spécifique pour mobile et ordinateur de bureau, sans que le constructeur de pages charge absolument tout et le cache simplement.
Rien d'autre?
Je ne l'utilise généralement que sur du contenu mobile, limitant le chargement de grandes quantités de contenu pour augmenter les scores mobiles.
Qu'en est-il de Scripts?
Heureux que vous ayez demandé ! C’est l’autre chose pour laquelle Plugin Organizer aide vraiment. De nombreux plugins comme Slider Revolution ont une fonctionnalité de désactivation sur mobile, mais ils ne désactivent pas vraiment tout, ce qui entraîne le chargement de scripts inutiles. Slider Revolution ne chargera pas le curseur lui-même. mais WordPress chargera toujours les scripts eux-mêmes. C'est le seul moyen simple de désactiver complètement ces scripts sur les appareils mobiles, ce qui permet d'économiser énormément de temps de chargement et d'augmenter la vitesse de votre page.
Organisateur de plugins – Terminé !
Étape 7 : chargement des polices
Problèmes de police résolus !