Einen Sperrbildschirm anpassen

Aktiviere und gestalte eine Sperrbildschirm-Seite passend zum Stil deiner Website.

Zuletzt aktualisiert: 30. Mai 2024

Wenn sich deine Website noch im Aufbau befindet oder du den Zugriff beschränken möchtest, kannst du deine Seite oder spezifische Seiten hinter einem Password verbergen, um zu verhindern, dass die Inhalte öffentlich zugänglich sind. Während deine Website oder Seite mit einem Passwort geschützt ist, wird ein Sperrbildschirm angezeigt und Besucher müssen das Passwort eingeben, um Zugriff zu erhalten.

Erwäge, den Inhalt deiner Website zu monetarisieren, indem du eine Mitglieder-Website erstellst.

In dieser Anleitung erfährst du mehr über das Erstellen und Anpassen deines Sperrbildschirms.

Sperrbildschirm aktivieren

So erlangst du Zugriff auf diese Funktion

Sperrbildschirme sind sowohl für bezahlte als auch für Probe-Websites verfügbar.

So aktivierst du einen Sperrbildschirm:

  1. Lege ein Passwort für die gesamte Website oder ein seitenspezifisches Passwort fest.
  2. Gestalte deinen Sperrbildschirm und passe ihn an. Weitere Informationen findest du in den folgenden Abschnitten.
  3. Teile das Passwort mit jeder Person, der du eine Vorschau deiner Website zeigen möchtest.

Den Sperrbildschirm anpassen

Um dem Stil deiner Marke oder deiner Website zu entsprechen, kannst du im Design-Menü ein benutzerdefiniertes Design für den Sperrbildschirm erstellen. Einige Fälle, in denen ein benutzerdefinierter Sperrbildschirm nützlich sein könnte, sind:

  • Ein Fotograf, ein Kreativprofi oder eine Agentur, die Kunden anhand eines Sperrbildschirms Zugriff auf private Inhalte geben möchte.
  • Wenn sich deine Seite oder Website noch in Bearbeitung befindet, kann der Sperrbildschirm als Baustellen-Seite verwendet werden.
  • Du kannst auch einen Sperrbildschirm verwenden, um eine private Website oder Seite nur für den internen Gebrauch zu erstellen.

Hier siehst du einen Beispiel-Sperrbildschirm, der als Baustellen-Seite verwendet wird:

KB Guide Image

Best Practices für das Design

Alle Sperrbildschirm-Layouts sind mit Responsive Design entwickelt, sodass sie auf jedem Gerät hervorragend aussehen. Es gibt jedoch einige Best Practices, die du bei der Verwendung eines Sperrbildschirms beachten solltest.

Übersichtliche Gestaltung

Der Sperrbildschirm ist wahrscheinlich die erste Seite, die Besucher sehen. Sie sollte speziell darauf ausgerichtet sein, Besucher zur Passworteingabe aufzufordern. Damit das Design des Sperrbildschirms möglichst zielgerichtet und effektiv ist, stellen wir nur wenige Layoutoptionen dafür bereit.

Ein Sperrbildschirm für alle Seiten

Ihre Website verfügt über ein Sperrbildschirmdesign für alle passwortgeschützten Bereiche. Es kann nicht pro Seite angepasst werden.

Keine Blöcke

Sperrbildschirme unterscheiden sich von anderen Squarespace-Seiten. Anders als andere Inhaltsbereiche bestehen Sperrbildschirme nicht aus Abschnitten oder Blöcken. Du beginnst mit einem vorgefertigten Layout und passt dieses dann mit den Bearbeitungstools an.

Video ansehen

Wählen Sie ein neues Layout

So wählst du ein Layout für deinen Sperrbildschirm aus:

  1. Öffne das Sperrbildschirm-Menü.
  2. Das Menü zeigt eine Vorschau des Sperrbildschirms, auf der Änderungen in Echtzeit widergespiegelt werden. Du beginnst mit einem leeren Design.
  3. Klicke auf Layout ändern, um ein neues Layout für den Sperrbildschirm auszuwählen. Das Hintergrundbild wird in einem späteren Schritt geändert. Zunächst solltest du dich auf die Platzierung des Text- und Passwortfeldes konzentrieren.
  4. Um ein Layout auszuwählen, bewege den Mauszeiger darüber und klicke auf Auswählen.
  5. Klicken Sie auf Speichern.

Du kannst dem Sperrbildschirm einen Countdown-Timer als benutzerdefiniertes Layout hinzufügen, indem du benutzerdefinierten Code hinzufügst. Weitere Informationen hierzu findest du in diesem Beitrag im Squarespace Forum. Bitte beachte, dass benutzerdefinierte Code-Modifikationen nicht von unserem Support abgedeckt werden. Das bedeutet, dass wir keine Unterstützung bei der Einrichtung oder Fehlerbehebung codebasierter Lösungen bieten können.

Branding und Text hinzufügen

Verwenden Sie das Menü Branding & Text, um Inhalte hinzuzufügen, die dem Stil Ihrer Website entsprechen. Sie können:

  • Einen Branding-Text oder ein Logo hinzufügen
  • Eine Seitenüberschrift hinzufügen
  • Einen längeren Textkörper hinzufügen
  • Das Schloss-Symbol ein- oder ausblenden

