Editor-Elemente
Deine Seite wird mit Elementen aufgebaut. Jedes Element ist ein Baustein mit einer bestimmten Aufgabe, zum Beispiel ein Text, ein Bild, ein Button oder ein Formular. Manche Elemente wie Boxen oder Spalten können weitere Elemente enthalten.
Struktur
In der Struktur findest du den vollständigen Aufbau deiner Seite. Hier siehst du auf einen Blick, wie die einzelnen Elemente verschachtelt und miteinander verbunden sind. Außerdem kannst du die Struktur zur Navigation nutzen, um schnell zu Elementen zu gelangen, die im visuellen Editor schwer erreichbar sind.
Elemente lassen sich hier ganz einfach an die gewünschte Position verschieben oder gezielt an einer bestimmten Stelle hinzufügen. Klicke dazu auf Icon: Add und wähle die gewünschte Position aus. Du kannst ebenfalls Elemente aus der Seiteleiste hier an die passende Stelle per Drag & Drop ablegen.
Über das Bearbeiten-Icon gelangst du zu den Einstellungen für Styling, Layout und Animation des jeweiligen Elements. Über die weiteren Aktionen kannst du Elemente kopieren, löschen oder konfigurieren. Außerdem kannst du ein Element als Quellcode oder Vorlage speichern.
Elemente
Du erstellt deine Inhalte über Elemente, die individuell oder über Presets gestylt werden.
Die Element-Leiste siehst du am rechten Rand des Bildschirms. Sie enthält alle verfügbaren Elemente, die du auf deiner Seite verwenden kannst.
Um ein Element deiner Seite hinzuzufügen, fahre mit der Maus über die Leiste und ziehe das Element an die gewünschte Stelle. Bist du mit der Position nicht zufrieden, kannst du es per Drag & Drop an eine andere Stelle ziehen.
Die Element-Leiste selbst kann beliebig entlang der Vorschau positioniert werden.
Basis-Elemente
Mit dem Text-Element kannst du einfache Texte auf deine Seite einfügen und diese formattieren und ausrichten.
Über die Bearbeitungsleiste kannst du Wörter auf verschiedene Weise hervorheben und verlinken.
Mit dem Überschrift-Element kannst du klare Überschriften und Titel auf deiner Seite hinzufügen.
Wähle in der Bearbeitungsleiste aus verschiedenen Überschriften-Ebenen. Verwende H1 für die wichtigste Überschrift der Seite. H2 bis H6 kannst du für weitere Überschriften verwenden.
Mit dem Bild-Element kannst du Bilder und Grafiken auf deiner Seite einfügen.
Über den Button Icon: Picture Bild tauschen kannst du ein Bild aus deiner Mediathek auswählen.
Mit dem Symbol-Element kannst du ein Icon auf deiner Seite hinzufügen.
Wähle aus den von uns bereitgestellten SVG-Icons das passende Symbol aus.
Banner sind Bilder, die als Hintergrund anderer Elemente wie Text oder Überschriften agieren.
Wähle in der Konfiguration ein Bild aus deiner Mediathek. Eine Überschrift und Text werden automatisch hinzugefügt. Du kannst diese anpassen, löschen oder selbst Elemente in deinen Banner hinzufügen.
Video-Elemente akzeptieren hochgeladene Videos aus der Mediathek sowie YouTube-Links.
In der Konfiguration bestimmst du zudem Vorschaubild, Autoplay, Ton und Endlosschleife. Über die Transkription kannst du den gesprochenen Inhalt des Videos als Text bereitstellen.
Das Listen-Element besteht aus der Liste und den Listenpunkten. Ziehst du eine Liste auf die Seite, werden automatisch einige Listenpunkte für dich angelegt. Mit dem Listenpunkt-Element kannst du weitere Punkte ergänzen.
Das Tabellen-Element erstellt dir automatisch eine einfache Tabelle aus Zeilen und Zellen. Über die Bearbeitungsleiste der Tabelle kannst du weitere Spalten und Zellen hinzufügen oder entfernen.
Jeder Teil der Tabelle kann individuell oder per Preset gestylt werden.
Spalten erzeugen automatisch eine zwei-gespaltene Box, in welche beliebige Elemente hineingezogen werden können.
Um weitere Spalten hinzuzufügen, kannst du weitere Boxen innerhalb der äußeren Spaltenbox einfügen. Über die Bearbeitungsleiste können die Spalten auch vertikal angereiht werden oder in ihrer Reihenfolge umgekehrt dargestellt werden.
Trennlinien sind Elemente zur Trennung von Inhalten. Verwende Rahmen in den Styling-Einstellungen, um eine Linie zu erzeugen. Über dessen Breite entscheidest du, wie dick die Linie dargestellt wird.
Boxen sind Container für deine Elemente, die hauptsächlich zum Strukturieren und Layouten einer Website verwendet werden. Sie können andere beliebige Elemente oder auch weitere Boxen enthalten und diese als Einheit zusammenfassen. Mithilfe von Anzeige-Einstellungen im Layout lassen sich die Inhalte innerhalb einer Box gezielt anordnen.
Inhaltsraster sind spezielle Boxen, die dir die Möglichkeit geben, deine Inhalte in einem Raster darzustellen und Abstände zu den Seitenrändern des Bildschirms einfach und unkompliziert zu erzeugen.
Inhaltsraster können als Abschnitte oder Sektionen deiner Seite betrachtet werden. Sie umfassen meistens zusammengehörige Teile deines Inhalts. Wie bei Boxen kannst du über Layout-Einstellungen entscheiden, wie die Elemente innerhalb des Rasters fließen.
In der Konfiguration des Inhaltsrasters können folgende Rastereinstellungen gewählt werden:
- Fließend: Der Inhalt erstreckt sich über die gesamte Bildschirmbreite und reicht bis an die Seitenränder. Es gibt dabei keine zusätzlichen Abstände zum linken und rechten Rand.
- Fließend bis Maximalbreite: Der Inhalt passt sich flexibel an die verfügbare Bildschirmbreite an, wird dabei aber nicht breiter als die Maximalbreite.
- Breakpoints / Breakpoints (breit): Das Inhaltsraster wird an festgelegten Punkten an die Bildschirmbreite angepasst und erhält automatischen den entsprechenden Seitenabstand.
Wie du eine Option als Standard für alle zukünftigen Inhaltsraster einstellen kannst, erfährst du hier.
Buttons sind Links, die bequem über Presets oder individuell mit diversen Button-Stylings ausgestattet werden können.
Zum Ändern des Linkpfads, klicke auf das Icon: Link-Icon und wähle eine deiner Smarda-Seiten oder gib einen externen Link an.
Funktionselemente
Akkordeons sind aufklappbare Inhaltsbereiche. Informationen werden zunächst platzsparend verborgen und können bei Bedarf durch Klicken ein- oder ausgeklappt werden.
Ein Akkordeon umfasst Akkordeon-Elemente, welche beliebige Kinder-Elemente beinhalten können.
In der Konfiguration kannst du festlegen, ob das erste Akkordeon-Element beim Laden der Seite geöffnet oder geschlossen ist.
Außerdem kannst du bestimmen, ob mehrere Elemente gleichzeitig geöffnet sein dürfen. Wenn diese Option deaktiviert ist, wird ein bereits geöffnetes Element automatisch geschlossen, sobald ein anderes geöffnet wird.
Pop-up-Elemente sind zusätzliche Inhalte, die sich über der aktuellen Seite öffnen und per Button- und Link-Klicks geöffnet werden können. Sie können beliebige Elemente enthalten und direkt auf der Seite designed werden.
Anders als normale Pop-ups werden Pop-up-Elemente nicht automatisch ausgelöst.
Die ID benennt dein Pop-up und macht es zugänglich für Auslöser.
In der Konfiguration können folgende Einstellungen zur Schließung des Pop-ups vorgenommen werden:
- Schließen-Button: Bestimmt, ob am Pop-up ein Schließen-Button angezeigt wird.
- Klick außerhalb schließt: Wird ein Klick außerhalb des Pop-ups durchgeführt, schließt sich das Pop-up automatisch.
- Mauszeiger verlässt den Dialog: Wenn der Mausezeiger aus dem Pop-up rausfährt, schließt sich das Pop-up automatisch. Es wird dafür kein Klick benötigt.
Auch können hier die Mindest- und Maximalgrößen sowie die Ausrichtung am Bildschirm eingestellt werden.
Um dein Pop-up auszulösen, braucht es eine ID in der Konfiguration. Über diese findest du dein Pop-up dann im Link-Select eines Buttons oder eines Links unter Pop-ups > Pop-ups dieser Seite.
Du kannst so auch globale Pop-ups auslösen.
Für automatisch auslösende Pop-ups muss ein Pop-up mit Auslöser außerhalb der aktuellen Seite erstellt werden. Gehe dafür in der Navigation auf Pop-ups und füge ein neues Pop-up hinzu.
Karussells ermöglichen es, mehrere Inhalte wie Bilder, Texte oder Karten in einem begrenzten Bereich präsentieren. Mit Pfeilen, Punkten oder Wischen kann zwischen den Inhalten gewechselt werden.
In der Konfiguration kannst du die Darstellung deines Karussells bestimmen.
- Sichtbare Elemente: Bestimmt, wie viele Elemente gleichzeitig sichtbar sind.
- Elemente pro Schritt: Bestimmt, wie viele Elemente bei jedem Klick zur nächsten Ansicht weitergeschoben werden.
- Automatisch abspielen: Bestimmt, ob das Karussell automatisch zum nächsten Inhalt wechselt.
- Autoplay-Invervall: Bestimmt, wie viel Zeit vergehen muss, bevor das Karussell zum nächsten Inhalt wechselt, wenn automatisches abspielen aktiv ist.
- Übergangsdauer: Bestimmt, wie lange der Übergang zum nächsten Inhalt braucht.
- Übergang: Bestimmt die Art des Übergangs zum nächsten Inhalt.
- Überblenden: Bestimmt, ob beim Übergang überblendet wird.
- Pfeile: Bestimmt, ob Pfeile für den Inhaltswechsel angezeigt werden.
- Punkte: Bestimmt, ob Punkte für den Inhaltswechsel angezeigt werden.
- Endlosschleife: Bestimmt, ob das Karussell nach dem letzten Element wieder beim ersten Element beginnt.
Shop-Elemente
Mit einer Produkt-Sammlung kannst du deine Produkte übersichtlich in einem Raster oder Karussell darstellen. Sie ist eine Unterkategorie der Sammlung. Das Erscheinungsbild der Produkt-Sammlung kannst du über die Sammlung-Preset-Gruppe gestalten. Innerhalb dieser Preset-Gruppe kannst du auch bestimmen, welches Produkt-Element-Preset für die einzelnen Produkt-Einträge verwendet wird.
Mit einer Kategorie-Sammlung kannst du deine Kategorien übersichtlich in einem Raster oder Karussell darstellen. Sie ist eine Unterkategorie der Sammlung. Das Erscheinungsbild der Kategorie-Sammlung kannst du über die Sammlung-Preset-Gruppe gestalten. Innerhalb dieser Preset-Gruppe kannst du auch bestimmen, welches Kategorie-Element-Preset für die einzelnen Kategorie-Einträge verwendet wird.
Sammlungen
Sammlungen können Produkte, Kategorien oder Seiten übersichtlich darstellen. Dabei verwenden alle drei das allgemeine Sammlungs-Element und dessen Preset-Gruppe. Dieses findest du in deinen Presets unter Sammlung und kann dort gestylt werden.
Um die einzelnen Einträge für Produkte, Kategorien und Seiten zu stylen, verwendet die Sammlung die jeweiligen Presets von Produkt-Element, Kategorie-Element und Seiten-Element, die du ebenfalls in deinen Presets findest. Um sie mit deiner Sammlung zu verknüpfen, wähle innerhalb der Preset-Gruppe dein gewünschtes Preset für die jeweiligen Elemente.
Wenn du deine Einträge ganz individuell gestalten willst, kannst du dies in der Sammlung-Preset-Gruppe unter Eintrag. Klickst du dort drauf, öffnet sich eine kleine Bearbeitungsmaske, in der du mit Elementen deinen eigenen Sammlungs-Eintrag gestalten kannst.
Bilder, Preise und andere individuelle Beschriftungen kannst du über Text- und Bildvariablen einfügen. Klick dafür innerhalb der Textbearbeitungsleiste auf Icon: Wrench oder in der Mediathek auf Per Variable festlegen und wähle unter Sammlungseintrag, was du gerne anzeigen möchtest.
In der Konfiguration kannst du deine Sammlung anpassen:
- Quelle: Bestimmt, welcher Eintragstyp für diese Sammlung verwendet wird.
- Ausgabeart: Bestimmt, wie Produkte für die Sammlung ausgewählt werden.
- Produkte/Kategorien/Seiten: Bestimmt bei manueller Ausgabeart, welche Produkte, Kategorien oder Seiten angezeigt werden.
- Filter-Darstellung: Bestimmt, ob vorhandene Filter als Buttons oder Dropdowns angezeigt werden.
- Spalten: Bestimmt, wie viele Einträge in einer Zeile dargestellt werden.
- Anzeigeart: Bestimmt, in welcher Form die Einträge dargestellt werden. Icon: Arrow-right Raster, Raster mit Seitenblättern oder Karussell.
- Einträge pro Seite: Bestimmt bei Seitenblättern wie viele Einträge pro Seite sichtbar sind.
- Bildposition: Bestimmt, wo das Bild des Eintrags angezeigt wird.
Erweitert
Mit einem Formular kannst du eigene Formulare sowie deine Newsletter-Anmeldung auf deiner Seite darstellen.
Eigene Formulare werden im Adminbereich unter Formulare erstellt und können anschließend hier ausgewählt werden. Eine Vorbelegung von Feldern (Standardwert) ist ebenfalls im Editor möglich.
Die verschiedenen Eingabefelder kannst du als Preset stylen und sie in der Formular-Preset-Gruppe anwenden.
In der Konfiguration kannst du wählen, ob es sich um ein eigenes Formular oder eine Newsletter-Anmeldung handelt.
Eigenes Formular
Bei eigenen Formularen wählst du anschließend das spezifische Formular, das du hier anzeigen willst. Bei Bedarf kannst du auch Felder vorbelegen. Wähle dazu einfach das entsprechende Feld. Je nachdem, um welchen Feldtyp es sich handelt, kannst du den Standardwert aus den vorgegebenen Optionen wählen oder manuell eintragen. Über Icon: Trash kannst du Vorbelegungen jederzeit löschen.
Newsletter-Anmeldung
Bei Newsletter-Anmeldungen ist das E-Mail-Feld sowie die Checkbox für die Datenschutzerklärung fix vorgegeben. Du kannst direkt hier einen Einleitungs- und Erfolgstext verfassen, der an den entsprechenden Stellen angezeigt wird. Zusätzlich zur E-Mail kannst du auch Vorname und Nachname als gesonderte Felder hinzufügen. Eigene Felder sind bei der Newsletter-Anmeldung nicht möglich.
Mit einer Seiten-Sammlung kannst du deine Seiten übersichtlich in einem Raster oder Karussell darstellen. Sie ist eine Unterkategorie der Sammlung. Das Erscheinungsbild der Seiten-Sammlung kannst du über die Sammlung-Preset-Gruppe gestalten. Innerhalb dieser Preset-Gruppe kannst du auch bestimmen, welches Seiten-Element-Preset für die einzelnen Seiten-Einträge verwendet wird.
Eine Seiten-Sammlung kann mit Filtern ausgestattet sein, die auf Basis von Referenz-Tags Seiten nur anzeigen, wenn sie mit dem richtigen Tag versehen sind.
Um einen Filter zu erstellen, füge in der Konfiguration eine Filter-Gruppe hinzu. Sie bündelt mehrere Filter-Optionen, von denen immer nur eine gleichzeitig aktiv sein kann. Bei Bedarf kannst du der Filter-Gruppe einen Namen geben. Wenn du keinen Namen anzeigen möchtest, kannst du das Feld leer lassen.
Filter-Optionen sind die einzelnen Filter innerhalb einer Filter-Gruppe. Für jede Filter-Option legst du einen Titel fest, unter dem der Filter angezeigt wird, und hinterlegst einen oder mehrere Tags, nach denen deine Seiten gefiltert werden. Du kannst einer Filter-Gruppe beliebig viele Filter-Optionen hinzufügen.
Damit die Filter funktionieren, müssen deine Seiten mit den entsprechenden Tags versehen sein. Öffne dazu die Seiteneinstellungen der jeweiligen Seite und gehe zu Erweitert. Dort findest du das Feld Referenz-Tags. Die Tags kannst du frei benennen. Sie müssen lediglich mit den Tags übereinstimmen, die du in den Filter-Optionen hinterlegt hast.
Seitenblättern ist ein einfaches Element, mit dem man zur vorherigen oder nächsten Seite weiterblättern kann. Wohin geblättert wird, wird in der Konfiguration bestimmt, wo man Sortierung und Seitentypen definiert. Damit Seitenblättern auf der aktuellen Seite funktioniert, muss einer der ausgewählten Seitentypen in der Konfiguration auch dem Seitentyp der aktuellen Seite entspechen.
Ist kein Seitentyp eingestellt, werden automatisch Seiten gewählt, die den gleichen Seitentyp haben wie die aktuelle Seite.
Sitemaps sind Übersichten über die Seiten einer Website. Sie helfen Suchmaschinen dabei, die Struktur deiner Website zu verstehen.
In der Konfiguration kannst du auswählen, welche Art von Seiten du anzeigen lassen möchtest.
- Seiten anzeigen: alle normalen Standard-Seiten ohne bestimmten Seitentyp
- Individuelle Seiten anzeigen: alle Seiten eines Seitentyps
Als Shop kannst du ebenfalls Kategorien, Hersteller, Produkte und Tags von deiner Sitemap ein- oder ausschließen.
Mit einem iFrame kannst du externe Inhalte wie eine Karte, ein Video oder ein Formular direkt in deine Website einbinden.
Gib dafür in der Konfiguration die URL der Seite ein, die du einbinden möchtest.
In der Konfiguration kannst du deinen iFrame weiter anpassen:
- Titel: Wird angezeigt, wenn der iFrame nicht geladen werden kann. Zudem wird er von Screenreadern benutzt, um den eingebetteten Inhalt zu erkennen.
- Ladeverhalten: Bestimmt, ob der iFrame sofort oder verzögert geladen wird.
- Berechtigungen (allow): Bestimmen, welche Funktionen der eingebettete Inhalt verwenden darf. Je nach Inhalt können beispielsweise Kamera, Mikrofon oder Standortzugriff erlaubt werden.
- Sandbox: Schränkt die Möglichkeiten des eingebetteten Inhalts ein und erhöht dadurch die Sicherheit. Du kannst festlegen, welche Funktionen innerhalb des iFrames erlaubt sind.
- Cookie-Plattformen: Legt fest, dass der iFrame nur geladen wird, wenn Nutzer den Plattformen per Cookie-Box zugestimmt haben. Ist keine Cookie-Plattform gewählt, wird der iFrame immer sofort angezeigt.
Canvas ist eine Zeichenfläche, auf der Inhalte dynamisch dargestellt werden können. Sie eignet sich beispielsweise für Grafiken, Animationen, Diagramme oder interaktive Elemente. Die Darstellung wird mithilfe von JavaScript gesteuert, welches du in das Code-Feld in der Konfiguration hinzufügst.
Einbindungen ermöglichen es, externe Inhalte oder Funktionen über einen bereitgestellten Einbindungscode in deine Website zu integrieren. Sie eignen sich beispielsweise für externe Tools, Widgets oder andere Dienste.
Gib einfach deinen Code in den HTML-Editor in der Konfiguration ein.
Mit der SVG-Grafik kannst du eigene Vektorgrafiken in deine Website einbinden. Dazu hinterlegst du den entsprechenden SVG-Code im Element. Im Gegensatz zu einem Icon bist du dabei nicht auf vorgefertigte Symbole beschränkt, sondern kannst die Grafik selbst gestalten und individuell anpassen, zum Beispiel mit Farben, Farbverläufen, Formen und Größen.
In der Konfiguration kannst du deine SVG-Grafik definieren:
- Ausschnitt Breite / Höhe: Legen fest, welcher Teil der Zeichnung sichtbar ist. Sie bestimmten die Größe des sichtbaren Bereichs, gemessen in den Einheiten der Zeichnung. Ist der Ausschnitt kleiner als die Zeichnung, wird hineingezoomt. Ist er größer, entsteht ein Rand um die Grafik. Der Ausschnitt gilt nur, wenn sowohl Breite als auch Höhe definiert ist.
- Ausschnitt Start X / Start Y: Verschiebt den Rahmen über der Zeichnung. Ohne Angabe ist der Ausgangspunkt die linke obere Ecke.
- Ausrichtung: Bestimmt, wo die Grafik sitzt, wenn ihr Seitenverhältnis nicht zur Fläche des Elements passt. Standardausrichtung ist mittig.
- Skalierung: Bestimmt, wie die Grafik den Platz ausfüllt. Mit Einpassen bleibt die ganze Grafik sichtbar. Bei Füllen wird die Fläche voll ausgefüllt und Teile, die überstehen, abgeschnitten. Mit der Ausrichtung bestimmst du, welcher Teil hierbei sichtbar bleibt.
- SVG-Code: Bestimmt, wie die Grafik ausschieht. Füge hier den Code aus deinem Grafikprogramm ein. Skripte im Code werden automatisch entfernt.
Wird kein Ausschnitt angegeben, wird der Ausschnitt des eingefügten SVG-Codes verwendet, wenn dieser einen mitbringt.
Mit dem Menü-Element kannst du eine Navigation auf deiner Seite einfügen, zum Beispiel als Hauptmenü im Header oder als Linkliste im Footer.
Die Einträge legst du über Menüpunkte bearbeiten an. Jeder Menüpunkt hat einen Link-Text und einen Link auf eine deiner Seiten, eine Kategorie oder eine externe Adresse. Menüpunkte können bis zu drei Ebenen tief verschachtelt werden.
In der Konfiguration kannst du dein Menü anpassen:
- Umbruchpunkt (mobil ab): Bestimmt, ab welcher Bildschirmbreite das Menü in das mobile Menü wechselt und nur noch über einen Button geöffnet wird.
- Pfeil bei Unterpunkten anzeigen: Bestimmt, ob neben Menüpunkten mit Unterpunkten ein Pfeil angezeigt wird.
- Mobilmenü-Position: Bestimmt, ob sich das mobile Menü von rechts, von links oder als Vollbild öffnet.
- Mobilmenü-Breite: Bestimmt, wie breit das mobile Menü ist, wenn es von der Seite eingeblendet wird.
Für jeden Menüpunkt kannst du außerdem festlegen:
- Menüpunkt nur in folgenden Sprachversionen anzeigen: Bestimmt, in welchen Sprachversionen der Menüpunkt angezeigt wird. Ohne Auswahl ist er in allen Sprachen sichtbar.
- Hervorgehoben: Hebt einen Menüpunkt der obersten Ebene optisch hervor.
- In neuem Tab öffnen: Bestimmt, ob sich der Link in einem neuen Browser-Tab öffnet.
- Großes Untermenü: Zeigt die Unterpunkte eines Menüpunkts der obersten Ebene als großes, mehrspaltiges Menü an, wahlweise im Seitenraster oder über die volle Breite.
- Unterpunkte aus Kategorie erzeugen: Verlinkt ein Menüpunkt auf eine Kategorie, werden die Unterpunkte automatisch aus deren Unterkategorien erstellt. Über die Maximalanzahl an Unterebenen bestimmst du, wie viele Ebenen übernommen werden.
Mit der Toolbox kannst du die wichtigsten Shop-Funktionen als Symbole auf deiner Seite einfügen, typischerweise im Header: Suche, Merkliste, Konto und Warenkorb.
Angezeigt werden nur Funktionen, die in deinem Shop aktiv sind. Es werden jene Symbole verwendet, die unter Icons in der Seitenleiste für die entsprechenden Funktionen definiert sind.
In der Konfiguration kannst du für jede Bildschirmgröße festlegen, welche Funktionen sichtbar sind:
- Suche anzeigen: Bestimmt, ob das Suchsymbol angezeigt wird.
- Merkliste anzeigen: Bestimmt, ob das Merklisten-Symbol angezeigt wird.
- Konto anzeigen: Bestimmt, ob das Konto-Symbol angezeigt wird.
- Warenkorb anzeigen: Bestimmt, ob das Warenkorb-Symbol angezeigt wird.
- Beschriftungen anzeigen: Bestimmt, ob unter den Symbolen ein Text angezeigt wird.
Mit der Suchleiste kannst du ein Suchfeld direkt auf deiner Seite einfügen, etwa in deinem Header oder an anderen Stellen, an dem du gerne die Suche quer durch deinen Shop ermöglichen möchtest.
Mit dem Sprachumschalter können deine Besucher zwischen den Sprachversionen deiner Seite wechseln.
Es werden automatisch alle verfügbaren Sprachen angezeigt, die aktuelle Sprache ist hervorgehoben. Gibt es nur eine Sprachversion, wird der Sprachumschalter nicht angezeigt.
Eingabefelder in der Elementleiste wie Textfeld, Checkboxen oder Dropdowns sind funktionslose Formularfelder. Sie können mit Einbindungen verknüpft werden oder dienen dem vereinfachten Stylen dieser Elemente.
Eine Verwendung dieser Felder für individuelle Formulare ohne Einbindungsskript ist nicht vorgesehen. Verwende für das Erstellen von Formularen die Formular-Funktion.
Aus Vorlagen einfügen
Vorlagen sind fertige Bausteine für deine Seite, zum Beispiel Sektionen, Hero-Bereiche, Layouts oder ganze Seiten. Du kannst die bereitgestellten Vorlagen nutzen oder deine eigenen Elemente als Vorlage speichern und sie so jederzeit wiederverwenden.
Klicke in der Element-Auswahl auf Aus Vorlagen einfügen. Es öffnet sich der Vorlagen-Katalog. Auf der Startseite findest du deine zuletzt gespeicherten Vorlagen und von Smarda empfohlene Vorlagen.
Über die Kategorien links und die Suche findest du schnell die passende Vorlage. Innerhalb einer Kategorie kannst du zusätzlich nach Stil filtern.
Über das Lupen-Symbol kannst du dir die Vorschau einer Vorlage vergrößert ansehen.
Oben im Katalog wählst du, in welchem Design die Vorlagen angezeigt und eingefügt werden:
- Original: Die Vorlage behält ihr ursprüngliches Design, genau so, wie sie in der Vorschau aussieht.
- Eigenes Design: Die Vorlage passt sich je nach Möglichkeit an dein Design an. Farben, Schriften, Abstände und andere Variablen, die es in deinem Theme bereits gibt, werden von dir übernommen. Nur was dir fehlt, wird aus der Vorlage ergänzt. In der Vorschau siehst du direkt, wie die Vorlage mit deinem Design aussieht.
Klicke bei der gewünschten Vorlage auf Kopieren. Anschließend fügst du sie an der gewünschten Stelle deiner Seite ein, genau wie ein normales Seiten-Element. Du findest das kopierte Element ganz oben in der Elementleiste.
Alternativ kannst du die Vorlage gedrückt halten und direkt per Drag & Drop an die passende Stelle ziehen.
Beim Einfügen wirst du gefragt, wie die Vorlage übernommen werden soll:
- Als Presets übernehmen: Die Presets und Variablen der Vorlage werden in deinem Theme angelegt und bleiben mit dem Element verknüpft. Änderungen an diesen Presets wirken sich später auf alle Elemente aus, die sie verwenden.
- Werte lokal übernehmen: Alle Werte werden direkt im Element gespeichert. Dein Theme bleibt unverändert, spätere Änderungen musst du aber direkt am Element vornehmen. Schriften und Animationen werden trotzdem in deinem Theme angelegt, da sie sonst nicht dargestellt werden können.
Um ein eigenes Element als Vorlage zu speichern, klicke im Menü des Elements, in der Struktur oder in der Vorschau, auf Icon: Ellipsis-vertical Als Vorlage speichern. Hast du mehrere Elemente markiert, kannst du sie auch gemeinsam als eine Vorlage speichern.
Im Dialog legst du fest:
- Titel: Der Name, unter dem die Vorlage im Katalog angezeigt wird.
- Beschreibung: Ein kurzer Text, der die Vorlage beschreibt.
- Kategorien: Bestimmt, unter welchen Kategorien die Vorlage im Katalog zu finden ist.
Für Smarda-Partner gibt es zusätzlich weitere Möglichkeiten:
- Speichern für: Bestimmt, ob die Vorlage nur in diesem Projekt oder für deine ganze Agentur verfügbar ist.
Sichtbar für: Als Partner kannst du die Vorlage für alle Projekte deiner Agentur oder nur für ausgewählte Projekte freigeben.
Mit der Vorlage werden automatisch alle verwendeten Variablen, Presets, Preset-Gruppen, Animationen, Schriften sowie Bilder und Videos gespeichert. Übersetzungen und referenzierte Inhalte wie Produkte, Formulare oder Menüpunkte werden nicht mitgespeichert.
Deine gespeicherten Vorlagen findest du im Katalog unter Meine Vorlagen. Dort kannst du sie über das Menü der Vorlage ihren Titel oder Beschreibung bearbeiten oder die Vorlage löschen.
Bist du Smarda-Partner, stehen dir auch Agentur-Vorlagen zur Verfügung, wo agenturweite Vorlagen gespeichert sind.
Gefällt dir eine bereitgestellte Vorlage, kannst du sie über das Lesezeichen-Symbol in deine eigenen Vorlagen übernehmen.
