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. Bearbeiten Sie eine Seite oder einen Beitrag, klicken Sie auf eine Einfügemarke und wählen Sie Code aus dem Menü aus. Weitere Hilfe finden Sie unter Blöcke hinzufügen.
  2. Fügen Sie Ihren 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.

Geben Sie dann den Code in das Textfeld ein und entfernen Sie den Platzhalter <p>Hello, World!</p>. Um Code einzufügen, kopieren Sie den Code, klicken Sie dann auf das Textfeld und drücken Sie anschließend 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: Anpassungen von Drittanbietern übersteigen den Rahmen unserer Kundenbetreuung. Dies bedeutet, dass wir leider nicht in der Lage sind, Ihnen bei der Einrichtung oder der Fehlerbeseitigung von benutzerdefiniertem Code zu helfen. Außerdem können wir bei einer codebasierten Lösung die Funktionalität und vollständige Kompatibilität mit Squarespace nicht garantieren. Dies bezieht sich etwa auf die Funktionalität im Verbund mit anpassungsfähigem Design, insbesondere auf das Erscheinungsbild auf Mobilgeräten, und auf die Kompatibilität mit allen Templates. Anpassungen von Drittanbietern könnten im Anschluss an zukünftige Updates unserer Plattform auch zu Darstellungsproblemen führen. Obwohl wir Ihnen in diesem Fall nicht weiterhelfen können, gibt es zahlreiche weitere Informationsquellen, die Sie an dieser Stelle unterstützen können:
War dieser Beitrag hilfreich?
87 von 244 fanden dies hilfreich