Anmerkung: Unsere beliebtesten Anleitungen wurden ins Deutsche übersetzt, alle restlichen Anleitungen sind bisher nur auf Englisch verfügbar
Den CSS Editor benutzen

Wenn Sie über Programmierkenntnisse verfügen und Ihre Website über die Anpassungen unter Website-Stil hinaus anpassen möchten, können Sie mit dem CSS-Editor CSS-Code hinzufügen.

CSS sollte nur benutzt werden, um Schriftarten, Farben und Hintergründe zu ändern. Andere CSS Änderungen könnten Ihrer Website potenziell schaden.

Hinweis: Benutzerdefiniertes CSS wird nicht übernommen, wenn Sie Templates wechseln. Wenn Sie zur vorherigen Vorlage zurückwechseln, ist das CSS, das Sie zu dieser hinzugefügt hatten, weiterhin vorhanden.

Ein Video anschauen

Bevor Sie beginnen

Hinweis: Benutzerdefinierter Code, darunter auch CSS, ü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 im Verbund mit responsivem 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 Ihnen in diesem Fall nicht weiterhelfen, allerdings gibt es viele andere Informationsquellen, die Sie hier unterstützen können:

CSS-Code hinzufügen

So fügen Sie CSS-Code hinzu: 

  1. Im Home Menu (Hauptmenü), klicken Sie auf Design, dann auf Custom CSS (Benutzerdefinierte CSS).
  2. Um den Editor in einem erweiterbaren-Fenster zu öffnen, klicken Sie auf In Fenster öffnen. Das Fenster wird geschlossen, wenn Sie vom Panel „Benutzerdefiniertes CSS“ weg navigieren.
  3. Fügen Sie Ihren Code hinzu.
  4. Wenn Sie fertig sind, klicken Sie auf Save (Speichern), um Ihre Änderungen zu veröffentlichen.

Zeilennummern werden auf der linken Seite angezeigt, um Ihnen zu helfen, Teile Ihres Codes zu referenzieren. Syntax-Fehler erscheinen unten in rot.

Hinweis: Das CSS Editor Syntax-Überprüfungssystem von Squarespace ist ein Parser. Anstatt nach einem Regelsatz zu validieren, testet der Parser, was tatsächlich in verschiedenen Browsern funktionieren wird. Auch wenn Ihr Code keinen Fehler auf einem CSS-Validierer anzeigt, wird er vom Parser gemeldet, wenn er annimmt, dass die Zeile eventuell nicht wie vorgesehen funktioniert. Wenn Sie einen Syntax-Fehler sehen, überprüfen Sie die CSS, um sicherzugehen, dass sie korrekt geschrieben und formatiert ist und nichts fehlt.

Dateien hochladen (optional)

Verwenden Sie den Datei-Upload-Bereich, um Assets für benutzerdefinierte Bilder oder Schriftartendateien hochzuladen:

  1. Klicken Sie auf Benutzerdefinierte Dateien verwalten unter dem CSS-Editor.
  2. Klicken Sie auf Bilder oder Schriftarten hinzufügen oder ziehen Sie Dateien in diesen Bereich, um Ihre Datei hochzuladen.
Tipp: Wenn sich der Datei-Upload-Bereich nicht öffnet, aktivieren Sie Pop-ups in Ihrem Browser.

Akzeptierte Dateitypen

Der Bereich für benutzerdefinierte Dateien ist Bildern und Schriftarten in den folgenden Formaten vorbehalten:

  • .jpg
  • .png
  • .gif
  • .ttf
  • .otf
  • .woff

.svg-Dateien sind in diesem Feld nicht zulässig.

Benutzerdefinierte Dateien verwenden

So verwenden Sie die Dateien:

  1. Schreiben Sie Ihren Code bis zu dem Punkt, an dem Sie die Datei-URL zum Verweisen benötigen.
  2. Lassen Sie den Cursor an der Stelle, an der Sie die URL im Code platzieren möchten.
  3. Klicken Sie auf die Datei.

Der CSS Editor wird dann automatisch die direkte URL der Datei dort einfügen, sodass Sie diese in Ihren Code aufnehmen können.

Benutzerdefinierte Dateien und SSL

Je nachdem, ob SSL aktiviert ist oder nicht, wird die URL der Datei als sicher bzw. unsicher formatiert. Wenn Sie die SSL-Einstellungen Ihrer Website verändern, sollten Sie auch die URL der Datei entsprechend ändern. Bei aktivierter SSL-Option gehen Sie beispielsweise folgendermaßen vor:

  1. Öffnen Sie den CSS-Editor.
  2. Klicken Sie auf Manage Custom Files (Benutzerdefinierte Dateien verwalten).
  3. Klicken Sie auf die Datei.
  4. Ändern Sie die URL, sodass sie mit https beginnt.
  5.  Klicken Sie auf Save (Speichern).

add-the-s.png

War dieser Beitrag hilfreich?
53 von 131 fanden dies hilfreich