Video: Seiten bauen mit dem xoContentEditor
Vom Einschalten bis zur fertigen Seite im Shop: Das Video zeigt am Demo-Shop, wie Sie Bausteine einfügen, für Desktop und Mobil anordnen, als Vorlage wiederverwenden und fremde Widgets einbinden. Jedes Kapitel lässt sich unten direkt anspringen.
Das Video (3:39 Min.) führt in acht Kapiteln durch den Baukasten. Untertitel lassen sich im Player einschalten. Sprecherstimme KI-generiert.
Kapitel und Transkript
Ein Klick auf die Zeitangabe startet das Video an dieser Stelle.
Transkript des Videos
0:00 · Einführung
Gestaltete Seiten aus fertigen Bausteinen, ganz ohne HTML: Das ist der xoContentEditor. Dieses Video zeigt Ihnen den Weg vom Einschalten bis zur fertigen Seite im Shop.
0:14 · Wo schalte ich den xoContentEditor ein?
Den xoContentEditor gibt es bei CMS-Seiten, Kategorien, Produkten, News, FAQ und Herstellern. Über dem Inhaltsfeld steht ein Schalter, bei CMS-Seiten heißt er „Inhalt (xoContentEditor)“. Schalten Sie ihn ein, steht an Stelle des Textfelds der Baukasten. Der Schalter gilt je Sprache. Aber Vorsicht: Ausschalten und speichern löscht den Aufbau. Der xoContentEditor ist ein Zusatzmodul und in den XONIC-Paketen ab Basic enthalten.
0:48 · Wie ist der Baukasten aufgebaut?
Eine Seite besteht aus Inhaltsblöcken. Ein Block heißt im Backend „Flexibles Layout“ und hat drei Spalten: links die Struktur mit den Elementen, in der Mitte die Felder des gewählten Elements, rechts die Vorschau. Mit dem Schalter „aktiv“ blenden Sie einen Block im Shop aus, ohne ihn zu löschen. Einen neuen Block legen Sie oben mit „neues Element hinzufügen“ an.
1:13 · Wie füge ich einen Baustein ein?
Mit „Neues Element hinzufügen“ unter der Struktur hängen Sie ein Element an, bis zu 16 je Block. Im Feld „Komponenten-Typ“ wählen Sie, was daraus werden soll, zum Beispiel eine Karte mit Bild, Text und Button. Zur Auswahl stehen 22 Bausteine. Der Editor lädt die passenden Eingabefelder nach: Sie füllen aus, das Layout entsteht automatisch.
1:39 · Wie ordne ich Inhalte für Desktop und Mobil an?
Die Anordnung stellen Sie je Element im Reiter „Layout & Darstellung“ ein: Breite, Einrückung und Reihenfolge, getrennt für Desktop und Mobil. Unter „Sichtbarkeit“ zeigen Sie ein Element nur am Desktop oder nur am Handy. Für den ganzen Block gelten die Widget-Optionen, etwa volle Breite, eine Hintergrundfarbe oder ein Karussell.
2:03 · Wie sieht die Seite im Shop aus?
Rechts in der Vorschau sehen Sie Desktop und Mobil nebeneinander. „Pseudo“ zeigt je Element eine Kachel, ideal für Aufteilung und Reihenfolge, „Live“ eine verkleinerte Kurzfassung der Inhalte. Schriften und Farben Ihres Shops sehen Sie erst im Shop: Speichern Sie die Seite und öffnen Sie sie über „Im Shop ansehen“.
2:28 · Wie verwende ich einen Aufbau wieder?
Einen fertigen Aufbau speichern Sie als Vorlage: In der Kopfleiste den Vorlagen-Manager öffnen, Reiter „Speichern“, einen Namen eintragen und „Inhalte mitspeichern“ anlassen. Auf einer anderen Seite wählen Sie im Reiter „Anwenden“ die Vorlage und dann „Ersetzen“ oder „Einfügen“. So übertragen Sie den Aufbau auch in eine andere Sprache, denn jede Sprache hat ihren eigenen Baukasten. Danach speichern Sie die Seite.
2:57 · Wo binde ich fremde Widgets ein?
Eigenes HTML fügen Sie mit dem Baustein „Code / eigenes HTML“ ein, zum Beispiel eine Einbettung per iframe. Skript-Code entfernt der Editor beim Speichern. Alle Details und Antworten auf häufige Fragen finden Sie im Leitfaden „xoContentEditor“ auf xonic-solutions.de. Und wenn Sie Hilfe brauchen: Unser Support-Team aus Chemnitz ist für Sie da.