Open graph: 2e Facebook image lukt niet
Op Internet-forums al heel wat gezocht naar een oplossing voor onderstaand probleem, maar niets gevonden wat mij verder helpt. Wie helpt mij uit de brand ?
Sinds enige tijd gebruik ik Open Graph coding, zodat mensen de beginpagina van mijn website in (o.a.) Facebook kunnen delen.
Wat mij echter niet lukt is het delen van nog een tweede pagina van mijn site. Wanneer bij de tweede pagina op de share-button voor Facebook wordt geklikt, verschijnt het image, titel en naam van mijn beginpagina (en dus niet datgene wat in de open graph coding van de tweede pagina staat). Als vervolgens in Facebook op deze verkeerde image/foto wordt geklikt wordt wel doorgelinkt naar de goede (tweede) pagina.
Als ik met de 'Sharing Debugger' van Facebook deze tweede pagina 'scrape', krijg ik als foutmelding "The 'og:image' property should be explicitly provided, even if a value can be inferred from other tags". De 'og:image' bestaat echter wel ! Hoewel het volgens mij niet aan de open graph coding die ik gebruikt heb ligt, zet ik deze er voor de volledigheid toch bij. De coding voor de (wel werkende) beginpagina is:
Code (php)
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
<?php
<link rel="canonical" href="http://menselijkeeconomie.nl/index.php" />
<meta property="og:url" content="http://menselijkeeconomie.nl/index.php" />
<meta property="og:type" content="article" />
<meta property="og:title" content="Menselijke Economie" />
<meta property="og:description" content="De sameleving is te ver is doorgeschoten in de jacht op geld, bezit en macht. Een kijkje achter de schermen. Én hoe kan het anders. " />
<meta property="og:image" content="http://menselijkeeconomie.nl/afbeeldingen/facebook-image.jpg" />
?>
<link rel="canonical" href="http://menselijkeeconomie.nl/index.php" />
<meta property="og:url" content="http://menselijkeeconomie.nl/index.php" />
<meta property="og:type" content="article" />
<meta property="og:title" content="Menselijke Economie" />
<meta property="og:description" content="De sameleving is te ver is doorgeschoten in de jacht op geld, bezit en macht. Een kijkje achter de schermen. Én hoe kan het anders. " />
<meta property="og:image" content="http://menselijkeeconomie.nl/afbeeldingen/facebook-image.jpg" />
?>
De coding voor de (niet werkende) tweede pagina:
Code (php)
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
<?php
<link rel="canonical" href="http://menselijkeeconomie.nl/playIntroMedia.php" />
<meta property="og:url" content="http://menselijkeeconomie.nl/playIntroMedia.php" />
<meta property="og:type" content="article" />
<meta property="og:title" content="Een introductie" />
<meta property="og:description" content="Deze video toont een onthutsend beeld " />
<meta property="og:image" content="http://menselijkeeconomie.nl/afbeeldingen/second-image.jpg" />
?>
<link rel="canonical" href="http://menselijkeeconomie.nl/playIntroMedia.php" />
<meta property="og:url" content="http://menselijkeeconomie.nl/playIntroMedia.php" />
<meta property="og:type" content="article" />
<meta property="og:title" content="Een introductie" />
<meta property="og:description" content="Deze video toont een onthutsend beeld " />
<meta property="og:image" content="http://menselijkeeconomie.nl/afbeeldingen/second-image.jpg" />
?>
Met vriendelijke groeten,
Richard.
Gewijzigd op 29/12/2017 20:08:13 door Richard Peelen
Als ik de url van je tweede image in de browser opvraag, wordt er niets gevonden. Bij de eerste wél.
Je hebt gelijk, maar dat is helaas niet de oplossing van het probleem. Ik had precies die image-naam 'voor de duidelijkheid' in mijn vraagstelling verandert naar een wat begrijpelijker naam. In werkelijkheid stond er:
Code (php)
1
2
3
2
3
<?php
<meta property="og:image" content="http://menselijkeeconomie.nl/afbeeldingen/mediaBetrouwbaar2.jpg" />
?>
<meta property="og:image" content="http://menselijkeeconomie.nl/afbeeldingen/mediaBetrouwbaar2.jpg" />
?>
Achteraf bezien had ik beter deze werkelijke naam kunnen laten staan. Mijn 'verduidelijking' heeft juist gezorgd voor extra verwarring. Sorry.
Gewijzigd op 29/12/2017 21:23:02 door Richard Peelen
Ergens in de og specificatie staat volgens mij dat je image minimale dimensies moet hebben. Ik meen (uit mijn hoofd, niet gecheckt) dat het 200x200 moet zijn.
Ook als ik op die plek de image-naam van de eeste pagina zet (facebook-image.jpg), die daar dus wel werkt, krijg ik bij de tweede pagina dezelfde foutmelding. Toch ga ik voor alle zekerheid de afmetingen checken en het eventueel nog met een grotere image proberen. Ik laat nog weten wat hiervan de uitkomst is.
Toevoeging op 29/12/2017 21:36:17:
Jan Koehoorn op 29/12/2017 21:35:39:
Check ook nog even de encoding van je pagina's. Misschien mag die É in je eerste description niet en moet je hem door È vervangen?
Bij mediaBetrouwbaar2.jpg was de hoogte inderdaad minder als 200px. Nu heb ik deze vervangen door een mediaBetrouwbaar3.jpg van 1000x700 px. Het resultaat van de getoonde image in facebook en het resultaat van de 'Sharing Debugger' blijft onveranderd. Het probleem zit hem overigens niet alleen in de image, maar ook title en description blijven onveranderd (zoals bij de eerste pagina is gespecificeerd). Alleen de url is OK en linkt naar de tweede pagina.
Okee, dan zou ik er even een dagje overheen laten gaan. Dit soort diensten heeft ook vaak een caching van een flink aantal uren.
Ik krijg nu geen melding meer dat de image niet bestaat, maar ... hij vindt en toont nu de image (en de title en description) van de eerste pagina.
Ook als ik op de share button van de tweede pagina klik, geeft hij de image, title en description van de eerste pagina.
Toevoeging op 29/12/2017 22:14:31:
Beste Jan,
Bedankt tot zover ! Ik zal morgen weer eens kijken.
Hartelijke groet,
Richard.
Toevoeging op 30/12/2017 17:56:09:
Succes ! Naast de te kleine afmetingen van de image/foto, was er nog een tweede probleem: Sinds augustus 2017 heeft Facebook de mogelijkheid om een reeds geplaatste link op een pagina aan te passen qua tekst en afbeelding verwijderd. Zie hier de info hierover.
Ik had in eerste instantie, bij de tweede pagina de Open Graph statements uit de eerste pagina gekopieerd en gebruikt. Daarna liet Facebook niet meer toe die initiële instelling te veranderen. Toen ik diezelfde pagina met een nieuwe naam on-line zette, verschenen plotseling wel de nieuwe image en tekst wanneer ik op de share-button klikte.
Bedankt Jan Koehoorn en bedankt PHP-hulp !
Gewijzigd op 29/12/2017 22:07:42 door Richard Peelen