Erweiterte Meta Tags für Social Sharing

Suchmaschinenoptimierung (SEO) ist ein weites Feld das sich ständig neu erfindet. Ich bin weder ausgewiesener SEO Spezialist, auch würde es den Umfang dieser Seite sprengen auf alle Einzelheiten einzugehen. Hier also nur ein paar Basisc mit TYPO3 typischen Workaround.

Wer Facebook, google+ oder twitter share Funktionen auf seiner Seite nutzt, muss für diese auch die richtigen Metags zur Verfügung stellen - sonst nimmt z.B. Facebbok die ersten Texte und Bilder, was nicht immer gewünscht ist.

Sehen wir uns zunächst die kompletten Metatags für ein Social sharing in der html Ausgabe an:

 «head»
...
«!--Google Author markup --»
«link rel="author" href="https://plus.google.com/[Google+_Profile]/posts" /»
«link rel="publisher" href="”https://plus.google.com/[Google+_Page_Profile]"/" /»

«!--Google+ markup --»
«meta itemprop="name" content="The Name or Title Here" /»
«meta itemprop="description" content="This is the page description" /»
«meta itemprop="image" content="http://www.example.com/image.jpg" /»

«!--Facebook / Open Graph Markup --»
«meta property="og:title" content="Title Here" /»
«meta property="og:type" content="article" /»
«meta property="og:url" content="http://www.example.com/" /»
«meta property="og:image" content="http://example.com/image.jpg" /»
«meta property="og:description" content="Description Here" /»
«meta property="og:site_name" content="Site Name, i.e. Moz" /»
«meta property="article:published_time" content="2013-09-17T05:59:00+01:00" /»
«meta property="article:modified_time" content="2013-09-16T19:08:47+01:00" /»

«!--Twitter markup - Twitter has fallback to OG Tags --»
«meta name="twitter:card" content="summary" /»
«meta name="twitter:title" content="Page Title" /»
...

Das Einbinden der Metatags in das Seitensetup

Um im Seitensetup die Übersicht nicht zu verlieren, schreiben wir die kompletten Metatags in eine separate TypoScript Datei die wir inkludieren:

Datei: headerData.ts

lib.headerData {
    ... hier folgt das TS für unsere Metatags, siehe weiter unten
}

Datei setup.ts

«include_typoscript:source="FILE:fileadmin/myTemplate/TypoScript/headerData.ts"»
...
page.headerData.90 < lib.headerData
...

Der TypoScript Aufbau der Metatags

Datei headerData.ts

In den social Metatags wird die Felder “Meta -> Beschreibung” und “Meta -> Keywords” aus den Seiteneigenschaften herangezogen - diese müssen also befüllt sein. Als Bild nehmen wir ein Bild das in den Seiteneigenschaften zugeweisen wurde (mit rekursiver Suche).



Empfehlenswerte Lektüre:

Think Content!

Für jeden, der auf seiner Webseite besseren Content anbieten will, sollte dieses Buch zum Standardrepertoire gehören. Auf über 600 Seiten beschreibt die Autorin ganz ohne Hype aber mit vielen Praxistipps, Listen und Infos den Weg von der Idee zum erfolgreichem Webcontent.

Weitere Artikel zu diesem Thema:

Kommentare

keine Kommentare vorhanden


Kommentar verfassen

Die Email Adresse wird nicht veröffentlicht.