Comment ajouter AJAX à votre site WordPress

Publié: 2022-09-29

L'ajout d'AJAX à votre site WordPress est un excellent moyen d'améliorer l'expérience utilisateur et de rendre votre site plus réactif. AJAX vous permet de charger dynamiquement du contenu sans avoir à recharger la page entière, ce qui peut être un énorme gain de temps. Il existe plusieurs façons d'ajouter AJAX à votre site WordPress. Une façon consiste à utiliser un plugin comme Ajax Load More ou WP Ajaxify . Ces plugins géreront le gros du travail pour vous et faciliteront l'ajout d'AJAX à votre site. Une autre façon d'ajouter AJAX à WordPress consiste à le coder manuellement dans votre thème ou plugin. Il s'agit d'une approche plus technique et nécessite un peu plus de travail, mais cela vous donnera plus de contrôle sur la façon dont AJAX est implémenté sur votre site. Si vous n'êtes pas développeur, la meilleure façon d'ajouter AJAX à WordPress est d'utiliser un plugin. Il existe un certain nombre d'excellents plugins disponibles qui faciliteront l'ajout d'AJAX à votre site.

Il existe plusieurs façons d'utiliser AJAX dans WordPress, mais l'une devrait être la plus utilisée. AJAX est une combinaison de code HTML, CSS et JavaScript qui vous permet d'envoyer des données à un script, de recevoir et de traiter la réponse, puis de recharger la page. Si vous n'êtes pas familier avec AJAX, lisez l'article de Wikipedia à ce sujet à la fin de cet article. Dans le dossier WP-administrator, il y a un fichier admin-ajaxx qui stocke les requêtes AJAX. S'il n'y a pas d'autres éléments disponibles, une action doit être fournie (pour les requêtes GET et POST). L'ajout d'une fonction au premier crochet signifie qu'il sera actif si un utilisateur connecté initie l'action. En utilisant le deuxième crochet, vous pouvez séparer les utilisateurs connectés et non connectés.

Créez une classe user_vote et une propriété data-post_id, qui contiennent l'ID de la publication et l'événement click, en utilisant votre plugin. Un champ méta peut être utilisé pour stocker le nombre total de votes exprimés. La fonction update_post_meta() est utilisée pour mettre à jour le nombre de votes pour notre message. Nous allons créer un tableau pour chaque cas pour correspondre au succès ou à l'échec de la fonction. Des méthodes régulières ont maintenant été utilisées pour gérer les actions de l'utilisateur, et JavaScript a maintenant été développé. Une mauvaise fonction pour gérer les utilisateurs déconnectés, mais elle peut être utilisée comme exemple. Nous aurons besoin de jQuery et de notre propre code JavaScript pour que notre système utilise AJAX.

En suivant les étapes ci-dessous, vous pouvez le faire sur votre plugin. Dans le fichier my_voter_script.js, nous trouverons l'URL myAjax.ajaxurl, qui contient l'URL de notre fichier admin-ajax.html. Lorsqu'un utilisateur clique sur le bouton de vote sans utiliser JavaScript, il utilise la méthode GET (la chaîne de requête) pour envoyer une requête au script. Ils peuvent accéder à une page en utilisant JavaScript. En réponse à notre demande, les données devraient être rendues publiques. La fonction my_user_vote() de notre plugin est censée traiter cela et nous renvoyer le tableau de résultats. Le compteur de votes, dans notre exemple, change de valeur pour indiquer le nouveau décompte des votes. La plate-forme AJAX de WordPress a beaucoup à offrir, ainsi que la possibilité de différencier les états de connexion et de non-déconnexion.

Puis-je utiliser Ajax dans WordPress ?

1 crédit

Vous pouvez utiliser AJAX dans WordPress de la même manière qu'il est déjà utilisé dans le back-end. Tout ce que vous avez à faire est de vous habituer aux outils disponibles. Le code est une explication générale du processus, mais nous y reviendrons plus tard.

