Bild für Facebookeintrag über Like-Button
Veröffentlichungsdatum: 25. Januar 2012
Änderungsdatum: 11. Januar 2021
Bestimmen Sie, welches Bild bei Posting über den Button "Facebook Gefällt mir / Like Plug-In" auf der Facebookseite verwendet wird.
Beim Erstellen von Einträgen auf Facebookseiten über den Facebook Like-Button verwendet Facebook willkürlich ein Bild von der entsprechenden Seite. Um selber zu bestimmen, welches Bild beim Klick auf den "Gefällt mir" Button publiziert wird, nutzen Sie das von Facebook definierte Open Graph Konzept.
Bedienen Sie sich dazu den Mitteln von Weblication® CMS, um z.B. das als Vorschaubild (Thumbnail) hinterlegte Bild der entsprechenden Seite zu verwenden.
Das Beispiel führt an, wie Sie das erforderliche Meta-Tag im Head der Seite ausgeben. Als Grundlage wird das Vorschaubild der jeweiligen Seite verwendet. Wenn dies nicht vorhanden ist, wird ein Standardbild gesetzt (otherwise-Bereich).
BASE Mobile First
Auszug aus /[IHR-GLOBALES-PROJEKT]/wGlobal/layout/templates/globals/htmlHead.wGlobal.php
...
<xsl:template name="htmlHead">
...
<xsl:call-template name="insertOgData"/>
...
</xsl:template>
...
<!-- Fügt Open Graph Daten ein -->
<xsl:template name="insertOgData">
<wsl:php>
$pageThumbnail = '<xsl:value-of select="php:functionString('htmlspecialchars', php:functionString('wStringconverter::maskApos', /wd:document/wd:extension/wd:meta/wd:thumbnail/@src))"/>';
$pageThumbnailArea = '<xsl:value-of select="php:functionString('htmlspecialchars', php:functionString('wStringconverter::maskApos', /wd:document/wd:extension/wd:meta/wd:thumbnail/@area))"/>';
if(wEnv::getGlobalValue('pageThumbnail') != ''){
$pageThumbnail = htmlspecialchars(wEnv::getGlobalValue('pageThumbnail'));
if(wEnv::getGlobalValue('pageThumbnailArea') != ''){
$pageThumbnailArea = wEnv::getGlobalValue('pageThumbnailArea');
}
}
$wGlobalProjectPath = '<xsl:value-of select="$wGlobalProjectPath"/>';
<![CDATA[
if($pageThumbnail != ''){
if(preg_match('/\:\/\//', $pageThumbnail)){
print '<meta property="og:image" content="'.$pageThumbnail.'" />';
}
else{
$domain = wVariables::getValue('canonical_domain', $wGlobalProjectPath) != '' ? wVariables::getValue('canonical_domain', $wGlobalProjectPath) : wRequest::getDomain();
$pathOgImage = $pageThumbnail;
if(preg_match('/\|/', $pageThumbnailArea)){
$areaData = explode('|', $pageThumbnailArea);
$options = array();
$options['cutLeft'] = $areaData[0];
$options['cutTop'] = $areaData[1];
$options['cutWidth'] = $areaData[2];
$options['cutHeight'] = $areaData[3];
$pathOgImage = wThumbnail::createThumbnail($pageThumbnail, '400', '', 'crop', $options);
}
print '<meta property="og:image" content="'.$domain.$pathOgImage.'" />';
print '<meta property="thumbnail" content="'.$domain.$pathOgImage.'" />';
}
}
]]>
</wsl:php>
</xsl:template>
BASE Classic
Auszug aus /[IHR-GLOBALES-PROJEKT]/wGlobal/layout/templates/misc/includes.global.php
...
<!-- Fügt Open Graph Daten ein -->
<wsl:php>
$pageThumbnail = '<xsl:value-of select="php:functionString('htmlspecialchars', php:functionString('wStringconverter::maskApos', /wd:document/wd:extension/wd:meta/wd:thumbnail/@src))"/>';
$pageThumbnailArea = '<xsl:value-of select="php:functionString('htmlspecialchars', php:functionString('wStringconverter::maskApos', /wd:document/wd:extension/wd:meta/wd:thumbnail/@area))"/>';
if(wEnv::getGlobalValue('pageThumbnail') != ''){
$pageThumbnail = htmlspecialchars(wEnv::getGlobalValue('pageThumbnail'));
if(wEnv::getGlobalValue('pageThumbnailArea') != ''){
$pageThumbnailArea = wEnv::getGlobalValue('pageThumbnailArea');
}
}
$wGlobalProjectPath = '<xsl:value-of select="$wGlobalProjectPath"/>';
<![CDATA[
if($pageThumbnail != ''){
if(preg_match('/\:\/\//', $pageThumbnail)){
print '<meta property="og:image" content="'.pageThumbnail.'" />';
}
else{
$domain = wVariables::getValue('canonical_domain', $wGlobalProjectPath) != '' ? wVariables::getValue('canonical_domain', $wGlobalProjectPath) : wRequest::getDomain();
$pathOgImage = $pageThumbnail;
if(preg_match('/\|/', $pageThumbnailArea)){
$areaData = explode('|', $pageThumbnailArea);
$options = array();
$options['cutLeft'] = $areaData[0];
$options['cutTop'] = $areaData[1];
$options['cutWidth'] = $areaData[2];
$options['cutHeight'] = $areaData[3];
$pathOgImage = wThumbnail::createThumbnail($pageThumbnail, '400', '', 'crop', $options);
}
print '<meta property="og:image" content="'.$domain.$pathOgImage.'" />';
}
}
]]>
</wsl:php>
...