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.

Ein Video anschauen

Bevor Sie beginnen

Schauen Sie sich in Häufig gestellte Fragen zum benutzerdefinierten Code unsere Empfehlungen dazu an, was Sie mit CSS ändern sollten und was nicht.

Note: Custom code, including CSS, falls outside the scope of our support. This means we’re unable to help further with setup or troubleshooting. Additionally, with a code-based solution, we can’t guarantee its functionality or full compatibility with Squarespace. This includes how it functions with our responsive design, particularly its appearance on mobile devices, and if it functions on all templates. CSS customizations can also cause display issues with future updates to our platform. While we can't help further, there are many resources that can point you in the right direction:

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.

Line numbers display on the left to help you reference pieces of code. Syntax errors display at the bottom in red.

Note: Squarespace’s CSS Editor syntax checking system is a parser. Rather than validating against a set of rules, the parser tests what's actually going to work in different browsers. Even if your code doesn’t return an error on a CSS validator, the parser will flag it if it thinks that a line may not work the way it's intended. If you see a syntax error, revise the CSS to ensure it’s written and formatted correctly and nothing’s missing.

Dateien hochladen (optional)

Use the file upload area to upload assets for custom images or font files:

  1. Click Manage Custom Files under the CSS Editor.
  2. Click Add images or fonts or drag files into that area to upload your file.

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 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

Hochgeladene Dateien verwenden (optional)

Wenn Sie Bild- oder Schriftart-Datein im Bereich Benutzerdefinierte Dateien hochgeladen haben, möchten Sie diese sicherlich in Ihrem Code benutzen.

Sie tun dies am schnellsten, indem Sie Ihren Code bis zu dem Punkt eingeben, an dem Sie die Datei-URL als Referenz benötigen. Belassen Sie dann die Maus an der Stelle, wo Sie die URL im Code einfügen möchten, und 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.

 

Hinweis: Benutzerdefiniertes CSS wird nicht übernommen, wenn Sie Vorlagen wechseln. Wenn Sie zur vorherigen Vorlage zurückwechseln, ist das CSS, das Sie zu dieser hinzugefügt hatten, weiterhin vorhanden.
War dieser Beitrag hilfreich?
51 von 125 fanden dies hilfreich