Bonjour à tous (et bonne année),

Je me permet de vous écrire car j'ai un problème avec mon hébergeur au niveau de l'Open Graph et des Twitter Card.

Voici donc mon problème (avec un site sous Hostinger):

Pour OPEN GRAPH : Lorsque je souhaite partager mon site auprès de mon réseau sur facebook, sur le chat de facebook, ou sur google plus, j'obtiens du contenu par défaut d'Hostinger. Pour changer ça, j'ai ajouter les meta tag OG dans mon code afin d'organiser mon propre contenu. Le problème étant que ce contenu ne change pas malgré cela, j'ai donc toujours le contenu de Hostinger.

Pour TWITTER CARD : C'est le même principe, j'ai ajouté les bonnes balises meta dans mon code, ensuite je veux valider mon site via Twitter comme il est demandé, mais on me dit que mes balises ne sont pas trouvées sur mon site, alors que je l'ai ai bien mises.

Avez-vous des avis par rapport à cela ? Est-ce que cela est déjà arrivé à certains d'entre vous ?

PS : Ne me dites pas de changer d'hébergeur, ce n'est pas ma question !

Arrows78

18 réponses


Grafikart
Réponse acceptée

Essaie de debugguer ta page déjà https://developers.facebook.com/tools/debug/ peut être les balises sont mal faites :(

VincentLoy
Réponse acceptée

Ta balise <html> contient-elle le préfixe qui va bien ?

<html prefix="og: http://ogp.me/ns#">
Lartak
Réponse acceptée

Si ton site ou plus précisément la page que tu veux partager sur Facebook ou Twitter, n'est pas accessible par les visiteurs, il est clair que ni Facebook, ni Twitter ne le pourra pas non plus.

Pensez-vous qu'il serait possible que ce soit à cause du site qui soit protégé par un htaccess et htpasswd ? de plus, j'ai testé sans pendant quelques minutes

As-tu pensé au cache ?

Arrows78
Auteur
Réponse acceptée

Bonjour à tous,

Tout d'abord je vous remercie tous pour avoir pris la peine de me lire et d'avoir répondu à mon problème pour trouver une solution.

Concernant maintenant le problème en soi :

  • J'ai rajouté dans la balise html le prefixe donné par @VincentLoy (mais celui-ci reste facultatif selon ce qu'on utilise en balise meta) :
    prefix="og: http://ogp.me/ns#"

  • Après il faut aller sur le lien donné par @Grafikart et rentré l'url de notre site
    lien suivant : https://developers.facebook.com/tools/debug/

  • Et pour finir, pour remplacer les anciennes balises par défaut de l'hébergeur, toujours sur le lien de debug de facebook, il faut cliquer sur "Fetch new scrape information" ou bien "Chercher de nouvelle information". Et normalement les nouvelles balises sont prises en compte.

Bonjour,

As tu regardé le code source de ton site en ligne? Pour voir si t'es OG y sont bien présent. Il est possible que ton hébergeur te serve des fichiers cache d'avant ta modification (donc sans tes OG).

Arrows78
Auteur

Oui mes balises sont bien présentes.

Arrows78
Auteur

J'avais testé via ce lien, le problème c'est qu'il m'indique les mêmes balises de Hostinger et non celle que j'ai mise.

Voici les bases que j'ai mises (texte dans le content enlever ici, mais c'est bien rempli sur le site:

        <meta property="og:title" content="" />
        <meta property="og:type" content="website" />
        <meta property="og:image" content="" />
        <meta property="og:url" content="" />
        <meta property="og:description" content="" />
        <meta property="og:locale" content="fr_FR" />
        <meta property="og:site_name" content="" />

        <meta name="twitter:card" content="summary" />
        <meta name="twitter:title" content="" />
        <meta name="twitter:description" content="" />
        <meta name="twitter:image" content="" />
        <meta property="twitter:url" content="" />

Après facebook à tendance à mettre en cache aussi :)
Sinon tes meta sont bien dans le <head> (question hyper con mais on sait jamais)

Arrows78
Auteur

T'inquiète on sait jamais, j'aurai pu omettre des balises obligatoires ^^.
Cela fait 1 semaine que j'ai toujours la même chose, mais le problème c'est que sans les balises j'ai celle de Hostinger qui s'affiche par défaut (sauf dans mon code, évidemment juste lors du partage), et quand je mets les miennes ça ne change rien. Je sais plus trop quoi tester :/

Arrows78
Auteur

Je viens de tester avec, cela ne change rien.
Cette ligne n'est pas facultative d'ailleurs ?

Perso, je l'avais oublié dans un projet et ça ne fonctionnait pas, et ça a fonctionné quand je l'ai rajouté par la suite.

Arrows78
Auteur

Ah c'est bizarre parce que certain site ne l'utilise pas et je peux toujours partager correctement.
Après pour mon cas ça ne marche quand même pas avec, je comprends pas.

Voilà comment j'ai utilisé les open graph et twitter Card sur mon site si jamais ça peux t'aider

<html class="no-js" lang="fr" prefix="og: http://ogp.me/ns#">
    <head>
        <meta charset="utf-8">

        <title>MON SUPER TITRE</title>
        <meta name="description" content="MA DESCRIPTION">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <meta name="author" content="Vincent Loy">

        <!-- Balises Meta pour Facebook  -->
        <meta property="og:title" content="MON SUPER TITRE">
        <meta property="og:type" content="website">
        <meta property="og:locale" content="fr_FR">
        <meta property="og:image" content="url-image-heberge-sur-flickr-240x240">
        <meta property="og:url" content="http://url-de-la-page-courante">
        <meta property="og:description" content="MA DESCRIPTION">

        <!-- Balises Meta Twitter -->
        <meta name="twitter:card" content="summary">
        <meta name="twitter:site" content="@PastaWS">
        <meta name="twitter:title" content="MA DESCRIPTION">
        <meta name="twitter:image" content="url-image-heberge-sur-flickr-240x240">

        <!-- ...balises link  pour css... -->
    </head>   
Arrows78
Auteur

J'ai pourtant tester la même chose.
Cela doit donc venir de l'hébergeur, et il m'est impossible de changer seul :/.
A quoi sert la class="no-js" ? Tu définis quoi pour ça?

Tu trouveras la réponse ici par exemple.

Ouais c'est simplement que j'utilise Modernizr, ça n'a rien à voir avec OpenGraph :)

Arrows78
Auteur

Oui je me doute bien que ça n'a aucun rapport, mais vu que j'ai vu ça plusieurs fois je voulais savoir. Je vais consulter le lien Lartak.

Pensez-vous qu'il serait possible que ce soit à cause du site qui soit protégé par un htaccess et htpasswd ? de plus, j'ai testé sans pendant quelques minutes, mais est-ce qu'il faut un certains temps avant que ça se fasse ?

Arrows78
Auteur

Pour ta première phrase effectivement, c'est un peu bête ce que je viens de dire !

Pour le cache oui je l'ai vidé, mais cela revient au même. :/