Hinweis: Während unsere beliebtesten Anleitungen ins Deutsche übersetzt wurden, sind einige Anleitungen nur auf Englisch verfügbar.

Code-Blöcke

Sie können Code-Blöcke benutzen, um benutzerdefinierten Code zu einer Seite, einem Blogeintrag, einer Seitenleiste, einem Footer oder einem sonstigen Inhaltsbereich hinzuzufügen. Code-Blöcke sind eine gute Option, wenn Sie Widgets von Drittanbietern einbetten oder eine Seite jenseits der Möglichkeiten anderer Blöcke anpassen wollen. Sie können Code-Blöcke auch zum Rendern von HTML und Markdown oder zur Anzeige von Code-Schnipseln verwenden.

Näheres zur Auswahl des besten Blocks für Ihre benutzerdefinierten Inhalte erfahren Sie unter Embed-Blöcke und Code-Blöcke im Vergleich.

Code-Blöcke unterstützen bei allen Abonnements Klartext, HTML, Markdown und CSS-Code umgeben von <style></style>-Tags.

Das Hinzufügen von JavaScript oder iFrames zu Code-Blöcken ist eine Premium-Funktion, die im Rahmen des Business- und E-Commerce-Abos verfügbar ist.

Ein Video anschauen

Einen Code-Block hinzufügen

So fügen Sie einen Code-Block hinzu:

  1. Bearbeite eine Seite oder einen Beitrag, klicke auf eine Einfügemarke und wähle Code aus dem Menü aus. Weitere Informationen findest du unter Inhalte mithilfe von Blöcken hinzufügen.
  2. Füge deinen Code in das Textfeld ein.
  3. Wenn Sie den Code-Block benutzen, um Code-Schnipsel anzuzeigen, setzen Sie ein Häkchen bei Display Source (Quellcode anzeigen).
  4. Klicken Sie auf Anwenden, um Ihre Änderungen zu speichern.

Code hinzufügen

Wenn Sie den Code-Block zum Rendern von Code verwenden, denken Sie daran, HTML oder Markdown im Drop-down-Menü auszuwählen.

Gib den Code in das Textfeld ein oder füge ihn ein und entferne den <p>Hallo Welt!</p>-Platzhalter. Um Code einzufügen, kopiere den Code, klicke dann in das Feld und drücke Strg + V (Windows) oder Command + V (Mac).

Code-Blöcke, die auf CSS oder JavaScript gesetzt sind, zeigen Code standardmäßig als Text an. Um CSS oder JavaScript in Code-Blöcken zu rendern, wählen Sie HTML aus dem Drop-down-Menü aus. Umgeben Sie den Code für CSS anschließend mit <style> </style>-Tags. Geben Sie für JavaScript vor und nach dem Code die Tags <script></script> ein.

Hinweis: Code-Blöcke sind auf 400 KB beschränkt, was etwa 300.000 Zeichen entspricht.

Quelle anzeigen

Wenn Sie den Code-Block benutzen, um Code-Schnipsel anzuzeigen, setzen Sie ein Häkchen bei Display Source (Quellcode anzeigen).

Dies ist insbesondere zur Anzeige von Code-Beispielen nützlich, da Code-Blöcke einzelne Code-Schnipsel automatisch auf Lesbarkeit hin formatieren. Aus diesem Grund stellen sie eine bessere Option als Text-Blöcke dar.

Hinweis: Display Source (Quellcode anzeigen) ist bei den Optionen CSS, JavaScript und Nur-Text standardmäßig aktiviert.

Vorschau von eingebettetem Code

Aus Sicherheitsgründen wird Ihr Code mitunter nicht angezeigt, wenn Sie angemeldet sind, auch wenn Besucher den Block sehen können. Wenn Sie Code, den Sie in einen Code-Block eingefügt haben, nicht sehen können, klicken Sie auf Vorschau im sicheren Modus, um das eingebettete Element zu sehen.

Fehlerbeseitigung

Wenn Sie Probleme mit Code-Blöcken haben, bedenken Sie Folgendes:

  • Ihr Code könnte deshalb nicht angezeigt werden, weil Sie ihn in eine Seite im Index eingefügt haben. Um dies zu überprüfen, entfernen Sie die Seite über das Seiten-Menü aus dem Index und melden Sie sich von Ihrer Website ab.
  • Durch das Laden von Ajax kann es zu Problemen mit dem benutzerdefinierten Code kommen. Deaktivieren Sie Ajax, um zu testen, ob das Problem weiterhin auftritt.
  • Wenn Probleme mit dem Code-Block Sie daran hindern, Ihre Website zu bearbeiten, nutzen Sie die Option Skripts in der Vorschau deaktivieren, um den Code zu bearbeiten oder zu entfernen.

Sollten Sie immer noch Probleme haben, wenden Sie sich bitte an den Herausgeber (z. B. an den Service, von dem Sie den Code für ein Widget erhalten haben), da man sich dort am besten mit dem jeweiligen Code und seiner Funktionsweise auskennt.

Hinweis: Codebasierte Anpassungen fallen nicht in den Rahmen unserer Kundenbetreuung. Dies bedeutet, dass wir leider nicht in der Lage sind, dir bei der Einrichtung oder der Fehlerbeseitigung von benutzerdefiniertem Code zu helfen. Außerdem können wir bei einer codebasierten Lösung die Funktionalität oder vollständige Kompatibilität mit Squarespace nicht garantieren. Dies bezieht sich etwa auf die Funktionalität in Verbindung mit responsivem Design, insbesondere auf das Erscheinungsbild auf Mobilgeräten, und auf die Kompatibilität mit allen Templates. Codebasierte Anpassungen könnten außerdem im Anschluss an zukünftige Updates unserer Plattform zu Darstellungsproblemen führen. Wir können dir in diesem Fall nicht weiterhelfen, allerdings gibt es viele andere Informationsquellen, die dich hier unterstützen können:
War dieser Beitrag hilfreich?
93 von 299 fanden dies hilfreich