Twitter Cards a WordPress plugin Jetpack

Plugin Jetpack doplňuje do CMS WordPress funkce, které dostanete na cloudovém řešení WordPress.com, mj. statistiky. Nedávno jsem na firemním webu Some move potřeboval nastavit metadata pro Twitter Card, o kterou jsme u Twitteru zažádali, ale plugin v defaultní instalaci vytváří chybné metainformace odkazující právě na profil Jetpacku. Nastavení znamenalo úpravu tématu a hledání na fórech.

Aby Twitter Card na webové stránce fungoval, musí obsahovat hlavička následující meta tagy.

<meta name="twitter:card" content="summary">
<meta name="twitter:domain" content="somemove.cz">
<meta name="twitter:site" content="@Somemove">
<meta name="twitter:creator" content="@Somemove">
<meta name="twitter:image:src" content="http://somemove.cz/wp-content/uploads/2013/09/somemove_logo.png">
<meta name="twitter:description" content="Some move, some don't... Sociální sítě, zákaznická péče a kvalita služeb v dopravě.">
<meta name="twitter:title" content="Some move">
<meta name="twitter:url" content="http://somemove.cz/">

Pokud vás napadá nejjednodušší řešení otevřít header.php příslušného tématu webu a tyto HTML tagy tam vložit, nebude to fungovat. Jetpack totiž kromě toho vloží duplicitní značky obsahující odkaz na profil @Jetpack.

Namísto toho musíte použít functions.php šablony a donutit Jetpack, aby pro získání metadat použil funkci, která defaultní hodnoty přemapuje na ty správné.

function tweakjp_custom_twitter_site( $og_tags ) {
  $og_tags['twitter:site'] = '@Somemove';
  $og_tags['twitter:card'] = 'summary';
  $og_tags['twitter:title'] = 'Some move';
  $og_tags['twitter:description'] = 'Some move, some don't... Sociální sítě, zákaznická péče a kvalita služeb v dopravě.';
  $og_tags['twitter:creator'] = '@Somemove';
  $og_tags['twitter:domain'] = 'somemove.cz';
  $og_tags['twitter:image:src'] = 'http://somemove.cz/wp-content/uploads/2013/09/somemove_logo.png';
  return $og_tags;
}

add_filter( 'jetpack_open_graph_tags', 'tweakjp_custom_twitter_site', 11 );

Twitter Cards jsou tzv. rich snippet, který se ukazuje pod Twitter příspěvky daného profilu a odkazuje na zadaný web spolu s uvedením dalších rozšiřujících informací. Po schválení by měla karta vypadat následovně.

Test Some move Twitter Card (summary)