Durch die OXOMI Produktdaten-Integrationen wird Ihnen ermöglicht, produktbezogene Informationen wie Dokumentseiten, Videos, Bilder, Dateianhänge und Artikeldetails in Webseiten zu integrieren. Welche Art von Information Ihnen bereitgestellt wird, kann individuell gewählt werden.
Hierfür stehen im Detail die nachfolgenden JavaScript-Funktionen zur Verfügung:
- Die Nutzung von oxomi.fillProductData ermöglicht die effiziente Befüllung von HTML-Elementen mit Produktdaten. Die Integration sucht automatisch nach speziellen data-Attributen und fügt entsprechende Informationen in die Elemente ein.
- oxomi.productData bietet eine alternative Methode zur Informationsabfrage. Sie können gezielt Aufrufparameter verwenden, um individuelle Details zu einem Produkt abzurufen und in definierte DOM-Elemente zu integrieren.
- Mit oxomi.productDataExists können Sie vor dem eigentlichen Abruf von Produktinformationen überprüfen, ob die gewünschten Daten vorhanden sind. Dies ermöglicht eine effiziente Handhabung von Anfragen.
- oxomi.requestProductData ermöglicht es, gezielt Produktinformationen abzurufen. Die Produktinformationen werden dabei in einem JSON-Objekt zurückgegeben.
Hinweis
Entsprechend der untenstehenden Reihenfolge werden Parameter-Kombinationen ausgewertet, um Ihr gewünschtes Produkt zu identifizieren. Führt eine Kombination zur eindeutigen Identifikation eines Produktes, werden die weiteren Parameter-Kombinationen nicht mehr berücksichtigt.
- itemNumber (Artikelnummer) und supplierNumber (Lieferantennummer)
- gtin (GTIN / EAN)
- model (Modell-Bezeichnung) und supplierNumber (Lieferantennummer)
Die nachfolgenden Abschnitte geben einen detaillierten Einblick in jede Integration und zeigen, wie sie optimal genutzt werden können, um Ihre Webseiten mit aktuellen und relevanten Produktdaten anzureichern.
Die oxomi.fillProductData Integration bietet mit minimalem Entwicklungsaufwand effizienten und einfachen Zugang zu den vielfältigen OXOMI Produktdaten. Die Funktion sucht automatisch HTML-Elemente mit speziellen data-Attributen und füllt diese mit entsprechenden Produktinformationen.
Die Methode ermöglicht die Angabe eines Ziels via DOM-Element oder Selektor-String. Dies ist besonders nützlich, wenn auf komplexen Seiten nur bestimmte Elemente befüllt werden sollen. Die Suche nach relevanten Elementen wird dadurch vorab eingeschränkt und somit beschleunigt.
Ein wichtiges Merkmal dieser Integration ist, dass bereits bearbeitete Elemente markiert werden. Dadurch wird sichergestellt, dass bei erneutem Aufruf der JavaScript-Funktion diese Elemente nicht erneut befüllt werden. Diese Vorgehensweise trägt nicht nur zur besseren Performance bei, sondern ermöglicht auch die optimale Bündelung von Anfragen. Das bedeutet, dass mehrere Elemente mit nur einem Funktionsaufruf effizient befüllt werden können. Daher wird die Verwendung der oxomi.fillProductData gegenüber oxomi.productData empfohlen.
Attribute
Die nachfolgende Tabelle zeigt die möglichen data-Attribute, die von der Integration unterstützt werden.
Attribut | Typ | Beschreibung |
---|---|---|
data-oxomi-product-data | string |
Gibt den Informations-Typ an, der abgefragt werden soll. Die zur Verfügung stehenden Werte können hier eingesehen werden: Informationstypen |
data-oxomi-item-number | string |
Gibt die Artikelnummer des Produktes an, das abgefragt werden soll. |
data-oxomi-supplier-number | string |
Gibt die Lieferantennummer des Produktes an, das abgefragt werden soll. Hinweis:
|
data-oxomi-gtin | string |
Gibt alternativ zur Artikelnummer die GTIN des Produktes an, das abgefragt werden soll. |
data-oxomi-model | string |
Gibt alternativ zur Artikelnummer die Modell-Bezeichnung (Type) des Produktes an, das abgefragt werden soll. |
Parameter
Die nachfolgende Tabelle enthält eine Übersicht über die verfügbaren Parameter. Fett gedruckte Parameter sind Pflichtparameter. Die Beschreibung der Parameter enthält Informationen über den Typ des Parameters, die möglichen Werte und die Bedeutung sowie weitere Verwendungshinweise.
Parameter | Parametertyp | Beschreibung | target | string |
Gibt das Ziel-Element an, auf welches die Elemente Suche eingeschränkt werden soll. |
---|
Beispiel
Das folgende Beispiel zeigt, wie die Integration verwendet werden kann, um die Produktbilder eines Produktes anzuzeigen.<div data-oxomi-product-data="product-images" data-oxomi-supplier-number="SUPPLIER" data-oxomi-item-number="ARTIKELNR"> </div> <script type="text/javascript"> oxomi.fillProductData(); </script>Interaktives Code-Beispiel
Die oxomi.productData Integration stellt eine alternative Methode zum Befüllen von HTML-Elementen mit Produktdaten dar. Im Wesentlichen dient sie demselben Zweck wie oxomi.fillProductData, weicht jedoch in der Herangehensweise ab.
Im Gegensatz zur Verwendung von data-Attributen zur Identifizierung von zu befüllenden Elementen ermöglicht oxomi.productData die Übermittlung von Aufrufparametern. Diese definieren dann die Ziel-Elemente, in welche die entsprechenden Daten gerendert werden sollen. Die definierten Ziel-Elemente werden nur sichtbar geschaltet, sofern Daten für das angeforderte Produkt existieren.
Es ist wichtig zu beachten, dass oxomi.productData auf einen Produktdatensatz pro Aufruf beschränkt ist. Anders als bei der oxomi.fillProductData Integration, die mehrere Elemente auf einmal befüllen kann, erfordert oxomi.productData also einen separaten Aufruf für jeden Produktdatensatz. Diese Einschränkung sollte berücksichtigt werden, insbesondere wenn eine größere Anzahl verschiedener Produkte auf einer Seite dargestellt und mit Produktdaten aus OXOMI angereichert werden soll.
Parameter
Die nachfolgende Tabelle enthält eine Übersicht über die verfügbaren Parameter. Fett gedruckte Parameter sind Pflichtparameter. Die Beschreibung der Parameter enthält Informationen über den Typ des Parameters, die möglichen Werte und die Bedeutung sowie weitere Verwendungshinweise.
Parameter | Parametertyp | Beschreibung | |||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
information | Object |
Gibt die Informations-Typen und deren Ziel-Elemente sowie mögliche weitere Einstellungsparameter an. Die zur Verfügung stehenden Werte können hier eingesehen werden: Informationstypen Pro angefragtem Informations-Typ ist ein Objekt mit den folgenden Parametern anzugeben:
|
|||||||||||||||
products | Array |
Gibt die Artikelnummern und Lieferantennummern der Produkte an, die abgefragt werden sollen. Die so gefundenen Inhalte werden bei Abfrage mehrerer Produkte kombiniert und in die entsprechenden Ziel-Elemente gerendert. Gefundene Produktinformationen (z. B. Bilder, Anhänge, Merkmale, …) werden konsistent vom ersten in einem Datensatz gefundenen Produkt übernommen. Pro angefragtem Produkt ist ein Objekt mit den folgenden Parametern anzugeben:
|
Beispiel
Das folgende Beispiel zeigt, wie die Integration verwendet werden kann, um die Produktbilder, Anhänge und Videos eines Produktes in entsprechenden DOM-Elementen anzuzeigen.oxomi.productData({ products: [{ itemNumber: 'ARTIKELNR', supplierNumber: 'SUPPLIER' }], information: { 'product-images': { target: '#product-images' }, 'attachments': { target: '#product-attachments', limit: 5 } 'videos': { target: '#product-videos' includeOutdated: true } } });Interaktives Code-Beispiel
Die oxomi.productDataExists Funktion bietet eine Möglichkeit, zu überprüfen, ob bestimmte Informationen zu einem Produkt in OXOMI hinterlegt sind. Dieser Aufruf liefert ein Promise zurück, das mit einem Ergebnis-JSON-Objekt befüllt wird. Das JSON-Objekt gibt Auskunft darüber, welche der angefragten Produktinformationen verfügbar sind, dazu zählen beispielsweise Videos, Bilder, Anhänge und weitere relevante Daten.
Durch die Verwendung von oxomi.productDataExists kann vor dem eigentlichen Abruf von Produktinformationen festgestellt werden, ob die gewünschten Daten überhaupt vorhanden sind. Dies ermöglicht eine effiziente und gezielte Handhabung von Anfragen, da unnötige Abfragen vermieden werden können, wenn die benötigten Informationen nicht verfügbar sind.
Parameter
Die nachfolgende Tabelle enthält eine Übersicht über die verfügbaren Parameter. Fett gedruckte Parameter sind Pflichtparameter. Die Beschreibung der Parameter enthält Informationen über den Typ des Parameters, die möglichen Werte und die Bedeutung sowie weitere Verwendungshinweise.
Parameter | Parametertyp | Beschreibung |
---|---|---|
information | Object |
Gibt den Informations-Typen an, welcher überprüft werden soll. Die zur Verfügung stehenden Werte können hier eingesehen werden: Informationstypen |
itemNumber | string |
Gibt die Artikelnummer des Produkts an, für welches die Abfrage durch geführt werden soll. |
supplierNumber | string |
Gibt die Nummer des Lieferanten an, über welchen das Produkt bezogen wird. Hinweis:
|
gtin | string |
Gibt die GTIN des Produkts an, für welches die Abfrage durch geführt werden soll. |
model | string |
Gibt die Modell-Bezeichnung (Type) des Produkts an, für welches die Abfrage durch geführt werden soll. |
Beispiel
Das folgende Beispiel zeigt, wie die Integration verwendet werden kann, um zu überprüfen, ob ein Produkt Videos, Bilder und Anhänge enthält.oxomi.productDataExists({ itemNumber: 'ARTIKELNR', supplierNumber: 'SUPPLIER', information: ['product-images', 'attachments', 'videos'] });Die Antwort auf die Anfrage könnte wie folgt aussehen:
{ product-images: true attachments: false videos: true }
Um die Existenz von Daten mehrerer Produkte in einem einzigen Aufruf zu überprüfen, können Sie die Parameter der Integration durchnummerieren. Analog zur Produktdatenintegration wird für Inhalte hierbei die Existenz bekundet, wenn mindestens eins der angegebenen Produkte entsprechende Inhalte bereitstellt. Bei Produktinformationen (z. B. Bilder, Anhänge, Merkmale, …) wird die Existenz konsistent vom ersten in einem Datensatz gefundenen Produkt übernommen. Beispiel:
oxomi.productDataExists({ itemNumber1: 'ARTIKELNR', supplierNumber1: '-', itemNumber2: 'WERKSARTIKELNR', supplierNumber2: 'SUPPLIER', information: ['product-images', 'attachments', 'videos'] });
Die Funktion oxomi.requestProductData bietet eine Möglichkeit, gezielt Produktinformationen abzurufen. Dieser Aufruf liefert ein Promise zurück, das mit einem Ergebnis-JSON-Objekt befüllt wird. Das JSON-Objekt gibt Auskunft über die angeforderten Produktinformationen. Die Integration nutzt intern dabei die Produktdaten API V1. Daher können alle dort verfügbaren Parameter und Optionen auch in dieser Integration verwendet werden.
Die nachfolgende Tabelle enthält eine Übersicht über die verfügbaren Parameter. Fett gedruckte Parameter sind Pflichtparameter. Die Beschreibung der Parameter enthält Informationen über den Typ des Parameters, die möglichen Werte und die Bedeutung sowie weitere Verwendungshinweise.
Parameter | Parametertyp | Beschreibung |
---|---|---|
itemNumber | string |
Gibt die Artikelnummer des Produkts an, für welches die Abfrage durch geführt werden soll. |
itemNumberPrefix | string |
Gibt das Präfix für die Artikelnummer an. Hinweis:
|
supplierNumber | string |
Gibt die Nummer des Lieferanten an, über welchen das Produkt bezogen wird. Hinweis:
|
gtin | string |
Gibt die GTIN des Produkts an, für welches die Abfrage durch geführt werden soll. |
model | string |
Gibt die Modell-Bezeichnung (Type) des Produkts an, für welches die Abfrage durch geführt werden soll. |
queries | string |
Gibt die Art der Produktinformationen an, die abgefragt werden sollen. Die zur Verfügung stehenden Werte können hier eingesehen werden: Informationstypen |
Einzelinformationen
Die nachfolgende Tabelle zeigt die zur Verfügung stehenden Einzelinformationen an. Mit diesen können die einzelnen Informationen eines Produktes abgefragt werden.
Wert | Beschreibung | ||||||||||||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
properties |
Stellt die Eigenschaften eines Produkts zur Verfügung. |
||||||||||||||||||||||||||||||||||||||
videos |
Stellt die mit dem Produkt verknüpften Videos zur Verfügung. Die nachfolgende Tabelle enthält eine Übersicht über die verfügbaren Parameter. Fett gedruckte Parameter sind Pflichtparameter. Die Beschreibung der Parameter enthält Informationen über den Typ des Parameters, die möglichen Werte und die Bedeutung sowie weitere Verwendungshinweise.
|
||||||||||||||||||||||||||||||||||||||
spare-parts |
Stellt die Ersatzteilinformationen eines Produkts zur Verfügung. Die nachfolgende Tabelle enthält eine Übersicht über die verfügbaren Parameter. Fett gedruckte Parameter sind Pflichtparameter. Die Beschreibung der Parameter enthält Informationen über den Typ des Parameters, die möglichen Werte und die Bedeutung sowie weitere Verwendungshinweise.
|
||||||||||||||||||||||||||||||||||||||
building-phases |
Stellt die Bilder, Dateien und Videos eines Produkts gruppiert nach Bauphasen zur Verfügung. |
||||||||||||||||||||||||||||||||||||||
card |
Stellt die Produktkarte zur Darstellung in einer Liste zur Verfügung. Die nachfolgende Tabelle enthält eine Übersicht über die verfügbaren Parameter. Fett gedruckte Parameter sind Pflichtparameter. Die Beschreibung der Parameter enthält Informationen über den Typ des Parameters, die möglichen Werte und die Bedeutung sowie weitere Verwendungshinweise.
|
||||||||||||||||||||||||||||||||||||||
relationships |
Stellt die Beziehungen eines Produkts zur Verfügung. Die nachfolgende Tabelle enthält eine Übersicht über die verfügbaren Parameter. Fett gedruckte Parameter sind Pflichtparameter. Die Beschreibung der Parameter enthält Informationen über den Typ des Parameters, die möglichen Werte und die Bedeutung sowie weitere Verwendungshinweise.
|
||||||||||||||||||||||||||||||||||||||
galleries |
Stellt die mit dem Produkt verknüpften Exposés zur Verfügung. Die nachfolgende Tabelle enthält eine Übersicht über die verfügbaren Parameter. Fett gedruckte Parameter sind Pflichtparameter. Die Beschreibung der Parameter enthält Informationen über den Typ des Parameters, die möglichen Werte und die Bedeutung sowie weitere Verwendungshinweise.
|
||||||||||||||||||||||||||||||||||||||
pages |
Stellt die zum Produkt passenden Dokumentseiten zur Verfügung. Die nachfolgende Tabelle enthält eine Übersicht über die verfügbaren Parameter. Fett gedruckte Parameter sind Pflichtparameter. Die Beschreibung der Parameter enthält Informationen über den Typ des Parameters, die möglichen Werte und die Bedeutung sowie weitere Verwendungshinweise.
|
||||||||||||||||||||||||||||||||||||||
html-description |
Stellt den HTML-formatierten Beschreibungstext eines Produkts zur Verfügung. |
||||||||||||||||||||||||||||||||||||||
tender-text |
Stellt den HTML-formatierten Ausschreibungstext eines Produkts zur Verfügung. |
||||||||||||||||||||||||||||||||||||||
datasheet-story |
Stellt die aktive Hauptstory eines Produkts zur Verfügung. |
||||||||||||||||||||||||||||||||||||||
stories |
Stellt die mit dem Produkt verknüpften Stories zur Verfügung. Die nachfolgende Tabelle enthält eine Übersicht über die verfügbaren Parameter. Fett gedruckte Parameter sind Pflichtparameter. Die Beschreibung der Parameter enthält Informationen über den Typ des Parameters, die möglichen Werte und die Bedeutung sowie weitere Verwendungshinweise.
|
||||||||||||||||||||||||||||||||||||||
features |
Stellt die Merkmale eines Produkts zur Verfügung. |
||||||||||||||||||||||||||||||||||||||
commercial |
Stellt die gewerblichen Informationen eines Produkts zur Verfügung. Die nachfolgende Tabelle enthält eine Übersicht über die verfügbaren Parameter. Fett gedruckte Parameter sind Pflichtparameter. Die Beschreibung der Parameter enthält Informationen über den Typ des Parameters, die möglichen Werte und die Bedeutung sowie weitere Verwendungshinweise.
|
||||||||||||||||||||||||||||||||||||||
icons |
Stellt die Icons, Piktogramme und Gütesiegel eines Produkts zur Verfügung. Die nachfolgende Tabelle enthält eine Übersicht über die verfügbaren Parameter. Fett gedruckte Parameter sind Pflichtparameter. Die Beschreibung der Parameter enthält Informationen über den Typ des Parameters, die möglichen Werte und die Bedeutung sowie weitere Verwendungshinweise.
|
||||||||||||||||||||||||||||||||||||||
energy-label |
Stellt das ErP-Energielabel eines Produkts zur Verfügung. |
||||||||||||||||||||||||||||||||||||||
cover |
Stellt das Datenblatt-Titelbild eines Produkts zur Verfügung. |
||||||||||||||||||||||||||||||||||||||
attachments |
Stellt die Anhänge eines Produkts zur Verfügung. Die nachfolgende Tabelle enthält eine Übersicht über die verfügbaren Parameter. Fett gedruckte Parameter sind Pflichtparameter. Die Beschreibung der Parameter enthält Informationen über den Typ des Parameters, die möglichen Werte und die Bedeutung sowie weitere Verwendungshinweise.
|
||||||||||||||||||||||||||||||||||||||
product-images |
Stellt die Produkt-Abbildungen eines Produkts zur Verfügung. Die nachfolgende Tabelle enthält eine Übersicht über die verfügbaren Parameter. Fett gedruckte Parameter sind Pflichtparameter. Die Beschreibung der Parameter enthält Informationen über den Typ des Parameters, die möglichen Werte und die Bedeutung sowie weitere Verwendungshinweise.
|
||||||||||||||||||||||||||||||||||||||
measurements |
Stellt die Abmessungen eines Produkts zur Verfügung. |
Datenblatt-Blöcke
Die nachfolgende Tabelle zeigt die zur Verfügung stehenden Informationsblöcke an. Mit diesen können ganze Blöcke an Informationen abgefragt werden. Die Darstellung der Blöcke entspricht dabei der aus dem OXOMI-Datenblatt.
Wert | Beschreibung |
---|---|
relations | Rendert den Block „Beziehungen“ des Datenblatts. |
bim-3d | Rendert den Block „BIM / 3D“ des Datenblatts. |
details | Rendert den Block „Artikeldetails“ des Datenblatts. |
header | Rendert den Block „Kopfbereich“ des Datenblatts. |
related-files | Rendert den Block „Medien“ des Datenblatts. |
characteristics | Rendert den Block „Eigenschaften“ des Datenblatts. |
datasheet-story | Rendert den Block „Informationen“ des Datenblatts. |