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

Benutzerdefinierten Code zu deiner Website hinzufügen

Auf Squarespace kannst du ohne Programmier- oder Designkenntnisse eine Website erstellen. Wenn du einen Block hinzufügst, fügst du HTML zu deiner Website hinzu, ohne den Code selbst zu schreiben. In gleicher Weise wird das CSS deiner Website geändert, wenn du Stil-Änderungen vornimmst. Die Squarespace-Plattform ist leistungsstark und flexibel, und du kannst den Großteil der Design-Herausforderungen mithilfe von integrierten Stil-Optionen bewältigen.

Um deine Website weiter anzupassen, kannst du benutzerdefinierten Code verwenden. Wir empfehlen dir dringend, nur dann benutzerdefinierte Codes hinzuzufügen, wenn du über Programmierkenntnisse verfügst. Einige Änderungen am Code können zu Konflikten mit dem zugrunde liegenden Code deiner Website führen, weshalb es schwierig sein kann, diese Änderungen zu gestalten.

Hinweis: Das Hinzufügen von Codes zu deiner Website ist eine erweiterte Modifikation, die außerhalb des Zuständigkeitsbereichs des Squarespace-Supports liegt. Wenn Sie benutzerdefinierten Code verwenden, werden wir Sie unter Umständen darum bitten, den Code zu entfernen, während wir sonstige Fehler auf Ihrer Website beseitigen. Ein wichtiger Schritt im Zuge der Fehlerbeseitigung besteht darin, festzustellen, ob benutzerdefinierter Code ein Problem verursachen könnte.

Video ansehen

Möglichkeiten zum Hinzufügen von benutzerdefiniertem Code

Squarespace unterstützt das Hinzufügen von clientseitigem Code zu deiner Website. Die Optionen hängen von deinem Abonnement ab. Alle Optionen sind während der Probephase verfügbar:

Option Tarif Unterstützter Code Über uns
Code-Block (Basis) Alle Abos

CSS

HTML

Markdown

Füge Code zu einer bestimmten Seite hinzu, um das Layout oder Design zu ändern.
Code-Block (Erweitert) Business- und E-Commerce-Abos

CSS

HTML

iFrames

JavaScript

Markdown

Füge Code zu einer bestimmten Seite hinzu, um das Layout oder Design zu ändern.
Benutzerdefinierter Code Business- und E-Commerce-Abos

HTML
JavaScript

Füge Code hinzu, der sich auf deine gesamte Website oder eine ganze Seite wie Facebook Pixel oder Live-Chat-Dienste auswirkt.
CSS-Editor Alle Abos

CSS

Ändere Schriftarten, Farben und Hintergründe. Nimm keine Layout-Änderungen vor.
Einbettungs-Block Alle Abos

HTML

JavaScript

Bette Inhalte von externen Websites ein, die den oEmbed-Standard verwenden.
Squarespace-Entwicklerplattform nur Version 7.0 für Business- und E-Commerce-Abos

CSS
HTML
JavaScript
Markdown

Greife auf den gesamten zugrunde liegenden Code deines Version 7.0-Templates zu, erstelle benutzerdefinierte Templates und deaktiviere die Template-Updates von Squarespace.

Squarespace unterstützt keinen serverseitigen Code, einschließlich PHP, Ruby, Ruby on Rails und SQL.

Code-Blöcke im Vergleich zu Einbettungs-Blöcken

Der Einbettungs-Block ruft Inhalte von externen Websites und Diensten ab, die den oEmbed-Standard verwenden. Du kannst den Einbettungs-Block verwenden, um grundlegende Inhalte von Drittanbietern auf deiner Website anzuzeigen, z. B. einen Facebook-Beitrag oder ein Video von einem Host, der nicht von Squarespace unterstützt wird.

Wenn du fortgeschritteneren und anpassbaren Code hast, ist der Code-Block die beste Wahl. Er ist vielseitig und kann Code in HTML und Markdown darstellen. Du kannst ihn auch verwenden, um Code-Schnipsel anzuzeigen. Es ist üblich, Code-Blöcke für code-basierte Anpassungen zu verwenden, wie:

  • Einbetten von Dokumenten über einen Dienst wie Issuu
  • Hinzufügen von nicht unterstützten Formularen über einen Dienst wie Wufoo
  • Hinzufügen einer MLS-Suche

HTML, JavaScript und CSS

