HowTo JSON-LD FAQ Page

So integrierst spielend leicht JSON-LD für Fragen&Antworten (FAQ) und kannst u.a. von der besonderen Darstellung z.B. in den SERPs von Google profitieren.

• du recherchierst W-Fragen zu deinem Produkt/Thema (wie das geht, steht in dem Abschnitt „Keyword Recherche“ meines Artikels Kostenlose Online-Marketingtools)
• du integrierst die Frage + Antwort mittels des Dialogs in deinem Editor
• speichere den Post/Page und Du findest im Frontend die vorformatierte und gemäß schema.org ausgezeichnete Inhaltsbox
• mit dem Haken bei „Render HTML“ kannst du entscheiden, ob der Inhalt auf Deiner Website angezeigt werden soll oder ob du nur das JSON-LD im Quellcode ausgeben möchtest

Sofern du Gutenberg in Deiner WordPress-Installation nutzt, musst Du auf nichts weiter achten. Auch wenn du mehrere Fragen auf einer Seite beantworten möchtest fügst du einfach innerhalb eines Blocks mehrere FAQ untereinander ein (HINWEIS: mehrere Fragen innerhalb eines Blocks – nicht mehrere Blöcke auf einer Seite).

In dem alten WordPress Editor (TinyMCE) ist das etwas komplizierter, da man mit Shortcodes arbeiten muss.
Das Problem: im TinyMCE funktionieren keine dynamischen Shortcodes. Ein Shortcode kann nur eine fix definierte Sache interpretieren. Multiple Fragen sind aber eben dynamisch (1 – n Fragen&Antworten).
Deswegen haben wir uns entschieden zwei Shortcodes anzubieten:

• Single FAQ – gedacht, wenn Du nur eine FAQ hast und damit in die Answer-Box bei Google möchtest. Hier kannst du die Antwort auch gestalten und u.a. mit Links versehen
• Multi FAQ – gedacht für mehrere FAQ auf einer Seite, um z.B. Dein Snippet bei Google zu erweitern. Links kann man hier nicht in die Antwort einfügen, da die Anführungsstriche im HTML innerhalb eines Shortcodes vom TinyMCE automatisch entfernt werden.

<script type="application/ld+json">
    {
        "@context": "https://schema.org",
        "@type": "FAQPage",
        "mainEntity": [
                    {
                "@type": "Question",
                "name": "W-Frage 1?",
                "acceptedAnswer": {
                    "@type": "Answer",
                    "text": "Man kann die Inhalte auch <a href=\"https://deineURL.com\">formatieren<\/a> z.B. als <b>LISTE</b>:\n<ul><li>Listenpunkt 1<\/li><li>Listenpunkt 2<\/li><li>Listenpunkt 3<\/li><li>Listenpunkt 4<\/li><\/ul>"
                    },
                "image" : {
                        "@type" : "ImageObject",
                        "contentUrl" : "https://www.meine-url.de/pfad/zum/bild.jpg"
                    }
            	},
	        {
                "@type": "Question",
                "name": "W-Frage 2?",
                "acceptedAnswer": {
                    "@type": "Answer",
                    "text": "Eine weitere Antwort und falls Du magst auch ein <a href=\"https://deineURL.com\">Link<\/a>."
                    }
                 },
                 {
                "@type": "Question",
                "name": "W-Frage 3?",
                "acceptedAnswer": {
                    "@type": "Answer",
                    "text": "Einfach nur eine Textantwort. Nutzt z.B. die Cliffhanger-Technik, um die Klicks zu erhalten."
                     }   
                }
         ]
    }
</script>

#Einstellungen im Gutenberg-FAQ-Block vornehmen

Einfach rechts am Rand in den Block-Einstellungen klicken. Wichtig: den ganzen Block auswählen, nicht die einzelnen Fragen … 😉

#Shortcode für Single FAQ im TinyMCE

[sc_fs_faq sc_id="fs_faqUniqueID" html="true/false" headline="p or h2-h6" img="img-id-231" question="Deine Frage" img_alt="img-alt text" css_class="your-class"]Deine Antwort – diese kannst du formatieren wie Du magst; inkl. Links[/sc_fs_faq]

#Shortcode für Multi FAQ im TinyMCE

[sc_fs_multi_faq headline-0="h3" question-0="Deine Frage 1" answer-0="Deine Antwort 1" image-0="" headline-1="h3" question-1="Deine Frage 2" answer-1="Deine Antwort 2" image-1="" headline-2="h2" question-2="Deine Frage 3" answer-2="Deine Antwort" count="3" html="true" css_class=""]

#FAQ

#Screenshots