Modularer Inhalt deckt einen anderen Anwendungsfall ab als Seiten und Magazine. Anstelle großer Mengen von Modulen wird meist nur ein Modul in eine bestimmte Vorlage eingebettet, die auch Inhalte aus verschiedenen Quellen enthält.
Modular ContentModularer Inhalt deckt einen anderen Anwendungsfall ab als Seiten und Magazine. Anstelle großer Mengen von Modulen wird meist nur ein Modul in eine bestimmte Vorlage eingebettet, die auch Inhalte aus verschiedenen Quellen enthält.
Styla Modular Content wird verwendet, um ein beliebiges Modul in eine Vorlage einzubetten, die für mehrere Seiten wie Produktdetails oder ein Kategorieraster verwendet wird. Es kann auf bestimmten URL-Gruppen, auf denen diese Vorlage verwendet wird, angezeigt werden oder nicht. Genau wie Seiten und Magazine wird er vom Styla CMS unter editor.styla.com verwaltet.
Integration
Die Integration von modularen Inhalten in Ihre Website ist sehr einfach und besteht darin, eine JS-Datei und ein <div>-Tag auf Ihrer Seite einzubetten.
Die Hauptunterschiede im Vergleich zu Seiten und Magazinen sind:
Modularer Inhalt wird anders in eine Website integriert als Landing Pages und Stories. Dies ist, was auf der Seite des Kunden getan werden muss:
- das <div>, in dem der Inhalt gerendert wird, benötigt eine Slot-ID, die Sie selbst im Editor erstellen und Ihren Inhalt zuweisen können.
- Eine Integration mit der SEO-API ist nicht erforderlich,
- sie wird von keinem der Styla-Plugins gehandhabt und muss in Ihren Seitenvorlagendateien oder bestimmten Seiten, direkt oder über Ihr CMS, platziert werden.
Dies kommt in den <head>-Tag der Seite:
<script src="https://engine.styla.com/init.js" async></script>
Dies kommt in den <body>-Tag, in dem die Slot-Inhalte gerendert werden sollen:
<div data-styla-slot="{slot-id}"></div>
Setup
Slot-id's können im Editor durch Auswahl von Slots Manager im Benutzer-Dropdown erzeugt werden:
IMAGE FOLGT
Im Slot-Manager können neue Slot-IDs erstellt werden, indem Sie auf Erstellen klicken und einen Namen eingeben:
IMAGE FOLGT
Sie können nun modulare Inhalte auf die gleiche Weise wie Landing Pages und Stories einrichten, indem Sie auf Erstellen klicken und "Modulare Inhalte" auswählen.
IMAGE FOLGT
Nachdem Sie den modularen Inhalt erstellt haben, können Sie ihn einer der Slot-IDs zuordnen, die Sie zuvor erstellt haben:
IMAGE FOLGT
Standardmäßig wird der modulare Inhalt nun auf allen Seiten angezeigt, die diese Slot-ID im div-Tag haben (siehe Integration). Wenn Sie jedoch möchten, dass der modulare Inhalt nur auf Seiten mit einem bestimmten Pfad erscheint, können Sie diesen Pfad im Feld Benutzerdefinierter Pfad im Abschnitt Einstellungen angeben:
IMAGE FOLGT
Standardmäßig wird ein Sternchen * eingefügt, was bedeutet, dass dieser modulare Inhalt auf allen Seiten angezeigt wird, die die Slot-ID enthalten.
IMAGE FOLGT
NOTE: Slots können in dynamische Inhalte integriert werden, die mit JavaScript-Schleifen gerendert werden, wie z.B. Kategorieseitenraster mit Produkten, die mit einer Schaltfläche "Mehr laden" geladen werden. Sie können auch jedes n-te Element in einem Raster ersetzen und einen Styla-Inhalt anstelle eines Produkts oder eines anderen in einer solchen Vorlage angezeigten Elements anzeigen
ACHTUNG: Bitte fügen Sie nicht zwei Slots von verschiedenen Styla-Konten auf einer Seite ein. Wenn Sie dies tun, wird keiner von ihnen gerendert und Sie erhalten einen MULTIPLE_SLOT_CLIENTS_ERROR-Fehler in der Konsole. Nur Inhalte, die von einem Konto stammen, werden in mehreren Slots auf einer Seite angezeigt.
ACHTUNG: Bitte binden Sie das Styla JavaScript-Rendering Modular Content (von engine.styla.com) nicht auf einer Seite mit dem JavaScript-Rendering Pages oder Magazines (von client-scripts.styla.com) ein. Dies kann zu Problemen führen.