Hier erfährst du mehr über diese gängigen Arten von benutzerdefiniertem Code, den du zu deiner Website hinzufügen kannst.

HTML

Der Code, mit dem Inhalte zu einer Webseite hinzugefügt werden. Wenn du einen Block hinzufügst, fügst du HTML zu deiner Website hinzu.

JavaScript

Der Code, mit dem Websites interaktiv werden. JavaScript arbeitet im Verborgenen, um den Einsatz von Slideshows, Schiebereglern und Lightboxen zu ermöglichen.

CSS

CSS ist die Programmiersprache, um den Stil und das Design einer in HTML geschriebenen Webseite zu gestalten. Alle Squarespace-Templates verfügen über integriertes CSS und für jedes Template stehen verschiedene Anpassungen und Stil-Optionen zur Verfügung. Wenn du Änderungen an Website-Stilen vornimmst, änderst du das CSS deiner Website. Wenn du dich entscheidest, benutzerdefiniertes CSS für deine Website anzuwenden, verwende es sparsam.

Du kannst den CSS-Editor verwenden, um Folgendes anzupassen:

  • Schriftarten
  • Farben
  • Hintergründe

CSS sollte für Folgendes nicht verwendet werden:

  • Padding
  • Außenabstand (Margins)
  • Floats
  • Größen (Blöcke, Bilder oder Banner)
  • Positionierung

Benutzerdefiniertes CSS hat ein Limit von 128.000 Zeichen.

Die Squarespace-Entwicklerplattform (nur Version 7.0)

Wenn du ein fortgeschrittener Benutzer bist, der Version 7.0 verwendet, kannst du die Squarespace-Entwicklerplattform verwenden, um auf den zugrunde liegenden Code des Templates deiner Website zuzugreifen. Diese Plattform ist für Entwickler und Design-Agenturen gedacht, damit sie unsere bestehenden Templates ändern und sogar Templates von Grund auf neu erstellen können. Änderungen an „Code einfügen“, die du auf der Entwicklerplattform vornimmst, verschwinden, wenn du den Entwicklermodus jemals deaktivierst.

Einfügen von benutzerdefiniertem Code ist nicht möglich

Wenn du beim Einfügen deines Codes Probleme hast, empfehlen wir dir, Tastaturkürzel zu verwenden. Klicke dafür in den Bereich, in den du etwas einfügen möchtest, und drücke dann:

PC Mac
Strg + V  Command + V

Der benutzerdefinierte Code wird nicht angezeigt

Benutzerdefinierter Code wird möglicherweise aus mehreren Gründen nicht angezeigt:

  • Du bist angemeldet – Code in einem Code-Block wird aus Sicherheitsgründen mitunter nicht angezeigt, wenn du angemeldet bist, selbst wenn Besucher ihn sehen können. Das passiert, wenn du versuchst, eingebettetes JavaScript über eine sichere Verbindung (https://) anzuzeigen. Um dies zu testen, besuche deine Website in einem Inkognito-Browser.
  • Der Code befindet sich auf einer Index-Seite – Dein Code wird möglicherweise nicht angezeigt, wenn du ihn zu einer Seite innerhalb eines Index hinzugefügt hast. Um dies zu testen, entferne im Seiten-Menü die Seite aus dem Index und besuche deine Website dann in einem Inkognito-Browser.

Wenn der Code immer noch nicht funktioniert, wende dich an die Quelle des Codes, da sie mit dem Code und der Funktionsweise am besten vertraut ist. Codes von Drittanbietern fallen nicht in den Bereich des Squarespace-Supports, daher können wir dir bei keiner zusätzlichen Fehlerbehebung helfen.

Programmierressourcen

Im Folgenden werden einige beliebte und zuverlässige Websites aufgelistet, die wir als Quelle für Tutorials, Fehlerbeseitigungen und Anleitungen empfehlen:

Hinweis: Benutzerdefinierter Code übersteigt den Rahmen unserer Kundenbetreuung. Das bedeutet, dass wir keine weitere Unterstützung bei der Einrichtung oder Fehlerbehebung bieten können. 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 Responsive Design, insbesondere auf das Erscheinungsbild auf Mobilgeräten, und auf die Kompatibilität mit allen Templates. CSS-Anpassungen könnten auch zu Problemen mit der Anzeige im Zusammenhang mit zukünftigen Updates unserer Plattform 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?
117 von 217 fanden dies hilfreich
Benutzerdefinierten Code zu deiner Website hinzufügen