Sie sind hier: Startseite > CMSimple_XH > Plugins > OGra_XH

Plugin OGra_XH für CMSimple_XH

Diese Funktionserweiterung erstellt:

  • Strukturierte Daten (JSON-LD - JavaScript Object Notation for Linked Data) hauptsächlich für Google entsprechend schema.org zur Optimierung von SERP-Snippets (SERP = Search Engine Results Page).
  • Die Open Graph-Tags für Social-Media-Dienste (Facebook, XING, LinkedIn u.a) entsprechend dem Open Graph Protocol.
  • Und Tags für Twitter Card entsprechend developer.twitter.com.

OGra_XH arbeitet sehr gut mit dem Plugin Meta-Tags-Plus zusammen.
Es ist empfohlen, dieses Plugin zusammen mit Shariff_XH einzusetzen.

 

JSON-LD-LOGO

🔗

JSON-LD Logo

Kann für einzelne Seiten, unabhängig der allgemeinen Pluginkonfiguration, aktiviert und deaktiviert werden.

  • @type
    • Brand für Markennamen,
      Organization für alles andere (Firma, Verein, ...).
    • kann über den (Editor)Tab JSON-LD angepasst werden
  • url
    • URL der Seite
    • wird automatisch erzeugt
  • name
    • Name für das Produkt, den Verein, die Firma , ... wofür das Logo gedacht ist.
    • kann über den (Editor)Tab JSON-LD angepasst werden
  • logo
    • URL eines Bildes zur Seite (.webp, .jpg, .png, .gif)
      Nicht alle Plattformen unterstützen aktuell bereits .webp!
    • empfohlen min. 112 x 112 px
    • Ist ein Standardbild hinterlegt (Pluginkonfiguration) und ist für die Seite kein explizites Bild hinterlegt, wird dieses eingebunden.
    • kann über den (Editor)Tab JSON-LD angepasst werden
    • Für den Upload und die Verwaltung der Bilder bitte den Filemanager von CMSimple_XH nutzen!

JSON-LD

🔗

JSON-LD

Kann für einzelne Seiten, unabhängig der allgemeinen Pluginkonfiguration, aktiviert und deaktiviert werden.

  • @type
    • WebSite für erste veröffentlichte Seite
    • WebPage für alle anderen Seiten
    • wird automatisch erzeugt
  • name
    • Titel der Seite
    • als Standard wird der Seitentitel übernommen
    • kann über den (Editor)Tab JSON-LD angepasst werden
    • empfohlen max. 60 - 90 Zeichen
  • headline
    • entspricht name
  • alternateName
    • Name der Website
    • wird automatisch erzeugt
    • übernimmt den Namen aus der CMSimple_XH-Sprachdatei
  • description
    • Beschreibung der Seite
    • als Standard wird die (Meta)Seitenbeschreibung übernommen
    • kann über den (Editor)Tab JSON-LD angepasst werden
    • empfohlen max. 290 Zeichen
  • dateModified
    • Zeitpunkt der letzten Änderung
    • wird automatisch erzeugt
  • url
    • URL der Seite
    • wird automatisch erzeugt
  • author
    author @type
    • Person für nur einen Autor, Organization für alles andere (Firma, Verein, ...).
    • kann über den (Editor)Tab JSON-LD angepasst werden
  • author name
    • bei Person nur einen Autor, bei Organization Firma, Verein, ... (voriges Feld).
    • kann über den (Editor)Tab JSON-LD angepasst werden
  • author url
    • Autorenhomepage
    • kann über den (Editor)Tab JSON-LD angepasst werden
  • author sameas
    • zusätzliche URL's, z.B. Twitter, Facebook o.ä. (https://twitter.com/Accountname). Eine URL pro Zeile.
    • kann über den (Editor)Tab JSON-LD angepasst werden
  • image
    @type "ImageObject"
    url
    • URL eines Bildes zur Seite (.webp, .jpg, .png, .gif)
      Nicht alle Plattformen unterstützen aktuell bereits .webp!
    • Ist ein Standardbild hinterlegt (Pluginkonfiguration) und ist für die Seite kein explizites Bild hinterlegt, wird dieses eingebunden.
    • kann über den (Editor)Tab JSON-LD angepasst werden
    • Seitenverhältnis von 5 : 2, empfohlen min. 400 px breit.
    • Für den Upload und die Verwaltung der Bilder bitte den Filemanager von CMSimple_XH nutzen!
    width
    • Bildbreite
    • wird automatisch erzeugt
    height
    • Bildhöhe
    • wird automatisch erzeugt

JSON-LD-plus

🔗

Zusätzlich, JSON-LD

quick and dirty - Lösung, um JSON-LD einzusetzen.

Es muss ein vollständiges, fehlerfreies Script sein.