So fügst du ein Logo-Bild hinzu:

  1. Wähle unter Markenführung Logo aus und klicke dann auf das Symbol +.
  2. Klicke auf Datei hochladen, um ein Bild von deinem Gerät hochzuladen. Du kannst ein Bild wiederverwenden, indem du auf Aus der Bibliothek auswählen klickst.
  3. Um deine Änderungen zu bestätigen, klicke auf Speichern.

Vergewissere dich, dass dein Logo unseren Best Practices entspricht, oder erstelle ein neues Logo mit Squarespace Logo.

Nachdem du ein Bild hinzugefügt hast, kannst du:

  • Dein Bild bearbeiten.
  • Um den Bildausschnitt deines Bildes festzulegen, klicke auf die drei Punkte und dann auf Bildausschnitt.
  • Das Bild ändern, indem du auf Ersetzen klickst.
  • Das Bild löschen, indem du auf die drei Punkte und dann auf Entfernen klickst.

Denk daran:

  • Branding und Textanzeige variieren je nach Layout.
  • Es ist nicht möglich, gleichzeitig ein Logo und Branding-Text anzuzeigen.
  • Im Gegensatz zu anderen Seiten verlinken Seitentitel und Logos auf Sperrbildschirmen nicht auf die Startseite der Website.
  • Der Browser-Tab für einen Sperrbildschirm zeigt immer den Titel deiner Website und das Wort „Sicher“ an.

Hinzufügen von Hintergrundbildern oder Videos

Über das Medien-Menü kannst du ein randloses Hintergrundbild, ein Video oder eine Farbe auf dem Sperrbildschirm anzeigen. Du hast folgende Möglichkeiten:

Denk daran:

  • Es ist nicht möglich, Videos auf einen Sperrbildschirm hochzuladen. Um ein Hintergrundvideo hinzuzufügen, lade deine Videos auf YouTube oder Vimeo hoch und verwende dann die Video-URL.
  • Vor dem Hochladen solltest du deine Bilder richtig formatieren.
  • Sie können den integrierten Bild-Editor verwenden, um das Originalbild zu bearbeiten.
  • Du kannst mehrere Bilder hochladen, um eine Slideshow oder einen Rasterhintergrund zu erstellen. Sperrbildschirm-Slideshows wechseln automatisch zwischen Bildern.
  • Das Hochladen mehrerer hochauflösender Bilder kann sich auf die Ladezeit deines Sperrbildschirms auswirken.
  • Aufgrund des Responsive Designs werden Bilder und Videos insbesondere auf Mobilgeräten immer – mal mehr, mal weniger stark – zugeschnitten. Wie stark dieser Beschnitt ist, hängt von der Höhe des Bildes, der Breite des Browsers und dem von dir gewählten Layout ab.

Verwenden einer Hintergrundfarbe

Um eine einfache Hintergrundfarbe anstelle eines Bildes oder Videos anzuzeigen, wählen Sie Keine. Das Bild verschwindet dann aus der Vorschau. Ändern Sie die Hintergrundfarbe im Stil-Menü.

Stil des Sperrbildschirms

Verwende ‌das Stil-Menü, um die Typografie und Farben des Sperrbildschirms zu ändern. Die Stile für den Sperrbildschirm sind von den restlichen Stilen deiner Website getrennt. Daher wirken sich die Optionen Stil auf Standard zurücksetzen oder Alle auf Systemschriftarten festlegen nur auf deine Sperrbildschirm-Stile aus.

  1. Klicken Sie im Sperrbildschirm auf Stil.
  2. Verwende die Optionen, um den Sperrbildschirm zu gestalten. Wenn du den Stil mithilfe der Anpassungen im Menü änderst, ändert sich die Vorschau des Sperrbildschirms.
  3. Wenn Sie fertig sind, klicken Sie auf Speichern.

Hinweis

Es ist nicht möglich, den Stil von Branding, Überschriften oder Textkörper auf Websites der Version 7.1 anzupassen.

Passwort-Feld

Verwenden Sie die Anpassungen im Abschnitt „Passwort“, um das Passwortfeld anzupassen.

Wenn du Stil: Rechteck wählst, kannst du Hintergrund- und Schriftfarbe unabhängig voneinander anpassen.

Wenn Sie Stil: Unterstrichen wählen:

  • Die Anpassung Farbe wirkt sich sowohl auf die Unterstreichung als auch auf den Text aus.
  • Der Text wird 50% heller als die Unterstreichung angezeigt.
  • Wenn der Text als Farbe angezeigt wird und er grau sein soll, verschieben Sie den Selektor von der rechten Seite der Farbauswahl nach links.
Footer Image
  • Hol dir Hilfe von der Community

  • Hol dir Hilfe von unserer Community zu erweiterten individuellen Anpassungen.

  • Beauftrage einen Squarespace-Experten

  • Hebe dich online von der Masse ab, indem du dir von einem erfahrenen Webdesigner oder Entwickler helfen lässt.