Füge mit diesem vollständig anpassbaren Drag-and-Drop-Bearbeitungssystem Inhalte zu den Seiten deiner Website hinzu.
Der Kreative Editor ist der primäre Inhalts-Editor für Squarespace-Websites der Version 7.1. In allen Seitentypen, Portfolio-Unterseiten und dem Footer deiner Website verwenden Block-Abschnitte den Kreativen Editor.
Der Kreative Editor ist für alle Block-Abschnitte auf Websites der Version 7.1 verfügbar. Der Kreative Editor wird in folgenden Bereichen derzeit nicht unterstützt:
- Block-Bereiche, in denen keine Abschnitte verwendet werden, wie Blogeinträge, Event-Beschreibungen und zusätzliche Produktinformationen
- Abschnitte, die keine Blöcke verwenden, wie Auto-Layouts, Sammlungsabschnitte und Galerie-Abschnitte
- Websites der Version 7.0
In der Squarespace-App ist es derzeit nicht möglich, Blöcke in Abschnitten des Kreativen Editors hinzuzufügen oder zu bearbeiten.
Video ansehen
Schnellstart mit dem Kreativen Editor
Der Kreative Editor ist die Bearbeitungsfunktion für Seitenabschnitte, die Blöcke in Websites der Version 7.1 verwenden. Wenn deine Website Version 7.1 nutzt, kannst du jederzeit mit der Verwendung des Kreativen Editors beginnen, indem du eine Layout-Seite hinzufügst, einer vorhandenen Seite einen Block-Abschnitt hinzufügst oder deinen Footer bearbeitest. Wenn deine Website über Block-Abschnitte verfügt, die vor der Veröffentlichung des Kreativen Editors erstellt wurden, kannst du diese aktualisieren.
Mit dem flexiblen Raster des Kreativen Editors kannst du Blöcke überall platzieren, selbst wenn sie sich mit anderen Blöcken überschneiden, und ihre Größe direkt auf der Seite ändern. Denke daran, dass du zwei Layout-Designs erstellst: eines für Besucher, die deine Website auf einem Computer ansehen, und eines für Mobilgeräte. Klicke auf die Gerätesymbole in der oberen rechten Ecke, um die verschiedenen Layouts festzulegen.
Weitere Einzelheiten findest du im restlichen Teil dieser Anleitung.
Verwende ich den Kreativen Editor?
Der Kreative Editor wird auf Websites der Version 7.1 in folgenden Bereichen unterstützt:
- Block-Abschnitte auf einer beliebigen Seite
- Fußzeilen
- Portfolio-Unterseiten
Wenn du auf der Seite auf Bearbeiten klickst, haben kreativer Editor-Abschnitte in der oberen linken Ecke den Button Block hinzufügen. Wenn du auf einen Block klickst und ihn ziehst, sollte ein Raster im Hintergrund erscheinen.
Tipp: Drücke G, damit das Raster sichtbar bleibt. Um das Raster auszublenden, drücke erneut G.
Wenn kein Button oder Raster angezeigt wird, verwendet dieser Blockbereich den Klassischen Editor.
Klassischer Editor
Alle Blockbereiche auf Version 7.0 verwenden den Klassischen Editor. Auf Websites der Version 7.1 verwenden einige Blockbereiche immer noch unseren Klassischen Editor, darunter:
- Blog-Einträge
- Event-Beschreibungen
- Zusätzliche Produktinformation
- Block-Abschnitte, die vor der Veröffentlichung des Kreativen Editors hinzugefügt wurden
Um mehr über die Unterschiede zwischen dem Kreativen Editor und dem Klassischen Editor zu erfahren, besuche Kreativer Editor und Klassischer Editor im Vergleich.
Einen Kreativer Editor-Abschnitt hinzufügen
So fügst du einen Kreativer Editor-Abschnitt zu einer Seite hinzu:
- Klicke auf der Seite auf Bearbeiten.
- Klicke auf Abschnitt hinzufügen.
- Klicke auf Leeren Abschnitt hinzufügen, um einen leeren Kreativer Editor-Abschnitt hinzuzufügen, oder klicke auf eine Kategorie, um vorgefertigte Abschnitte zu finden. Wenn der Abschnitt ein i-Symbol in der oberen rechten Ecke hat, handelt es sich um ein Auto-Layout, das keinen Kreativen Editor verwendet.
Um die Höhe des Abschnittsrasters zu ändern, klicke und ziehe das blaue Pfeilsymbol in der unteren rechten Ecke. Beachte, dass die Anzahl und Platzierung der Blöcke dich daran hindern kann, die Höhe zu verringern. Jeder Abschnitt des Kreativen Editors hat ein Limit von 1.000 Zeilen.
Klassischer Editor-Abschnitte aktualisieren
Hinweis: Es ist nicht möglich, einen Abschnitt auf den Klassischen Editor zurückzusetzen, nachdem du ihn aktualisiert und die Seite gespeichert hast. Wenn du nicht sicher bist, ob du den Kreative Editor mit einem Abschnitt verwenden möchtest, empfehlen wir, den Abschnitt sicherheitshalber vor dem Upgrade zu duplizieren.
Wenn du vor der Veröffentlichung des Kreativen Editors Block-Abschnitte hinzugefügt hast, die den Klassischen Editor verwenden, kannst du sie in Abschnitte des Kreativen Editors konvertieren. Gehe dazu wie folgt vor:
- Klicke auf der Seite auf Bearbeiten.
- Klicke in der oberen linken Ecke eines Abschnitts des Klassischen Editors auf Upgrade.
- Der Abschnitt des Klassischen Editors wird zu einem Abschnitt des Kreativen Editors. Wenn die Höhe des Klassischen Editors das Limit von 1.000 Rasterzeilen überschreitet, wird sie in mehrere Abschnitte des Kreativen Editors aufgeteilt.
Aufgrund der Unterschiede zwischen dem Klassischen Editor und Kreativen Editor kann sich dein Layout geringfügig ändern oder Blöcke können beim Upgrade falsch ausgerichtet werden. Der Grund dafür ist, dass nicht alle Layouts im Klassischen Editor eine exakte Übereinstimmung mit den Layouts im Kreativen Editor haben. Ein Upgrade ist jedoch eine gute Möglichkeit, deine Block-Layouts mit den neuen Optionen und der erhöhten Flexibilität des Kreativen Editors neu zu gestalten.
Wenn du den Kreativen Editor für diesen Abschnitt nicht verwenden möchtest, klicke vor dem Speichern auf Rückgängig.
Blöcke hinzufügen
So fügst du Blöcke zu einem Kreativer Editor-Abschnitt hinzu:
- Klicke auf der Seite auf Bearbeiten.
- Klicke oben links auf Block hinzufügen.
- Wähle den Block aus, den du hinzufügen möchtest. Um mehr über die verschiedenen Arten von Blöcken zu erfahren, besuche Inhalte mit Blöcken hinzufügen.
Es gibt kein festes Limit für die Anzahl der Blöcke, die du hinzufügen kannst. Wir empfehlen jedoch, nicht mehr als 60 Blöcke pro Seite hinzuzufügen, da zu viele Inhalte die Ladezeit deiner Website beeinträchtigen könnten. Vor allem bei mobilen Browsern kann es Probleme beim Herunterladen von Seiten mit vielen Inhalten geben.
Nachdem du Blöcke hinzugefügt hast, kannst du:
- Blöcke anheften
- Blöcke duplizieren, die bereits im Abschnitt sind
- Blöcke aus und in andere Abschnitte des Kreativen Editors kopieren und einfügen
- Blöcke durch Klicken und Ziehen verschieben und ihre Größe ändern
- Das mobile Layout bearbeiten, um festzulegen, wie es auf Mobilgeräten angezeigt wird
- Best Practices kennenlernen, um deine Abschnitte des Kreativen Editors barrierefrei zu machen, insbesondere wenn du Blöcke überlappst
Hinweis: Abstands-Blöcke werden im Kreativen Editor nicht unterstützt. Im Klassischen Editor werden Abstands-Blöcke verwendet, um Abstand zwischen Blöcken hinzuzufügen. Mit dem Kreativen Editor kannst du Abstände zwischen Blöcken hinzufügen, indem du auf die Blöcke klickst und sie an neue Positionen im Abschnitt ziehst.
Blöcke anheften
Hefte einen oder mehrere Blöcke in Kreativer Editor-Abschnitten an, um sie stationär zu halten, während deine Besucher durch andere Inhalte im Abschnitt scrollen. Dies ist eine ausgezeichnete Möglichkeit, bestimmte Inhalte hervorzuheben und deiner Seite ein einzigartiges Design zu verleihen.
Um einen Block anzuheften:
- Klicke auf den Block und dann auf das Pin-Symbol in der Symbolleiste des Blocks. Jeder Blocktyp kann angeheftet werden.
- Standardmäßig sind angeheftete Blöcke so eingestellt, dass sie am oberen Rand des Abschnitts ausgerichtet sind. Alternativ kannst du auf die entsprechenden Symbole für zentrieren oder unten ausrichten klicken.
- Verwende den Offset-Schieberegler, um den Abstand zwischen dem angepinnten Block und dem Browser-Rand zwischen 0 px und 50 px zu ändern. Beispielsweise bleibt ein angehefteter Block, der bei 0 px oben ausgerichtet ist, am Rand des Browsers, wenn der Besucher scrollt.
Wir empfehlen dir, mit verschiedenen Einstellungen zu experimentieren, um den gewünschten Effekt zu erzielen.
Denk daran:
- Angeheftete Blöcke bleiben nur in ihrem Abschnitt angeheftet. Wenn dein Abschnitt nicht genug Inhalt hat oder sehr kurz ist, ist der angeheftete Effekt möglicherweise nicht sichtbar.
- Blöcke, die im Computer-Layout angeheftet sind, werden nicht im mobilen Layout angeheftet und umgekehrt.
- Angeheftete Blöcke werden im Klassischen Editor oder anderen Arten von Seitenabschnitten nicht unterstützt.
- Obwohl die Anzahl der Blöcke, die du anheften kannst, unbegrenzt ist, kann es sein, dass ein Abschnitt mit vielen hinzugefügten Inhalten langsamer geladen wird. Wir empfehlen, nicht mehr als 60 Blöcke, ob angeheftet oder nicht, pro Seite hinzuzufügen. Weitere Informationen findest du unter Meine Website wird langsam geladen.
Block-Hintergrundfarbe hinzufügen
Wenn sich Blöcke mit viel Text mit anderen Inhalten überlappen, solltest du den Text lesbarer gestalten, indem du eine Block-Hintergrundfarbe hinzufügst. Weitere Informationen zu Farbpaletten und Farbschemata findest du unter Farben ändern.
Blöcke anpassen oder füllen
Um das Padding zwischen Bild-Blöcken und Button-Blöcken festzulegen, stelle sie auf „Anpassen“ oder „Füllen“ ein. Wenn ein Block auf Füllen eingestellt ist, nimmt das Bild oder der Button den gesamten Blockraum ein, sodass die Ränder des Bildes oder Buttons bündig mit benachbarten Blöcken sind. Wenn ein Block auf Anpassen eingestellt ist, wird das Bild oder der Button von zusätzlichem Abstand umgeben.
So stellst du Bild- oder Button-Blöcke auf „Anpassen“ oder „Füllen“ ein:
- Klicke auf einen Bild- oder Button-Block, klicke auf das Bleistiftsymbol und dann auf den Tab Design.
- Klicke auf Anpassen oder Füllen. Bild-Böcke werden standardmäßig auf Anpassen eingestellt, während Button-Blöcke auf Füllen eingestellt sind.
- Wenn du Anpassen auswählst, werden Optionen zur Ausrichtung unten oder in der Werkzeugleiste des Blocks angezeigt.
- Nachdem du Änderungen vorgenommen hast, klicke auf Speichern, um deine Änderungen zu speichern und die Bearbeitung fortzusetzen, oder klicke auf Beenden und dann auf Speichern, um den Editor zu schließen.
Kreativer Editor und Responsive Design
Alle Squarespace-Websites verwenden Responsive Design, um sicherzustellen, dass deine Website in einer Vielzahl von Browsergrößen und Geräten gut aussieht. Insbesondere das flexible Raster vom Kreativen Editor ist so konzipiert, dass beim Neuanordnen, Ändern der Größe oder Bearbeiten von Blöcken andere Blöcke auf der Seite möglicherweise verschoben oder in der Größe geändert werden, um komplexere Layouts beizubehalten.
Wenn du beispielsweise einen Text-Block über einem Bild-Block platzierst und dann mehr Text zum Text-Block hinzufügst, wird der Bild-Block möglicherweise vergrößert, um sich dem zusätzlichen Text anzupassen.
Wenn sich Blöcke auf eine Weise verschieben oder in der Größe ändern, die du nicht möchtest, mache deine letzten Änderungen rückgängig und versuche dann, Blöcke zu verschieben, bevor du die Änderungen erneut vornimmst. Wenn du wie im obigen Beispiel Text hinzufügen möchtest, ohne dass sich die Größe des Bild-Blocks ändert, kannst du den Text-Block vom Bild-Block entfernen, den Text hinzufügen und ihn dann erneut mit dem Bild-Block überlagern.
Mobiles Layout
In Kreativer Editor-Abschnitten zeigen mobile Layouts den gleichen Inhalt an, aber du kannst das mobile Layout anordnen und die Größe seiner Blöcke unabhängig vom Computer-Layout ändern. So legst du das mobile Layout deines Abschnitts fest:
- Klicke auf der Seite auf Bearbeiten und dann auf das Symbol Mobile Ansicht in der oberen rechten Ecke.
- Ordne nach Belieben deine Blöcke an und ändere deren Größe. Um einen Block automatisch über oder unter einen angrenzenden Block zu verschieben, klicke auf den Block und dann auf ↑ oder ↓. Dies ist eine großartige Möglichkeit, Blöcke in deinem mobilen Layout schnell neu anzuordnen, ohne sie klicken und ziehen zu müssen.
- Nachdem du die Änderungen vorgenommen hast, klicke auf Speichern, um deine Änderungen zu speichern und die Bearbeitung fortzusetzen, oder klicke auf Beenden und dann auf Speichern, um den Editor zu schließen.
Alle Änderungen, die du an der Platzierung oder Größe des Blocks vornimmst, wirken sich nicht auf das Computer-Layout aus. Dies schließt die Verwendung des blauen Pfeilsymbols zum Vergrößern oder Verringern der Höhe des Rasters ein. Änderungen am Inhalt des Blocks oder den Abschnittsstilen sind jedoch global und wirken sich sowohl auf mobile als auch auf Computer-Layouts aus. Zum Beispiel:
- Wenn du einen Text-Block so verschiebst, dass er einen Bild-Block im mobilen Layout überlappt, wird das Computer-Layout nicht geändert.
- Wenn du jedoch den Text oder die Farbe des Textes änderst, wirken sich diese Änderungen auf beide Layouts aus.
Wenn du nach der Bearbeitung des mobilen Layouts neue Blöcke zu deiner Website hinzufügst, ordnet unser System die neuen Blöcke im mobilen Layout so ähnlich wie möglich an das Computer-Layout an. Wir empfehlen dir, das mobile Layout zu überprüfen, wenn du Änderungen an deiner Website vornimmst.
Kreativer Editor-Abschnitte gestalten
So gestaltest du Kreativer Editor-Abschnitte:
- Klicke auf der Seite auf Bearbeiten und dann in der oberen rechten Ecke des Abschnitts, den du gestalten möchtest, auf Abschnitt bearbeiten. Wenn Abschnitt bearbeiten nicht angezeigt wird, hast du möglicherweise einen Block ausgewählt. Klicke auf den Abschnittshintergrund, damit Abschnitt bearbeiten erscheint.
- Nimm im Tab Format Stil-Änderungen am Abstand und Padding des Abschnitts vor. Wir empfehlen, verschiedene Einstellungen auszuprobieren, um einen Eindruck davon zu bekommen, wie sie sich auf das Erscheinungsbild deiner Website auswirken. Unten erfährst du mehr über deine Optionen.
- Klicke auf Hintergrund, um die Hintergrundeinstellungen zu ändern. Mehr dazu erfährst du unter Abschnittshintergrundbilder, Hintergrundvideos hinzufügen und Creative Backgrounds für Abschnitte.
- Klicke auf Farben, um das Farbschema des Abschnitts zu ändern. Mehr dazu erfährst du unter Farben ändern.
- Klicke auf Speichern, um deine Änderungen zu speichern und die Bearbeitung fortzusetzen, oder klicke auf Beenden und dann auf Speichern, um den Editor zu schließen.
Formatoptionen
Ändere die folgenden Stil-Einstellungen im Tab Format:
- Zeilenanzahl – Lege die Anzahl der Zeilen im Raster des Abschnitts fest. Dies ist die einzige Abschnittsstil-Option, bei der du unterschiedliche Einstellungen für das Computer-Layout und mobile Layout vornehmen kannst, aber die Mindestanzahl der Zeilen hängt auch davon ab, wie viele Blöcke du hinzugefügt hast und wie sie angeordnet sind.
- Abstand – Lege den Abstand zwischen den Einheiten im Raster fest, um zu bestimmen, wie viel Platz zwischen den Blöcken sein soll. Du kannst entweder keinen Abstand oder einen voreingestellten Abstand wählen oder auch auf ... klicken, um benutzerdefinierte vertikale und horizontale Abstände festzulegen.
-
Bildschirm füllen – Aktiviere diese Einstellung, um mehr Optionen für die Höhe und Ausrichtung deiner Inhalte zu erhalten. Wenn du kein Padding um den Inhalt des Abschnitts haben möchtest, lass die Einstellung deaktiviert. Die folgenden Optionen werden nur angezeigt, wenn Bildschirm füllen aktiviert ist:
- Höhe – Füge Padding zu deinem Abschnitt außerhalb des Abschnittsrasters hinzu. Du kannst zwischen Klein, Mittel oder Groß wählen oder auf … klicken, um eine benutzerdefinierte Höhe festzulegen.
- Ausrichtung – Lege fest, wo das zusätzliche Padding für die Höhe angezeigt wird. Richte den Inhalt oben aus, um Padding unter dem Inhalt hinzuzufügen. Richte den Inhalt in der Mitte aus, um Padding über und unter dem Inhalt hinzuzufügen. Richte den Inhalt unten aus, um Padding über dem Inhalt hinzuzufügen.
- Teiler – Füge am unteren Rand des Abschnitts einen Trennstrich hinzu und gestalte ihn. Mehr dazu erfährst du unter Seitenabschnitte.
Kreativer Editor oder Klassischer Editor
Diese Tabelle beschreibt die Unterschiede zwischen dem Kreativen Editor und dem Klassischen Editor. Obwohl sie viele Qualitäten und Funktionen gemeinsam haben, variieren die möglichen Layouts, und oft verfügt nur der Kreative Editor über die neuesten Optionen.
| Funktion | Kreativer Editor | Klassischer Editor |
| Layout und Anordnung | Flexibles Raster, in dem du durch Klicken und Ziehen Blöcke überall platzieren kannst, sogar überlappend mit anderen Blöcken. | Fixiertes Raster, in dem Blöcke durch Klicken und Ziehen nur neben anderen Blöcken platziert werden können, mit einigen Ausnahmen wie schwebenden Blöcken in Text. |
| Verfügbare Blöcke |
Alle Blöcke außer Abstands-Blöcken, die im Kreativen Editor nicht benötigt werden. Schaffe Platz, indem du Blöcke anklickst und an neue Orte ziehst.
Bild-Blöcke haben keine integrierten Layouts, aber du kannst diese Layouts und mehr im Kreativen Editor mithilfe von Bild-Blöcken, Text-Blöcken und Block-Hintergründen neu erstellen. |
Alle Blöcke außer Form-Blöcken, die exklusiv im Kreativen Editor verfügbar sind. |
| Blöcke duplizieren | Dupliziere einen oder mehrere Blöcke gleichzeitig oder kopiere Blöcke und füge sie in andere Abschnitte des Kreativen Editors ein. | Es ist nicht möglich, Blöcke zu duplizieren oder Blöcke zu kopieren und einzufügen. Du kannst stattdessen Seiten, Beiträge oder Abschnitte duplizieren. |
| Blöcke verschieben | Klicke und ziehe, um Blöcke an eine beliebige Stelle im Abschnitt des Kreativen Editors zu verschieben. Überlappe andere Blöcke und verwende Hilfslinien, um Blöcke zu zentrieren. | Klicke und ziehe, um Blöcke neben anderen Blöcken in Rastern mit bis zu 12 Spalten zu verschieben. Blöcke können andere Blöcke nicht überlappen und der Abstand zwischen Blöcken ist festgelegt. |
| Blöcke skalieren | Klicke und ziehe von den Blockrändern und -ecken, um die Größe von Blöcken zu ändern. Die Menge und Art des Inhalts kann sich darauf auswirken, wie die Größe eines Blocks geändert werden kann. | Verwende andere Blöcke im Layout, um die Größe der Blöcke zu ändern. Einige Blöcke bieten auch das Zuschneidewerkzeug an. |
| Design auf Mobilgeräten | Gestalte dein mobiles Layout unabhängig von deinem Computer-Layout. | Die Platzierung von Blöcken auf dem Computer legt das mobile Layout mit Responsive Design fest. Eine eigenständige Gestaltung des mobilen Layouts ist nicht möglich. |
Weitere Hilfestellungen
Diese Anleitung behandelt die grundlegenden Funktionen und Optionen des kreativen Editors. Besuche die folgenden Anleitungen, um mehr über andere Inhalts- und Stil-Einstellungen zu erfahren, die in deinen Kreativer Editor-Abschnitten angezeigt werden:
- Um Abschnitte zu verschieben, zu duplizieren und zu löschen, besuche Seitenabschnitte
- Um mehr über die verschiedenen Arten von Blöcken zu erfahren, besuche Inhalte mit Blöcken hinzufügen.
- Informationen zum Verschieben von Blöcken und zum Anordnen von Layouts findest du unter Blöcke verschieben, um Layouts anzupassen
- Um die Größe von Blöcken zu ändern, besuche Blöcke skalieren
- Um die globalen Stile deiner Website festzulegen, besuche Stil-Änderungen vornehmen
- Um dein Website-Design einem möglichst breiten Publikum zugänglich zu machen, sieh dir die Ressourcen zur Barrierefreiheit bei Squarespace an.