Das geht natürlich auch per Editor, direkt in den Content. Aber dieser muss erst angepasst werden, damit der Editor die Scripte bei der Codebereinigung nicht gleich wieder beseitigt.
Außerdem ist es kein schönes Arbeiten, wenn solche Mengen Script im Editor zu sehen sind.

Beispiel:

<script type="application/ld+json">{
"@context": "https://www.schema.org",
"@type": "Organization",
"name": "Musterunternehmen",
"url": "https://www.domain.tld/",
"logo": "https://www.domain.tld/logo.png",
"description": "Beschreibung des Unternehmens",
"address": {
"@type": "PostalAddress",
"addressLocality": "Musterstadt",
"postalCode": "123456",
"streetAddress": "Musterstraße 10"
}}</script>

 

Das Ergebnis (Beispiel: cmsimple-xh.org) kann, je nach angegebenen Daten, so aussehen.

OGra_XH Snippet Optimierung
OGra_XH Snippet Optimierung

Google Testtool strukturierte Daten (für diese Seite)

 

Open-Graph

🔗

Open Graph

  • og:type
    • website für die Startseite, article für alle anderen Seiten
    • wird automatisch erzeugt
  • og:locale
    • Lokalisierung
    • wird automatisch erzeugt
    • Grundeinstellung muss über die Pluginkonfiguration erfolgen
          en=en_GB
          de=de_DE
          fr=fr_FR
          sk=sk_SK
          …
          language_TERRITORY
    • SO-639-1-Codes für Sprachen
    • ISO-3166-1-alpha-2-Codes für Länder
  • og_title
    • Titel der Seite
    • als Standard wird der Seitentitel übernommen
    • kann über den (Editor)Tab OpenGraph angepasst werden
    • empfohlen max. 60 - 90 Zeichen
  • og:site_name
    • Name der Website
    • wird automatisch erzeugt
    • übernimmt den Namen aus der XH-Sprachdatei
  • og:description
    • Beschreibung der Seite
    • als Standard wird die (Meta)Seitenbeschreibung übernommen
    • kann über den (Editor)Tab OpenGraph angepasst werden
    • empfohlen max. 300 Zeichen
  • og:url
    • URL der Seite
    • wird automatisch erzeugt
  • og:updated_time
    • Zeitpunkt der letzten Änderung
    • wird automatisch erzeugt
  • og:image
    • URL eines Bildes zur Seite (.webp, .jpg, .png, .gif)
      Nicht alle Plattformen unterstützen aktuell bereits .webp!
    • Ist ein Standardbild hinterlegt (Pluginkonfiguration) und ist für die Seite kein explizites Bild hinterlegt, wird dieses eingebunden.
    • kann über den (Editor)Tab OpenGraph angepasst werden
    • Seitenverhältnis von 1,91 : 1
    • Standard 600 x 315 Pixel
    • Empfehlung 1200 x 630 Pixel
    • Minimum: 200 x 200 Pixel – das Bild wird als kleines Quadrat angezeigt – nicht zu empfehlen
    • Für den Upload und die Verwaltung der Bilder bitte den Filemanager von CMSimple_XH nutzen!
    og:image:alt
    • Alternativtext für das Bild
    • kann nur im (Editor)Tab OpenGraph gesetzt werden
    • nur für individuelles Bild, gesetzt im (Editor)Tab OpenGraph
    og:image:type
    • Bildtyp (image/webp, image/jpg, ...)
    • wird automatisch erzeugt
    og:image:width
    • Bildbreite
    • wird automatisch erzeugt
    og:image:height
    • Bildhöhe
    • wird automatisch erzeugt

 

Das Ergebnis (Beispiel: cmsimple-xh.org) kann, je nach angegebenen Daten und Bildern, so aussehen.

 

OGra_XH Vorschau Facebook

Open Graph Preview für Chrome

Open Graph Preview für Firefox

Facebook Sharing Debugger

 

Twitter-Card

🔗

Twitter Card

  • twitter:card
    • summary oder summary_large_image
    • Standard wird in der Pluginkonfiguration festgelegt
    • kann über den (Editor)Tab Twitter angepasst werden
  • twitter:title
    • Titel der Seite
    • als Standard wird der Seitentitel übernommen
    • kann über den (Editor)Tab Twitter angepasst werden
    • empfohlen max. 60 - 70 Zeichen
  • twitter:description
    • Beschreibung der Seite
    • als Standard wird die (Meta)Seitenbeschreibung übernommen
    • kann über den (Editor)Tab Twitter angepasst werden
    • empfohlen max. 200 Zeichen
  • twitter:url
    • URL der Seite
    • wird automatisch erzeugt
  • twitter:image
    • URL eines Bildes zur Seite (.webp, .jpg, .png, .gif)
      Nicht alle Plattformen unterstützen aktuell bereits .webp!
    • Ist ein Standardbild hinterlegt (Pluginkonfiguration) und ist für die Seite kein explizites Bild hinterlegt, wird dieses eingebunden.
    • kann über den (Editor)Tab Twitter angepasst werden
    • Empfehlung 400 x 400 Pixel (min. 200 x 200 Pixel) bei summary
    • entgegen der offiziellen Angabe 440 x 220 px, funtioniert 600 X 315 Pixel bei summary_large_image am besten
    • Für den Upload und die Verwaltung der Bilder bitte den Filemanager von CMSimple_XH nutzen!
    twitter:image:alt
    • Alternativtext für das Bild
    • kann nur im (Editor)Tab Twitter gesetzt werden
    • nur für individuelles Bild, gesetzt im (Editor)Tab Twitter
  • twitter:site
    • Twitter-Account (@TweetAccount)
    • Standard wird in der Pluginkonfiguration festgelegt
    • kann über den (Editor)Tab Twitter angepasst werden

 

