In einigen Situationen bietet es sich an, ausschließlich einzelne Produkt-Informationen ausgeben zu lassen. So unter anderem, wenn im Fließtext nur der Preis oder der Titel ausgegeben werden soll.
Aber auch beim Erstellen von eigenen Vergleichstabellen möchte man schließlich nur “einzelne” Details oder Informationen zum Vergleichen ausgeben lassen. Mit unserer Datenfeld-Funktion (“Fields”) ist genau dies möglich.
Was sind Datenfelder und wie können sie genutzt werden? #
Mit den sogenannten Datenfeldern können einzelne Produktdaten wie z. B. der Titel, die Beschreibung oder auch die “Kaufen”-Buttons auf einfache Weise via Shortcode innerhalb eines Fließtextes, einer HTML-Tabelle (z. B. Vergleichstabelle) oder auch direkt in einem PHP-Template platziert werden. Das Schöne daran: diese Produkt-Informationen werden nach der Platzierung auch vollkommen automatisch aktualisiert. Sprich, ändert sich in Amazon z. B. der Preis, wird dieser auch in den Datenfeldern übernommen.
Für die Ausgabe von Produkt-Informationen auf der eigenen Webseite ist es somit nicht zwingend notwendig, dass eine oder mehrere Produktboxen platziert werden. Denn die Datenfelder haben einen entscheidenden Vorteil: Neben der Ausgabe einzelner Produkt-Informationen können sie zudem an jeder beliebigen Stelle innerhalb der Webseite platziert werden.
Wie das Ganze aussehen kann, möchten wir dir heute mit diesem Tutorial einmal genauer zeigen.
Datenfeld-Ausgabe innerhalb einer HTML-Tabelle #
Du möchtest die Datenfelder einfach über eine einfache HTML-Tabelle ausgeben lassen, welche du über den WordPress-Editor erstellt hast? Kein Problem, denn das ist wirklich ganz einfach.
HTML-Tabelle in WordPress erstellen #
Hierzu rufst du dir in WordPress eine neue Seite oder einen neuen Beitrag auf und erstellst im Gutenberg-Editor einen neuen Block, mit Klick auf das Plus-Symbol.
Im Anschluss öffnet sich ein Auswahl-Menü, in welchem dir die meistgenutzten Blöcke angezeigt werden. Wird dir der Tabellen-Block nicht angezeigt, kannst du diesen einfach über das Suchfeld suchen.
Klicke hier auf “Tabelle” und dir wird im Anschluss ein Menü angezeigt, in dem du deine Tabellenformatierung festlegen kannst.
Hier kannst du dann ganz einfach, die Anzahl deiner Spalten sowie die Anzahl der von dir gewünschten Zeilen festlegen. Um die Tabelle erstellen zu können klicke einfach auf den Button “Tabelle erstellen“.
Mit dem Klick auf “Tabelle erstellen” wird dir die fertige Tabelle im WordPress-Editor angezeigt.
Du hast jetzt die Möglichkeit, in den folgenden Tabellen-Feldern, die sogenannten Datenfelder für die Ausgabe von einzelnen Produktinformationen zu hinterlegen.
Datenfelder in HTML-Tabelle hinterlegen #
Wir zeigen dir nun beispielhaft, wie du die Datenfelder innerhalb einer HTML-Tabelle verwenden kannst. Wenn du dieses Tutorial gerade nutzt, um parallel eine Tabelle zu erstellen, rufe dir am besten die Dokumentation für die Datenfelder auf, denn hier findest du alle Shortcode-Beispiele, welche wir ebenfalls gleich nutzen werden.
In unserem Beispiel erstellen wir eine simple Tabelle mit 3 Produkten. Hierzu geben wir über die Datenfelder zum einen den Produkt-Titel, das Produktbild, den Verkaufspreis, den “Kaufen”-Button sowie das Datum der letzten Aktualisierung aus.
Was wir zusätzlich zu den Shortcodes, welche du wie eben angesprochen in der Dokumentation findest, jetzt noch brauchen, sind die ASIN der Produkte, welche du innerhalb der Tabelle anzeigen lassen möchtest. Die ASIN für ein Produkt findest du auf der jeweiligen Produktseite im Amazon Shop in den Produktinformationen.
Im Anschluss kannst du die Shortcodes inklusive der ASIN in deiner HTML-Tabelle im WordPress-Editor hinterlegen. In unserem Beispiel sieht das Ganze nun wie folgt aus:
Wie du siehst, haben wir in jeder Spalte ein Produkt aufgelistet mit jeweils dem Shortcode für die Ausgabe des Produkt-Bildes, Produkt-Titels, Produkt-Preises, des Kaufen-Buttons sowie des Datums der letzten Aktualisierung.
Du kannst mithilfe der Datenfelder natürlich noch viele weitere Produkt-Informationen wie z. B. die Produkt-Beschreibung, die Anzahl der Bewertungen, die aktuelle Ersparnis, das Prime-Logo und vieles mehr ausgeben. Hierzu musst du einfach die entsprechenden “value”-Parameter (siehe Dokumentation) anpassen.
Wenn wir nun auf “Vorschau” klicken, sehen wir unsere zuvor im Gutenberg-Editor angelegte HTML-Tabelle inklusive der drei Produkte, welche wir über die Datenfeld-Shortcodes ausgeben lassen.
Solltest du aktuell noch den Classic-Editor nutzen, kannst du hier natürlich ebenfalls ganz einfach eine HTML-Tabelle erstellen. Hierzu benötigst du nur die entsprechenden HTML-Tags, welche du im Anschluss in den Classic-Editor einfügen kannst.
Beispielsweise wie folgt:
<table>
<tbody>
<tr>
<th>Spalte 1</th>
<th>Spalte 2</th>
<th>Spalte 3</th>
</tr>
<tr>
<td>Inhalt 1</td>
<td>Inhalt 2</td>
<td>Inhalt 3</td>
</tr>
<tr>
<td>Inhalt 4</td>
<td>Inhalt 5</td>
<td>Inhalt 6</td>
</tr>
</tbody>
</table>Diesen HTML-Code kannst du im Classic-Editor via Text bzw. HTML-Ansicht einfügen und schon hast du auch hier eine HTML-Tabelle erstellt.
Datenfelder innerhalb des Fließtextes ausgeben #
Die Ausgabe von Datenfeldern innerhalb eines Fließtextes funktioniert natürlich genauso einfach, wie auch die Ausgabe innerhalb einer von dir erstellten HTML-Tabelle. Das bedeutet, möchtest du Produkt-Informationen wie z. B. den Preis oder den Titel im Fließtext ausgeben lassen, musst du nur den Shortcode an der Stelle platzieren, wo die Informationen im Text angezeigt werden sollen.
Beispiel 1: Preis #
Das Produkt XY ist versandkostenfrei erhältlich, kostet
[amazon fields="B00WLI5E3M" value="price"]
und wird bereits morgen geliefert.
Ausgabe:
Beispiel 2: Titel #
Das Produkt
[amazon fields="B00WLI5E3M" value="title"]ist versandkostenfrei erhältlich und wird bereits morgen geliefert.
Ausgabe:
Dies kannst du selbstverständlich mit jeder Art von zur Verfügung stehendem Parameter machen. Es spielt dabei auch keine Rolle, wo sich dieser Fließtext innerhalb deiner Seite befindet. Egal ob in einem Beitrag, einer Seite, der Sidebar, dem Header oder dem Footer.
Fazit #
Mithilfe der Datenfelder bietet unser Plugin eine flexible Möglichkeit, einzelne Produkt-Informationen genau dort zu platzieren, wo du sie haben möchtest. Wie in unserer kleinen Anleitung gezeigt, kannst du Datenfelder innerhalb eines Fließtextes oder auch in von dir selbst erstellten HTML-Tabellen integrieren.
Für die Integration in eigene PHP-Templates funktioniert dies ebenso. Nutze für das Erstellen eigener Templates folgende Anleitung in unserer Dokumentation.