Ajax permet d'échanger des données sans avoir à recharger une page. Vous pouvez le faire vous-même si vous créez un fichier autonome à l'aide de WordPress, mais vous devez l'appeler et le traiter vous-même. De plus, WordPress inclut un moyen efficace et simple d'utiliser Ajax en interne. En externalisant Ajax vers un fichier supplémentaire, vous pouvez l'inclure dans functions.php. Ajax est le code réel que nous utilisons ici. Les données Ajax sont traitées à l'aide de l'étape 4 de JavaScript. En JavaScript, vous renvoyez les données au client dans un rappel. Vous pouvez également ajouter des épices supplémentaires au besoin.

AJAX peut être utilisé pour récupérer des données à partir d'un serveur, envoyer des données à un script ou effectuer des calculs. HTML5 est fréquemment combiné avec AJAX, ce qui permet aux concepteurs de créer plus facilement des sites Web qui ont l'air et se sentent modernes.
Les pages Web peuvent être générées avec AJAX en quelques secondes. Les pages Web peuvent être mises à jour de manière asynchrone à l'aide d'AJAX en échangeant de petites quantités de données avec le serveur en arrière-plan. Étant donné que des parties d'une page Web peuvent être mises à jour sans recharger la page entière, cela signifie que des parties peuvent être mises à jour sans recharger la page entière.

Comment utiliser la fonction Admin_url() dans WordPress Ajax

Dans notre exemple de code AJAX, la fonction admin_url() renvoie l'URL de la requête AJAX . Voici ce qu'il m'apparaît dans cette image : Ajax ( type:GET, dataType: json, url: admin_url('ajax.')) uses GET. In., data, action : get_data, success : function(response) alert("Votre vote n'a pas pu être ajouté"); et in., événement : recevoir. L'URL de la requête AJAX peut être spécifiée à l'aide de la fonction admin_url() dans cet exemple. Les données sont les suivantes : *action : « get_data », *success : function(response) : « Votre vote n'a pas pu être ajouté »); *alerte : "Votre vote n'a pas pu être ajouté"

Comment puis-je obtenir des données Ajax dans WordPress ?

Crédit: technicalblog.in

Il existe plusieurs façons d'obtenir des données AJAX dans WordPress. Une façon consiste à utiliser les API AJAX intégrées à WordPress. Une autre façon consiste à utiliser un plugin ou un thème qui fournit des fonctionnalités AJAX. Enfin, vous pouvez également écrire votre propre code pour gérer les requêtes AJAX.

Comment fonctionne Ajax dans WordPress ?

La majorité des sites Web utilisent Ajax, une technologie Web populaire. Ajax, l'une de ses fonctionnalités clés, est capable de gérer les opérations de base de données sans recharger les pages Web. Cela signifie que les données de la base de données peuvent être affichées sur le front-end sans nécessiter d'actualisation.

Comment puis-je savoir si WordPress Ajax fonctionne ?

Crédit : débordement de pile

Ajax est une technologie qui permet de créer des applications Web dynamiques et réactives. Il permet à une page Web de demander et de recevoir des données d'un serveur sans avoir à recharger la page entière. WordPress utilise Ajax pour améliorer l'expérience utilisateur en fournissant une interface plus réactive. Il existe plusieurs façons de savoir si WordPress Ajax fonctionne. La première consiste à examiner les requêtes réseau dans les outils de développement de votre navigateur. Si vous voyez une demande faite à l' url WordPress ajax (wp-admin/admin-ajax.php), alors WordPress utilise Ajax sur cette page. Une autre façon de le savoir est de rechercher le signe '#' dans l'URL. Cela indique que la page utilise l'option 'fragment', qui est requise pour les requêtes Ajax.

