Ici, nous allons vous présenter les causes potentielles lorsque les images de votre fil Instagram ne se chargent pas et affichent une zone vide, des cases grises ou un autre problème lié au non chargement des photos.
Directions
Pour résoudre le problème, veuillez suivre les étapes suivantes :
- Consultez la section "Causes potentielles" ci-dessous pour voir si l'une d'entre elles s'applique. Après avoir apporté des modifications à votre site, veillez à effacer les caches de l'hôte, du site web ou du navigateur local avant de vérifier à nouveau le flux.
- Si les causes potentielles énumérées ne vous aident pas, essayez de charger le fichier JavaScript du fil Instagram avant les autres fichiers en utilisant le paramètre "Enqueue JavaScript in header" OU en utilisant le paramètre "AJAX theme loading fix" qui se trouvent tous deux sous Fil Instagram > Paramètres > Avancés onglet.
- Désactivez le paramètre suivant : Fil Instagram > Paramètres > Avancés > Chargement d'images JavaScript.
Causes potentielles
1) Il y a un problème avec votre source
Vous pouvez reconnecter votre source sur la page Paramètres du plugin en cliquant sur le bouton Ajouter une source > Connecter ou en utilisant le bouton de reconnexion sur n'importe quelle source invalide.
2) Les fichiers du plugin ne sont pas inclus dans votre page
Cela est probablement dû au fait qu'il manque à votre thème WordPress les fonctions nécessaires pour ajouter des fichiers CSS et JavaScript en haut et en bas de vos pages. Tous les thèmes devraient inclure les fonctions wp_head et wp_footer qui sont nécessaires pour que les plugins puissent ajouter leurs fichiers à votre page. Vous pouvez les ajouter en procédant comme suit :
- Ouvrez la section footer.php file and adding the following directly before the closing </body> tag:
<?php wp_footer(); ?> - Ouvrez la section header.php file and adding the following directly before the closing </head> tag:
<?php wp_head(); ?>
3) Il y a une erreur JavaScript sur votre site qui empêche le fichier JavaScript du plugin de s'exécuter.
Pour savoir si c'est le cas, cliquez avec le bouton droit de la souris sur votre page, sélectionnez "Inspecter l'élément", puis cliquez sur l'onglet "Console", ou sélectionnez l'option "Console JavaScript" dans les outils de développement de votre navigateur.
Si une erreur JavaScript se produit sur votre site, elle apparaît en rouge, ainsi que le fichier JavaScript qui en est la cause, comme indiqué ci-dessous :
Pour plus d'informations sur le débogage des erreurs JavaScript sur votre site, consultez cet article de WordPress.
4) Le flux que vous essayez d'afficher n'a pas d'articles.
Si vous essayez d'afficher un flux auquel aucun message n'a été ajouté, il se peut qu'un message d'erreur de l'administrateur soit le seul à s'afficher pour le flux ou qu'il n'y ait rien du tout. Une fois que vous avez ajouté un message au compte connecté, le flux devrait s'afficher normalement après vérification des nouveaux messages.
5) Le shortcode que vous utilisez est incorrect
Il se peut qu'il y ait une erreur dans le shortcode que vous utilisez ou qu'il manque un argument nécessaire. Par exemple, au lieu d'utiliser :
[instagram-feed hashtag="#myHashtag"]
Essayez d'ajouter le shortcode par défaut en cliquant sur le bouton "Embed" dans les paramètres du flux :
[instagram-feed feed="1"]
Assurez-vous ensuite que les paramètres du flux sont définis sous Flux Instagram > Tous les flux > Options du flux (icône en forme de stylo) pour ce flux.
6) Vous utilisez une version obsolète de jQuery
Le plugin Instagram Feed Pro nécessite la version actuelle de jQuery (3.6.4 en septembre 2024) incluse dans WordPress pour fonctionner. Certains thèmes peuvent désactiver le fichier jQuery par défaut de WordPress et charger leur propre fichier, ce qui peut provoquer cette erreur. Contactez le développeur du thème pour voir s'il peut mettre à jour le fichier pour vous.
7) Vous avez une extension de navigateur ou un module complémentaire qui pose problème
Certaines extensions de navigateur et certains modules complémentaires posent des problèmes avec le flux. Essayez de les désactiver pour voir si le flux commence à s'afficher.
8) Vous filtrez trop de messages
Si vous utilisez le paramètre afficher/supprimer les messages qui contiennent ces mots ou phrases, également connu sous le nom de "paramètre d'affichage", vous pouvez choisir de ne pas afficher les messages contenant ces mots ou phrases.Ne pas afficher les messages contenant" / "Afficher uniquement les messages contenant" ou d'autres outils de modération, il se peut que vous filtriez trop de posts pour que le flux en affiche. Instagram n'envoie pas les posts d'un utilisateur spécifique qui ont également un hashtag spécifique. Le plugin demandera donc tous les posts du compte de l'utilisateur ou du flux de hashtag et filtrera ensuite sur la base de "Ne pas afficher les messages contenant" / "Afficher uniquement les messages contenant". Voir cet article pour quelques solutions possibles pour contourner ce problème.
9) Seule la mise en page du flux Carousel ne fonctionne pas
Il se peut que votre thème charge jQuery deux fois. WordPress, par défaut, charge jQuery dans la version requise. Si vous utilisez une version personnalisée de jQuery, assurez-vous de supprimer le script par défaut. Dans certains cas, vous devrez peut-être contacter le développeur de votre thème pour supprimer les implémentations incorrectes de jQuery.
10) Le chargement paresseux est activé
Si votre thème WordPress ou un plugin utilise le chargement paresseux, il se peut que les images s'affichent en blanc ou sous la forme d'un petit carré. La plupart des conflits liés au chargement paresseux peuvent être résolus en allant dans Flux Instagram > Paramètres > Avancés et en désactivant les paramètres de chargement d'image JavaScript, puis en enregistrant les modifications.
Diagnostiquer avec les outils du développeur (avancé)
Voici comment diagnostiquer les problèmes courants avec les outils de développement de Chrome. Pour utiliser les outils de développement Chrome, faites un clic droit sur une page comportant le fil Instagram sur votre site et sélectionnez "Inspecter" ou utilisez le raccourci clavier ctrl+shift+i sur Windows ou ⌥⌘i sur Mac. Passez à l'onglet "console" pour vérifier la console javascript.
a) Aucune erreur dans la console
Ajouter la commande sbi_init(); à la console et l'exécuter (appuyer sur entrée).
Si vous déclenchez une Uncaught ReferenceError sbi_init n'est pas défini, il est fort probable que le fichier javascript pour le flux soit absent de la page. Voir le point 3 ci-dessous qui fait référence à "wp_footer". Si vous utilisez un plugin qui optimise/concatène/minifie les fichiers JavaScript (comme autoptomize), vous devrez peut-être le réinitialiser.
Si le flux apparaît, vous utilisez probablement un thème ajax. Voir cette page. Il est également possible que vous utilisiez un concaténateur/optimiseur/minificateur javascript qui doit être actualisé.
Si rien ne se passe (aucun message supplémentaire n'est affiché) et qu'il n'y a pas d'icône tournante, il se peut que les paramètres de votre flux ne renvoient aucun message, peut-être en raison d'un filtrage avec "Afficher uniquement les messages contenant", ou que tous les messages publiés dans le flux du hashtag sont privés. Voir le point 5 ci-dessous. Il est également possible que le fichier CSS soit absent de la page. Voir #3 qui fait référence à wp_head(). Vous pouvez également vous assurer que votre jeton d'accès est valide si vous obtenez le message "Unable to display Instagram photos" (Impossible d'afficher les photos Instagram).
b) Une ou plusieurs erreurs javascript apparaissent dans la console.
Ajouter la commande sbi_init(); à la console et l'exécuter (appuyer sur entrée).
Si le flux apparaît, l'erreur provient d'autres plugins ou de votre thème et empêche le chargement du flux. Essayez de désactiver d'autres plugins et/ou votre thème pour déterminer lequel est à l'origine de l'erreur.
Si vous obtenez l'erreur jQuery is not defined, cela signifie que votre thème ou un plugin charge jQuery trop tard ou qu'il a peut-être supprimé le fichier jQuery de la source de la page.
Si vous obtenez l'erreur "Access to XMLHttpRequest at ... has been blocked by CORS policy : No 'Access-Control-Allow-Origin' ...", vos "Adresse WordPress" et "Adresse du site" ne correspondent peut-être pas à la page sur laquelle se trouve le flux. Cela inclut le protocole ("http" ou "https"). Ces réglages se trouvent dans le menu Général du tableau de bord.
Si vous obtenez l'erreur "jQuery.ajax is not defined", il se peut que vous utilisiez une version "slim" de jQuery. Les versions "slim" ne contiennent pas la méthode ajax que notre plugin utilise pour récupérer les articles.
