×

COMMENT ACHETER UN PRESTATION DE REFERENCEMENT ?

1 Choisir la prestation
2 Ajouter la prestation au panier
3 Régler le panier

Vous recevrez sous 5 jours ouvrés un mail de confirmation de l'exécution de la prestation

Horaire d'ouverture

Lun-Ven 9:00H - 19:00H
Sam - 9:00H-17:00H
Dimanche sur RDV !

CONNECTEZ VOUS À VOTRE COMPTE POUR AVOIR ACCÈS AUX DIFFÉRENTES CARACTÉRISTIQUES

MOT DE PASSE OUBLIÉ ?

VOUS AVEZ OUBLIÉ VOS IDENTIFIANTS ?

AAH, ATTENDEZ, JE ME SOUVIENS MAINTENANT !
UN PROJET ? APPELEZ LE: 06 04 07 53 74
  • CONNEXION
  • ASSISTANCE

Référencement Google Gratuit

Référencement Google vous aide à référencer votre site internet grâce à du référencement gratuit mais également des stratégies de référencement naturel payantes.

T (33) 6 04 07 53 74
Email : contact@referencement-google-gratuit.com

RGG
100 rue du champ de Mars, Paris, France

Ouvrir dans Google Maps
  • RÉFÉRENCEMENT
    • Référencement
      • Référencement Gratuit
      • Référencement 1ere page
      • Referencement automatique
      • Pénalités Google
      • Referencement E-commerce
      • Référencement Payant
    • RÉFÉRENCEMENT NATUREL
      • Audit de référencement
      • Audit SEO
      • Marketing de contenu
      • Netlinking Google
      • Optimisation on page
      • Optimisation off page
    • Référencement Social
      • Référencement Amazon
      • Référencement LinkedIn
      • Référencement Pinterest
      • Référencement Facebook
      • Référencement Twitter
      • Référencement Instagram
    • Agence de référencement
      • Agence de référencement naturel
      • Référencement international
      • Référencement local
    • Référencement Professionnel
      • Référencement avocat
      • Référencement entreprise
      • Référencement hôtel
      • Référencement médecin
      • Référencement couvreur
      • Référencement VTC
    • Notions de bases SEO
      • Attribut Alt
      • Balise META
      • Balises H1, H2, H3…
      • Mots-Clés
      • Pagerank
      • SEO – La section d’en-tête (Header)
  • CRÉATION SITE
    • Création de site Internet
    • Création site vitrine
      • Création site WordPress
    • Création site e-commerce
    • Création site internet professionnel
      • Création site Immobilier
      • Création site VTC
      • Création site Avocat
    • Responsive Design
  • OFFRES
    • Nos Offres & Tarifs
    • Référencement Google +
    • Quel est le prix pour référencer un site ?
  • GUIDES
    • Comment référencer son site avec le référencement naturel ?
    • SEO pour les débutants – Le Guide
    • Référencement sur google – Le Guide
    • Référencement naturel pour débutant – Le Guide
    • Techniques de référencement avancées – Le Guide
    • Marketing digital – Le Guide
    • Meta tag – Le Guide
    • Mots clés et moteur de recherche – Le Guide
    • Rédaction SEO – Le Guide
    • Reporting SEO – Le Guide
    • ROBOT.TXT – Le Guide
  • BLOG
    • Agence Web
    • Référencement naturel
    • Référencement pas cher
    • Référencement Payant
    • Référencement social
  • CONTACT
    • CONTACT
  • MON PANIER
    Aucun produit dans le panier.
REFERENCEZ-VOUS MAINTENANT
  • Accueil
  • WORDPRESS : LE MEILLEUR DES CMS ? 
  • AJAX ET WORDPRESS
29 juin 2022

AJAX ET WORDPRESS

AJAX ET WORDPRESS

AJAX ET WORDPRESS

AJAX ET WORDPRESS

Ajax est un produit d’entretien, mais ce n’est pas que ça. C’est également une technique qui va permettre aux développeurs de générer des sites dynamiques. Google a déclaré avoir cessé le support escaped_fragment, une méthode qu’il avait créé et qui incitait à son utilisation, pour activer l’indexation de l’Ajax. 

