Produkt-FAQs aus JTL-Wawi-Funktionsattributen auf der Artikeldetailseite als sichtbaren Accordion-Block plus maschinenlesbares FAQPage-JSON-LD in JTL-Shop ausgeben.
| Bereich | Funktion |
|---|---|
| Frontend | Sichtbarer FAQ-Accordion auf der Artikeldetailseite |
| SEO | FAQPage-JSON-LD im Seitenkopf |
| Datenquelle | Eigene Felder bzw. Funktionsattribute aus JTL-Wawi |
| Backend | Einstellungen, Anleitung und Diagnose-Übersicht |
| Styling | Neutrales Standard-CSS plus optionales eigenes CSS |
| Voraussetzung | Wert |
|---|---|
| JTL-Shop | 5.6.0+ |
| PHP | 8.1+ |
- Plugin-Ordner
faqpage_produktals ZIP packen. - ZIP im JTL-Shop Backend unter Plugins hochladen und installieren.
- Plugin aktivieren.
- FAQ-Felder in JTL-Wawi anlegen, für den Shop freigeben und einen Artikel-Abgleich starten.
- Artikel mit FAQ-Daten im Shop prüfen.
Hinweis: Wenn keine Einstellungen sichtbar sind, das Plugin aktualisieren oder einmal neu installieren. JTL übernimmt Backend-Einstellungen aus der info.xml beim Installations- oder Update-Lauf.
Die FAQ-Felder kommen aus der JTL-Wawi. Sie müssen dort als eigene Felder bzw. Funktionsattribute angelegt und für den Shop freigegeben sein.
Ein FAQ-Eintrag wird nur ausgegeben, wenn Frage und Antwort gefüllt sind.
| FAQ | Eigenes Feld für die Frage | Eigenes Feld für die Antwort |
|---|---|---|
| Frage 1 | faq1 |
faq1antwort |
| Frage 2 | faq2 |
faq2antwort |
| Frage 3 | faq3 |
faq3antwort |
| Frage 4 | faq4 |
faq4antwort |
| Frage 5 | faq5 |
faq5antwort |
| Einstellung | Standard |
|---|---|
| FAQ-Ausgabe aktivieren | Ja |
| FAQPage JSON-LD ausgeben | Ja |
| Maximale FAQ-Anzahl | 5 |
| Selector | .tab-content-wrapper > .desc |
| Einfügemethode | Nach dem Element |
| Zusätzliche Styles | leer |
| Debug-Logging | Nein |
Der FAQ-Block wird am konfigurierten Selector eingefügt. Über die Einfügemethode wird festgelegt, ob der Block im Element, vor dem Element oder nach dem Element erscheint.
Der Standard .tab-content-wrapper > .desc plus Nach dem Element passt zu einem Snackys-Beispiel. Andere Templates können andere Selektoren benötigen.
| Situation | Selector | Einfügemethode |
|---|---|---|
| Nach der Artikelbeschreibung | .tab-content-wrapper > .desc |
Nach dem Element |
| Nach einem allgemeinen Beschreibungsblock | .desc |
Nach dem Element |
| Am Ende des Produktbereichs | .product-detail |
Im Element am Ende |
| Am Ende eines Produkt-Info-Bereichs | .product-info-inner |
Im Element am Ende |
| Nur zum Testen | body |
Im Element am Ende |
Auf der Artikeldetailseite die Browser-Konsole öffnen und den geplanten Selector testen:
document.querySelectorAll('.tab-content-wrapper > .desc').length| Ergebnis | Bedeutung |
|---|---|
0 |
Selector passt nicht zum Template |
1 |
Ideal, das Plugin findet genau eine Zielposition |
Mehr als 1 |
Der erste Treffer wird verwendet, besser einen genaueren Selector wählen |
| Prüfung | Erwartung |
|---|---|
| Backend-Tab Übersicht | FAQ-Anzahl größer als 0 |
| Selector-Treffer | Idealerweise 1 |
| Frontend | Sichtbarer Block Häufige Fragen |
| Quellcode | application/ld+json mit FAQPage-Daten |
- Antworten dürfen einfache HTML-Formatierung enthalten, z. B.
<br>,<strong>,<em>, Listen und Links. - Das JSON-LD wird automatisch als Plain Text ausgegeben.
- In Zusätzliche Styles kann eigenes CSS ohne
<style>-Tag eingetragen werden.
Entwickelt von upbox.