Les fonctions WP_doing_ajax peuvent être utilisées car WordPress 4.0.0 incluait une fonction intégrée pour cela. Parce que les plugins qui font Ajax différemment peuvent filtrer les faux positifs, c'est une meilleure option. Si vous utilisez Ajax comme recommandé dans le codex, vous pouvez tester la constante DOING_AJAX. Lorsqu'une requête AJAX n'est pas destinée à être utilisée avec un hook admin-ajax, il s'agit simplement d'un point de terminaison (par exemple, PayPal IPN).

Ajax dans WordPress sans plugin

AJAX est une technologie qui permet de créer des applications Web dynamiques et réactives. C'est un choix populaire pour une utilisation dans WordPress car il peut aider à créer une expérience utilisateur plus transparente. Il existe plusieurs façons d'implémenter AJAX dans WordPress, mais l'une des plus courantes consiste à utiliser un plugin. Il existe de nombreux plugins disponibles qui peuvent aider à ajouter des fonctionnalités AJAX à votre site WordPress, mais il est également possible d'ajouter AJAX sans plugin. Si vous êtes à l'aise avec le codage, vous pouvez ajouter des fonctionnalités AJAX en ajoutant quelques lignes de code à votre fichier functions.php.

Ajax, en particulier, permet aux utilisateurs de gérer les opérations de base de données sans avoir à recharger les pages Web. Par conséquent, vous pouvez obtenir des données de la base de données et les afficher sur le front-end sans avoir à actualiser la page. Ajax a gagné en popularité au fil des ans en raison de sa facilité d'utilisation et de sa rapidité d'affichage, et il est maintenant utilisé de diverses manières sur les sites Web. Pour enregistrer et mettre en file d'attente nos fichiers JavaScript et CSS, WordPress doit disposer des crochets nécessaires. Enfin, nous devons créer un lien Lisez-moi plus tard pour chaque article de blog. Lorsque l'utilisateur clique sur le lien, le message qu'il souhaite enregistrer est ajouté à la liste "Lisez-moi plus tard". Après avoir déterminé ce que nous devons faire, nous cliquons sur le lien.

Voici un bref aperçu de la façon dont nous utilisons l'attribut de données HTML5 pour identifier l'article de blog. Get_the_id() peut être utilisé pour obtenir ces informations si vous utilisez le plugin. Lorsque vous appelez Ajax sur un objet, vous devez envoyer la requête au fichier admin-ajax.php . Ce fichier gère et traite toutes vos requêtes WordPress Ajax. Dans ce code, nous avons créé une fonction qui sera appelée lorsque l'utilisateur cliquera sur le lien "Lisez-moi plus tard". Nous obtenons l'ID de publication via la méthode data de cette fonction et nous l'enregistrons dans la variable rml_post_id. Après avoir ajouté le code suivant, vous devrez à nouveau utiliser la méthode ajax().

Lorsqu'un utilisateur clique sur le lien "Lisez-moi plus tard", il sera supprimé. La variable $rml_post_id contient l'ID de la publication. Lorsqu'il y a une ligne, la fonction WordPress get_meta() renvoie la méta-valeur. Nous stockons ces informations dans la table usermeta de notre base de données si elles sont vraies. Nous enquêtons pour voir s'il existe une valeur $, si elle existe ou si elle n'existe pas. Veuillez ajouter le code suivant au fichier read-me-later.php. Vous êtes responsable de la désinfection de votre système en utilisant Update() lorsque vous effectuez une mise à jour.

La fonction WordPress get_posts() renvoie tous les articles en fonction des préférences de l'utilisateur. Nous utiliserons la méthode widget() pour afficher la phrase "Lisez-moi". Les messages du mois précédent seront utilisés dans le frontend. Pour être honnête, nous avons simplement besoin d'un widget de base dans ce cas. Cette fonctionnalité vous permet de déterminer si une demande provient du bon emplacement et est effectuée par un utilisateur authentifié. Si le nonce est incorrect ou non défini, l' appel Ajax est abandonné. Ce didacticiel apprendra aux utilisateurs comment enregistrer les messages qu'ils souhaitent lire plus tard, puis les lire plus tard.