Das Ergebnis (Beispiel: cmsimple-xh.org) kann, je nach angegebenen Daten und Bildern, so aussehen.

OGra_XH Vorschau Twitter (summary)

Twitter Card Validator (summary)

 

OGra_XH Vorschau Twitter (summary_large_image)

Twitter Card Validator (summary_large_image)

 Installation

PHP ab Version 7.4
(Sie sollten min. Version 8.0 einsetzen!, Stand 08/2023)

Für CMSimple_XH Versionen 1.7.0 - 1.7.6. Frühere Versionen wurden nicht getestet.

Um das Plugin zu installieren, einfach den entpackten Ordner plugins/ogra/ in den Pluginordner laden.

Unter /userfiles/images/ muss der Ordner ogra_xh vorhanden sein (/userfiles/images/ogra_xh/). Entweder manuell anlegen, oder aus dem Installationspaket kopieren!

Möglicherweise, abhängig vom Webserver müssen noch Dateirechte angepasst werden.
Wird PHP als CGI oder FastCGI ausgeführt, ist ein Anpassen der Dateirechte nicht notwendig.
Wenn PHP als Apache-Modul ausgeführt wird, müssen noch Rechte für

folgende Dateien:

  • die Konfigurationsdatei (/plugins/ogra/config/config.php)
  • den Stylesheet (/plugins/ogra/css/stylesheet.css)
  • und die entsprechende(n) Sprachdatei(en) (/plugins/ogra/languages/xx.php)

geändert werden (0666), falls man diese über das Backend bearbeiten möchte.

Die Ordner:

  • /plugins/ogra/config/
  • /plugins/ogra/css/
  • /plugins/ogra/languages/
  • /userfiles/images/ogra_xh/

benötigen 0777.

Alle Voraussetzungen lassen sich auf der Startseite des Plugins prüfen.
Für Open Graph muss im Template der html-Tag angepasst werden.

<html>

bzw.

<html lang="<?php echo $sl;?>">

erweitern um   →  prefix="og: http://ogp.me/ns#"

Das Ergebnis muss so aussehen:

<html prefix="og: http://ogp.me/ns#">

bzw.

<html prefix="og: http://ogp.me/ns#" lang="<?php echo $sl;?>">.

 https://filezilla-project.org

FileZilla Client Tutorial (de)

  • 644 - der Standardwert für Dateien - nur der FTP-Benutzer kann Dateien ändern / schreiben
  • 666 - auch PHP-Prozesse können Dateien beschreiben.
  • 755 - der Standardwert für Ordner - nur der FTP-Benutzer kann Dateien ändern / schreiben
  • 777 - der Ordner hat Vollzugriff, d.h. auch Scripte können darin schreiben.

Logo Ogra_XH Fragen, Hinweise, Fehlermeldungen zu OGra_XH

 OGra_XH im CMSimple_XH Forum

Gern nehme ich auch Informationen entgegen, auf welchen Seiten das Plugin OGra_XH eingesetzt wird.
Ich möchte keine Statistik führen oder gar veröffentlichen. Es geht einfach darum, zu wissen, ob weiteres Arbeiten an diesem Plugin sinnvoll ist.

 

OGra_XH kann unter Einhaltung der GPLv3 verwendet werden.

 

Für CMSimple_XH Versionen 1.7.0 - 1.7.6.

Update von Version 1.0 RC1
Für die Versionen vor 1.0 RC1 ist das Update nicht getestet.

 

Softwareentwicklung ist teilweise sehr aufwendig und findet, für jede hier angebotene Software, in meiner Freizeit statt. Daher freue ich mich über jede Unterstützung. Zum Teil wird damit z.B. einfach diese Website finanziert.
Außerdem bringt eine kleine Anerkennung zwischendurch immer wieder etwas Schwung in die Entwicklung.

 Kaf­fee­kas­se

Stichwortliste: CMSimple, CMSimple_XH, Funktionserweiterung, Meta-Tags-Plus, OGra_XH, Ogra_XH, Plugin, Plugins, Shariff_XH, XH