Introduction


Le protocole Open Graph permet à n'importe quelle page Web de devenir un objet riche dans un graphe social. Par exemple, ceci est utilisé sur Facebook pour permettre à n'importe quelle page Web d'avoir la même fonctionnalité que n'importe quel autre objet sur Facebook.


Métadonnées de base


Pour transformer vos pages Web en objets graphiques, vous devez ajouter des métadonnées de base à votre page. Cela signifie que vous devrez mettre des balises <meta> supplémentaires à l'intérieur de votre balise <head>.



Les quatre propriétés requises pour chaque page sont :

  • og:title - Le titre de votre objet tel qu'il devrait apparaître dans le graphique, par exemple, "The Rock".
  • og:type - Le type de votre objet, par exemple, "video.movie". Selon le type que vous spécifiez, d'autres propriétés peuvent également être requises.
  • og:image - Une URL d'image qui devrait représenter votre objet dans le graphique.
  • og:url - L'URL canonique de votre objet qui sera utilisé comme identifiant permanent dans le graphique, par exemple, "http://www.imdb.com/title/tt0117500/".



Comme d'exemple, voici le balisage du protocole Open Graph pour The Rock on IMDB :

<html prefix="og: http://ogp.me/ns#">
  <head>
    <title>The Rock (1996)</title>
    <meta property="og:title" content="The Rock" />
    <meta property="og:type" content="video.movie" />
    <meta property="og:url" content="http://www.imdb.com/title/tt0117500/" />
    <meta property="og:image" content="http://ia.media-imdb.com/images/rock.jpg" />
    ...
  </head>
  ...
</html>



Pour avoir plus d'informations je vous invite à aller sur le site opg.me, qui vous donnera plus d'explication pour utiliser ce protocole qui peut-être réellement utile pour votre site ! 🙂

3183 vues
Modifié le 05 novembre 2019
Publicité Sitedudev
Cette pub permet au site de vivre ...
Publicité
Cette pub permet au site de vivre ...
Voir d'autres articles
15 524 vues
Modifier un profil PHP
Après avoir créé notre page profil, nous allons créer une nouvelle page afin de modifier certaines données de l'utilisateur !La modification d'un profil se fait également par un...
Créer son site
386 vues
Utilisation de <tr> pour les lignes, <th> pour les en-têtes et <td> pour les cellules
Utilisation de <tr> pour les lignes, <th> pour les en-têtes et <td> pour les cellulesDans un tableau HTML, la balise <tr> est utilisée pour définir chaque ligne du tableau,...
HTML
3 422 vues
Définir l'encodage de caractères avec <meta charset="utf-8">
Définir l'encodage de caractères avec <meta charset="utf-8">L'encodage de caractères définit la correspondance entre les caractères et les valeurs binaires utilisées par l'ordinateur....
HTML
276 vues
Opérateurs logiques (&&, ||, !)
Les opérateurs logiques en PHP sont utilisés pour combiner des expressions conditionnelles et produire des résultats basés sur la logique booléenne. Voici les principaux opérateurs logiques en...
PHP
3 942 vues
Variables : Déclarer et utiliser des variables pour stocker des valeurs réutilisables
Variables en SASS : Déclarer et Utiliser1. Déclaration de variables :En SASS, les variables commencent par le symbole $ suivi du nom de la variable et de sa valeur. Par exemple :$primary-color:...
Sass
2 142 vues
Demande d'amis en PHP (2/3)
Dans cette deuxième vidéos nous allons développer notre système de relation d’amitié afin de faire apparaître les bons boutons en fonction de l'état de la relation entre 2 membres.
Créer son site de rencontres
2 229 vues
Ajouter un avatar
Nous allons maintenant ajouter des avatars à nos profils et afficher ses avatars lors de l’affichage des membres 😁
Créer son site de rencontres
269 vues
Retour de valeurs
Retour de Valeurs dans les Fonctions en JavaScriptLorsqu'une fonction est exécutée, elle peut renvoyer une valeur à l'endroit où elle a été appelée. Cette valeur peut être utilisée pour...
JS
Publicité
Cette pub permet au site de vivre ...