I. DÉFINITION DE AJAX

Ajax est l’acronyme de “Asynchronous Javascript And Xml”, qui est une architecture qui utilise plusieurs technologies pour pouvoir créer des applications web dynamiques, c’est-à-dire une page web dont le contenu change sans se rafraîchir.

Sa manière de fonctionner est facile: le code javascript, sur une page, utilisera un objet XMLHttpRequest pour la collection des données en dehors de la page et les transférer au script, qui les analyse, les formate et les insère dans le DOM. Vous pouvez l’utiliser pour faire une variété de choses telles que la publication d’un commentaire, l’envoi d’un message, le chargement d’articles en infinite Scroll, la mise à jour d’un contenu en temps réel, … Ajax est associable à tous les nouveaux navigateurs à moins que vous activiez le javascript.

II. COMMENT CONFIGURER UNE REQUÊTE ?

L’objectif XMLHttpRequest a plusieurs spécifications et plusieurs façons de l’utiliser en Javascript vanilla. Pour vous faciliter la tâche, nous allons aborder uniquement dans cet article la méthode $.ajax() de jQuery. Son avantage est qu’il est simple et générique et sa librairie a une utilisation large dans les thèmes et plugins de WordPress.  

Exemple d’une requête Ajax :

jQuery( document ).ready( function($) {

// j’ajoute un événement sur le clic des liens…

// … ayant la class « ajax »

$( document ).on( ‘click’, ‘a.ajax’, function()

 {

$.ajax({

url : $(this).attr(‘href’), // à adapter selon la ressource

method : ‘POST’, // GET par défaut

data : {

var1 : ‘valeur1’,

var2 : ‘valeur2’

}, // mes variables

headers : {}, // si je souhaite modifier 

les entêtes

success : function( data ) { // en cas 

de requête réussie

// Je procède à l’insertion

var content = $( data ).find( ‘#content’ ).html();

$( ‘#content’ ).html( content );

},

error : function( data ) { // en cas 

d’échec

// Sinon je traite l’erreur

console.log( ‘Erreur…’ );

}

});

});

});

On peut l’utiliser dans un fichier *.js du thème ou plugin.

  • url : la ressource 
  • method : la méthode utilisée pour notre requête
  • data : un tableau de variables
  • success : la fonction traitée 
  • error : la fonction exécuté au cas échéant
  • headers : la modification de l’enquête

III. QUELLES SONT LES RESSOURCES DONT VOUS AVEZ BESOIN ?

Jusqu’à présent, nous avons constaté comment envoyer une requête Ajax en Javascript, mais il est temps de regarder les ressources disponibles dans WordPress pour transmettre du contenu à notre page

3.1. LE SCRIPT ADMIN-AJAX.PHP

C’est l’Url que vous devez connaître et c’est le moyen mis en évidence dans la documentation WordPress pour utiliser Ajax dans les thèmes et les plugins. Admin-ajax.php correspond à un fichier qui reçoit des requêtes Ajax, selon les variables d’action qu’il contient, il déclenche les Hook wp_ajax_{action} si l’utilisateur est connecté ou wp_ajax_nopriv_{action} s’il n’est pas connecté.

Si la variable d’action n’existe pas ou si le hook n’est pas exécuté, la requête renvoie la valeur -1. Voici la requête à exécuter :

$.ajax({

url : adminAjax,

method : ‘POST’,

data : {

action : ‘get_my_post’,

id : 89 // en vrai, récupérer l’id du contenu en variable 😉

},

success : function( data ) {

if ( data.success ) {

var article = $( data.data.article );

$( ‘#content’ ).html( article );

} else {

console.log( data.data );

}

},

error : function( data ) {

console.log( ‘Erreur…’ );

}

});

3.2.  UNE PAGE DU SITE

Vous préférez peut-être appeler la page directement depuis votre site sans avoir à vérifier admin-ajax.php. La majeure partie des scripts de infinite scroll le font. Ils pointent le contenu de la page suivante, analysent le DOM, extraient les facteurs nécessaires et agrandissent le bouton de la page qui suit. 

L’inconvénient de ce genre d’Ajax est qu’il renvoie la page entière dont le header, le footer, la sidebar, … de nombreux d’éléments dont vous n’avez pas besoin. La requête demandera au serveur des opérations sans utilités. Lorsque l’objet est renvoyé à javascript, il doit être filtré sur jQuery pour obtenir du contenu qui vous intéresse. 

3.3. LA WP REST API 

Cette API, qui est actuellement disponible sous forme de plugin et sera insérée au centre de WordPress, permet d’obtenir des données sous forme de json en envoyant simplement des requêtes à une URL spécifique. De cette façon, vous n’avez pas besoin de code PHP pour rétablir les contenus de votre site.  

3.4. UN TEMPLATE ADRESS2 À L’AJAX

Ajoutez simplement un évènement Javascript aux liens internes de votre site. Envoyer une requête ajax à l’attribut href de ces liens en cliquant sur le titre indiquant qu’il est prêt à ajouter le contenu json au clic. Vérifiez ensuite si cette entête est présente pendant le template_include pour utiliser le template particulier à ajax et à la page désirée.

Nous récupérons donc généralement le contenu de cette URL, mais dans un format alternatif adapté à une utilisation en ajax. Son avantage est que nous n’avons pas à analyser le chemin critique pour déduire le contenu que vous diffusez en fonction de l’URL du lien. 

IV. LA NAVIGATION

Ajax a deux utilités : 

  • Utilisation anecdotique à l’échelle de User experience
  • Utilisation de Ajax en fonction de l’ensemble du site

Dans cette dernière navigation, nous avons des normes à respecter si vous ne voulez pas une mauvaise expérience venant de vos visiteurs.

4.1. L’API HISTORY D’HTML5

Chaque contenu chargé doit correspondre à l’URL. L’internaute doit être en mesure de trouver l’emplacement de manière permanente sur votre site web et d’interagir dans la navigation souhaitée ce qui permet l’API history. 

Avant d’être implémenté dans les navigateurs, il n’est pas possible de changer l’URL sans charger la page, donc la seule méthode disponible était d’utiliser des ancres.

4.2. AJAX EST UTILISÉ POUR FAIRE DES TRANSITIONS 

Voici une idée importante pour indexer correctement votre site web : chaque page chargée par Ajax doit être identique à la  version “normale”. 

L’utilisateur doit pouvoir trouver le contenu de la même manière qu’il bookmarker l’URL s’il revient sur le site. Lorsque vous partagez un lien, vous devez également pointer vers un contenu rendu exactement de la même manière. l’Ajax ne consiste pas à servir un contenu différent, il s’agit de basculer entre les deux états d’un site web. 

N’oubliez pas non plus de mettre à jour certains facteurs tels que le titre de la fenêtre ou même le fil d’ariane chaque fois que vous ajoutez du contenu. Il est important d’effectuer la migration pour assurer la meilleure expérience possible. 

4.3. LORSQUE LE CONTENU EST CHARGÉ 

Après avoir ajouter chaque contenu, n’oubliez pas de redémarrer certaines fonctions javascript lorsque la page est complètement rafraîchie. les outils statistiques de suivi (Google Analytics, Piwik, …) devront être à nouveau exécutés via les fonctionnalités correspondantes :

success : function( data ) {

// Faire votre insertion

// Pour Google Analytics :

ga(‘send’, ‘pageview’, window.location.pathname);

}

4.4. INSERTION DE CONTENU “EN DOUCEUR”

Ajax existe pour améliorer l’expérience utilisateur. Le contenu est mis à jour sans actualiser la page. Si le contenu est ajouté de manière brutale ou grossière, vous courez le risque de passer à côté des avantages de cette technique. 

La méthode consiste à ajouter une classe CSS javascript à l’élément qui doit être masqué lorsque la requête aboutit. Les styles à ces adresses sont retirés de la vue avant de supprimer ces éléments. Pour calculer cela, on insère le contenu dans une zone hors limites, absolument de la même largeur que le conteneur et on obtient les dimensions à partir de javascript. 

V. L’AJAX ACCESSIBLE

Voici quelques méthodes pour assurer cette accessibilité. 

5.1. LE SCRIPT ADMIN-POST.PHP

Admin-post est un script PHP qui marche exactement comme admin-ajax, mais il est conçu pour gérer les actions de synchronisation. Par exemple, utilisez le formulaire de contact. On a déjà remarqué qu’il peut valider ce formulaire en ajax via un évènement Javascript. 

5.2. UN PEU D’ARIA

La désactivation systématique de javascript dans les navigateurs malvoyants est un mythe. Javascript et Ajax sont entièrement exécutés. De plus, un moyen de d’assurer l’accessibilité d’Ajax avec les lecteurs d’écran consiste à utiliser des attributs aria. Aria est une spécification technique conçue pour fournir un accès aux applications web. Cela se produit via les attributs dits “aria” dans le balisage HTML de la page.

L’attribut qui indique qu’un domaine est “dynamique” est appelée aria-live et peut prendre plusieurs valeurs : 

  • aria-live=”off
  • aria-live=”police”
  • aria-live”assertive”

L’aria-relevant est combiné à cet attribut :

  • aria-relevant=”additions”
  • aria-relevant=”text”
  • aria-relevant=”all”
  • On peut insérer plusieurs valeurs en les divisant par une espace

VI. MISE EN CACHE DES REQUÊTES

Le contenu renvoyé peut contenir des informations personnelles ou sensibles, etc… si le l’utilisateur est connecté. Ne pas mettre en cache les requêtes d’un utilisateur connecté car vous risquez d’être réservé à un utilisateur lambda. 

Mettez pas de cache pour les utilisateurs connectés

// Juste avant de créer un transient :

if ( ! is_user_logged_in() 

  && ! is_search() ) {

set_transient( ‘URLajax’ . md5( $url ), $content, 84600 );

}

Il faut éliminer les transients lorsque vous apportez des modifications à ces contenus. Grâce à WordPress, la gestion des requêtes est très simple et polyvalente. Nous sommes arrivés à la fin et nous espérons avoir été à vos attentes. Toutes vos remarques et questions sont les bienvenues.

Catégories

  • Agence Web
  • Cas d'étude
  • Création de site internet
  • Développement Web
  • Email Marketing
  • Entrepreneuriat
  • Hebergement Site Web
  • Marketing de Contenu
  • Marketing Digital
  • Mobile
  • Non classé
  • Posts
  • Référencement naturel
  • Référencement Payant
  • Référencement social
  • WordPress Tutoriel

Articles récents

  • Fidéliser avec les newsletter

    Fidéliser avec une newsletter 

    Les moyens de fidéliser avec des email marketin...
  • Comment trouver des mots clés pour avoir plus de vues sur Youtube

    Comment trouver des mots clés pour avoir plus de vues sur Youtube

    Méthode pour avoir plus de vues Youtube avec le...
  • audit de contenu

    COMMENT FAIRE UN AUDIT DE CONTENU

    COMMENT FAIRE UN AUDIT DE CONTENU Un Audit de c...
  • AB Testing 

    AB Testing

    L’AB Testing Aujourd’hui, nous allons parler du...
  • PROTÉGER SON ADMINISTRATION DE WORDPRESS

    PROTÉGER SON ADMINISTRATION DE WORDPRESS

    PROTÉGER SON ADMINISTRATION DE WORDPRESS  ...

Archives

  • juin 2022
  • mai 2022
  • avril 2022
  • mars 2022
  • février 2022
  • janvier 2022
  • décembre 2021
  • novembre 2021
  • octobre 2021
  • septembre 2021
  • août 2021
  • juillet 2021
  • juin 2021
  • mai 2021
  • avril 2021
  • mars 2021
  • février 2021
  • janvier 2021
  • décembre 2020
  • novembre 2020
  • octobre 2020
  • septembre 2020
  • août 2020
  • juillet 2020
  • juin 2020
  • mars 2019
  • février 2019
  • janvier 2019
  • décembre 2018
  • novembre 2018
  • octobre 2018
  • septembre 2018
  • août 2018
  • juillet 2018
  • mai 2018
  • avril 2018
  • mars 2018
  • février 2018
  • octobre 2017
  • mai 2017
  • février 2017
  • octobre 2016
  • mai 2016
  • août 2015
  • décembre 2014
  • décembre 2013

Commentaires récents

  • Comment trouver des mots clés pour avoir plus de vues sur Youtube dans Référencement Naturel
  • COMMENT FAIRE UN AUDIT DE CONTENU - Référencement Google Gratuit dans Référencement
  • AB Testing - Référencement Google Gratuit dans Référencement
  • SEO local : Une manière de référencement incontournable en 2022 dans Ajouter son entreprise sur Google My Business et Google Maps
  • 5 meilleurs outils de mots clés pour Youtube dans Référencement Naturel

Méta

  • Connexion
  • Flux des publications
  • Flux des commentaires
  • Site de WordPress-FR

Featured Posts

  • Fidéliser avec les newsletter

    Fidéliser avec une newsletter 

    0 commentaires
  • Comment trouver des mots clés pour avoir plus de vues sur Youtube

    Comment trouver des mots clés pour avoir plus de vues sur Youtube

    0 commentaires
  • audit de contenu

    COMMENT FAIRE UN AUDIT DE CONTENU

    0 commentaires
  • AB Testing 

    AB Testing

    0 commentaires
  • PROTÉGER SON ADMINISTRATION DE WORDPRESS

    PROTÉGER SON ADMINISTRATION DE WORDPRESS

    0 commentaires

Product categories

  • Audit et Optimisation Web
  • Création de site internet Pro-SEO
    • Création de site vitrine
  • Non classé
  • Offre d'Hébergement Web
    • Certificat SSL
  • Offre de Marketing Digital
  • Référencement naturel - 1 mois
  • Référencement naturel - 12 mois
  • Référencement naturel - 6 mois
  • Référencement naturel RGG
  • Référencement Payant
  • Referencement Social SMO

Cart

REFERENCEMENT GOOGLE, Votre partenaire de référencement web !

Un projet digital, un référencement gratuit ou un désir de battre la concurrence ? Contactez-nous !

Référencez-vous gratuitementObtenez un devis personnalisé !

Inscrivez-vous à la Newsletter

referencement-Google-Partners
Les pages les plus consultées
  • Referencement Google Gratuit
  • Référencement
  • Le référencement gratuit
  • Référencement Social
  • Référencement Payant
  • Le Blog de Référencement Google
  • Référencement Professionnel
  • Pack Référencement Google

© 2010 - 2021 Copyright by Référencement google gratuit | C.G.V. |  Mentions légales |All rights reserved - Tous droits réservés.

HAUT
Gérer le consentement aux cookies
Nous utilisons des cookies pour optimiser notre site web et notre service.
Fonctionnel Toujours activé
Le stockage ou l’accès technique est strictement nécessaire dans la finalité d’intérêt légitime de permettre l’utilisation d’un service spécifique explicitement demandé par l’abonné ou l’utilisateur, ou dans le seul but d’effectuer la transmission d’une communication sur un réseau de communications électroniques.
Préférences
Le stockage ou l’accès technique est nécessaire dans la finalité d’intérêt légitime de stocker des préférences qui ne sont pas demandées par l’abonné ou l’utilisateur.
Statistiques
Le stockage ou l’accès technique qui est utilisé exclusivement à des fins statistiques. Le stockage ou l’accès technique qui est utilisé exclusivement dans des finalités statistiques anonymes. En l’absence d’une assignation à comparaître, d’une conformité volontaire de la part de votre fournisseur d’accès à internet ou d’enregistrements supplémentaires provenant d’une tierce partie, les informations stockées ou extraites à cette seule fin ne peuvent généralement pas être utilisées pour vous identifier.
Marketing
Le stockage ou l’accès technique est nécessaire pour créer des profils d’utilisateurs afin d’envoyer des publicités, ou pour suivre l’utilisateur sur un site web ou sur plusieurs sites web ayant des finalités marketing similaires.
Gérer les options Gérer les services Gérer les fournisseurs En savoir plus sur ces finalités
Préférences
{title} {title} {title}