Article WordPress Ajax

Ajax vous permet de mettre à jour dynamiquement des parties de votre site WordPress sans recharger toute la page. Cela peut être utile pour récupérer des données à partir de formulaires, mettre à jour des informations dans la base de données ou afficher du contenu à partir d'autres parties du site.

L'article d'Artisans Web sur le chargement des publications WordPress avec Ajax est une excellente source pour commencer. Parfois, vous rencontrerez une situation dans laquelle vous souhaitez utiliser Ajax sur des publications WordPress. En réponse à ce comportement, aucun lien de pagination ne sera affiché et les rechargements de page seront interrompus. La prochaine série de messages s'affichera en cliquant sur ce bouton, tant que vous cliquez dessus, puis cliquez sur "Charger plus". Le processus sera terminé une fois que tous les messages auront été consultés. Afin d'intégrer WordPress Ajax, vous devez inclure un fichier JS dans l'environnement WordPress. Dans le répertoire js, créez un fichier custom.js puis copiez le code suivant dans le fichier functions.php.

Ce code prend la valeur 'page' et la convertit en une valeur 'paginé'. Les messages WordPress sont distribués et la sortie résultante est générée par celui-ci. Lorsque vous cliquez sur le bouton 'Load More', les prochains messages seront chargés dans Ajax.

Quelle est la différence entre Ajax et Post ?

Le symbole $ est appelé une publication. Étant donné que les requêtes POST et les requêtes POST sont rendues possibles à l'aide du même code sous-jacent, il n'y a pas grand-chose à distinguer entre elles.

Fonction Php d'appel WordPress Ajax

Ajax est une méthode permettant de rendre les pages Web plus réactives et interactives en échangeant de petites quantités de données avec le serveur en arrière-plan. Cet échange de données peut être utilisé pour mettre à jour une page sans recharger, répondre aux entrées de l'utilisateur sans recharger la page, charger un nouveau contenu dans la page sans recharger, etc. Dans WordPress, Ajax est utilisé dans le back-end pour effectuer diverses tâches telles que l'enregistrement de messages, l'obtention d'informations à partir de la base de données, etc. Dans le front-end, Ajax peut être utilisé pour implémenter des fonctionnalités telles que le défilement infini, le chargement de plus de publications en cliquant sur un bouton, etc. Pour utiliser Ajax dans WordPress, nous devons inclure la bibliothèque jQuery qui est déjà incluse dans WordPress. Nous pouvons ensuite utiliser les méthodes jQuery.ajax() ou jQuery.post() pour faire nos requêtes Ajax. Dans le back-end, nous devons nous connecter à l' action wp_ajax pour pouvoir gérer nos requêtes Ajax. Nous pouvons ensuite utiliser la fonction wp_die() pour quitter notre script PHP et renvoyer notre réponse. Dans le front-end, nous devons faire notre demande Ajax à WordPress ajaxurl qui est une variable JavaScript globale. Nous pouvons ensuite utiliser les fonctions de rappel de succès et d'erreur pour gérer notre réponse.

Comment faire un appel Ajax dans WordPress

La création d' appels Ajax à l' aide de WordPress. Pour qu'un appel Ajax fonctionne, un membre principal de WordPress doit inclure le fichier admin-ajax.php. Dans le contexte de WordPress, ce fichier est responsable de la gestion et du traitement de toutes vos requêtes Ajax. N'UTILISEZ PAS l'URL directe du chemin d'accès au fichier pour accéder au fichier. Comment puis-je obtenir admin-ajax dans WordPress ? Tous les appels Ajax sont acheminés vers le répertoire /wordpress/ajax/files de WordPress à l'aide du fichier admin-ajax.php. Ajax est-il compatible avec PHP ? AJAX peut être utilisé à la place de PHP. Dans notre tutoriel PHP, nous montrerons comment AJAX peut mettre à jour des parties d'une page Web sans recharger la page entière. PHP sera utilisé pour créer le script du serveur.