Fehlerbehebung bei Brine

Behebung der häufigsten Probleme in der Template-Gruppe Brine.

Zuletzt aktualisiert: 12. Dezember 2024

Hier sind einige häufig auftretende Probleme mit diesem Template. Einige davon sind Bugs oder bekannte Probleme. Obwohl wir weiterhin einen Support für Squarespace Version 7.0 haben, hat die Behebung von Fehlern oder Problemen für uns eine geringere Priorität, da wir uns auf unsere aktuelle Plattform, Version 7.1, konzentrieren. Du kannst mit Hilfe unseres Update-Tools deine Website von Version 7.0 auf Version 7.1 updaten.

Allgemeine Hilfe findest du in der Anleitung für Brine-Templates. Alternativ kannst dir auch die Liste der Brine-Templates ansehen.

Einen Button zur Kopfzeile hinzufügen

Das Hinzufügen eines Buttons zur Kopfzeile ist eine gute Möglichkeit, ein bestimmtes Verhalten zu fördern, wie z. B. den Datenverkehr auf eine bestimmte Seite zu lenken.

Es gibt eine Reihe von Möglichkeiten, einen Button zu einer Kopfzeile hinzuzufügen:

  • Verwende die Navigation: Um eine Handlungsaufforderung in deiner Navigation zu erstellen, lasse nur einen Link in deiner Sekundärnavigation und gestalte die Sekundärnavigation dann als Button. Gestalte deine Hauptnavigation in einem beliebigen anderen Stil.
  • Verwenden Sie den Intro-Bereich: Erstellen Sie eine Handlungsaufforderung auf einzelnen Seiten, indem Sie einen Button-Block zum Intro-Bereich hinzufügen. Fügen Sie Text oder andere Blöcke hinzu, um Ihre Botschaft hervorzuheben.

Banner-Bild oder -Video wird nicht angezeigt

In Brine werden Banner auf den meisten Seitentypen angezeigt, sie werden jedoch nicht auf folgenden unterstützt:

  • Einzelne Blogeinträge, Produkt- und Veranstaltungsdetail-Seiten.
  • Cover-Seiten
  • Zur Haupt-Index-Seite hinzugefügte ausgewählte Bilder. Füge ausgewählte Bilder stattdessen zu Inhaltsabschnitten innerhalb des Index hinzu.
  • Video-Banner werden je nach Verbindungsgeschwindigkeit des Besuchers und Browser-Version gelegentlich nicht auf Mobilgeräten angezeigt. Legen Sie ein Ersatzbild für Mobilgeräte fest, das erscheint, wenn das Video-Banner nicht geladen werden kann.

Wenn Ihre Seite Banner unterstützt, aber keine angezeigt werden, finden Sie hier einige Schritte zur Fehlerbehebung:

  1. Klicke in den Seiteneinstellungen auf den Tab Medien.
  2. Für Banner-Bilder klicken Sie auf Bild. Für Video-Banner klicken Sie auf Video.
  3. Stellen Sie sicher, dass das Bild oder Video vorhanden ist.
  4. Klicken Sie auf Speichern und aktualisieren Sie die Seite.

Wenn das Banner immer noch nicht angezeigt wird:

  1. Scrolle unter Website-Stile zum Abschnitt Hauptbereich.
  2. Erhöhen Sie den Intro-Freiraum (mit Hintergrundbild).
  3. Stelle im Abschnitt Haupt: Overlay sicher, dass die Overlay-Farbe nicht vollständig deckend ist.
  4. Klicken Sie auf Speichern und aktualisieren Sie die Seite.

Banner werden nicht randlos angezeigt

Banner werden typischerweise randlos angezeigt, d. h. sie erstrecken sich bis an die Ränder des Browsers. Wenn deine Banner dies nicht tun, ändere dein Website-Layout:

  1. Scrolle unter Website-Stile zum Abschnitt Website.
  2. Wähle Design: Gesamte Breite oder Design: Gesamter Hintergrund.
  3. Stelle im Abschnitt Website: Rand sicher, dass Rand anzeigen deaktiviert ist.
  4. Klicken Sie auf Speichern und aktualisieren Sie die Seite.

Blogeinträge haben keine Kommentar-Abschnitte

Blog-Kommentare sind in Brine standardmäßig deaktiviert, auch wenn Sie Kommentare für einen einzelnen Blogeintrag aktivieren.

So aktivieren Sie Kommentare für Ihre Website:

  1. Öffne das Menü „Blog-Präferenzen“.
  2. Klicken Sie auf Kommentar-Einstellungen.
  3. Klicke auf Kommentare überall aktivieren. Weitere Kommentar-Einstellungen werden angezeigt.

Mehr dazu erfährst du unter Blog-Kommentare und einfache Likes.

Ändern des Monatstextes in einem Kalender der Event-Seite

Im Kalender-Layout Events-Seite wird der Monatsname über dem Kalender zentriert. Schriftart, Größe und Farbe des Monats folgen den Anpassungen für Überschrift 1. So kannst du diese Optimierungen anpassen:

  1. Navigieren Sie zu einer anderen Seite auf Ihrer Website, die Text mit der Formatierung Überschrift 1 enthält.
  2. Gehe zurück zum Website-Menü und klicke dort auf Design und dann auf Website-Stile.
  3. Suche die Anpassungen für Überschrift 1 unter Inhalt: Schriftarten und Inhalt: Farben.
  4. Klicke auf Speichern und kehre dann zur Events-Seite zurück, um deine Änderungen anzuzeigen.

Spalten werden an der falschen Stelle angezeigt

Einzelne Spalten mit einer Inhaltseinrückung fließen um schwebende Blöcke herum.

Wenn der schwebende Block größer als der einspaltige Inhalt ist, kann er das Layout des mehrspaltigen Inhalts darunter beeinträchtigen. Um dies anzupassen, fügst du einen Abstandshalter-Block über dem mehrspaltigen Inhalt hinzu.

KB Guide Image

Randloses Hintergrundbild erstellen

Du kannst eine Index-Seite verwenden, um den Effekt einer einzelnen Seite mit Hintergrundbild zu erzeugen:

  1. Erstellen Sie eine Index-Seite.
  2. Fügen Sie einen Inhaltsabschnitt hinzu.
  3. Füge ein ausgewähltes Bild zum Inhaltsabschnitt hinzu. Dadurch wird das Hintergrundbild erstellt.
  4. Füge deinen Seiteninhalt zum Inhaltsabschnitt hinzu. Er wird das ausgewählte Bild überlagern.
  5. Um die Höhe zu vergrößern, fügen Sie zusätzliche Leerzeichen am Ende eines Text-Blocks hinzu.
page-background-brine.png

Slideshow-Banner erstellen

Du kannst eine Index-Seite verwenden, um den Effekt eines Slideshow-Seiten-Banners zu erzeugen:

  1. Erstellen Sie eine Index-Seite.
  2. Klicken Sie auf Abschnitt hinzufügen, um den ersten Abschnitt zu erstellen.
  3. Wählen Sie Galerie aus und fügen Sie der Sammlung mehrere Bilder hinzu.
  4. Fügen Sie einen Galerie-Indexabschnitt mit mehreren Bildern als ersten Abschnitt hinzu.
  5. Wähle im Abschnitt Index: Galerie unter Website-Stile die Option Layout: Slideshow. (Diese Einstellung wird auf alle Galerie-Index-Abschnitte auf deiner Website angewandt.)
  6. Stelle im Abschnitt Index: Slideshow-Galerie sicher, dass Galerie-Autoplay aktiviert ist.
  7. Fügen Sie einen Inhaltsabschnitt unterhalb des Katalog-Indexabschnitts hinzu und fügen Sie den Seiteninhalt hinzu.
brine-slideshow-banner.gif

Parallax Scrolling deaktivieren

Gehen Sie dazu wie folgt vor:

  1. Gehen Sie zu einer Seite mit einem Banner-Bild.
  2. Scrolle unter Website-Stil zum Abschnitt Hauptbereich: Overlay.
  3. Deaktiviere Parallax aktivieren.
  4. Klicken Sie auf Speichern und aktualisieren Sie die Seite.

Dies betrifft Ihre gesamte Website.

Drop-downs werden in der Footer-Navigation nicht als Drop-down-Menüs angezeigt. Du kannst diese stattdessen als separate Spalten anzeigen, wobei der Drop-down-Titel als Header der Spalte dient.

Drop-down-Menüs kannst du als Drop-down über die Haupt- oder Sekundärnavigation zur Navigation hinzufügen.

KB Guide Image

Das Drop-down-Menü im Header wird abgeschnitten

Wenn der letzte Navigationslink rechts auf deiner Website ein Drop-down-Menü ist, werden die Seitentitel möglicherweise abgeschnitten angezeigt. Dies kann bei kleineren Bildschirmen (z. B. Tablets) oder bei einer Reduzierung der Stil-Anpassung des Website-Padding vorkommen. Das kannst du folgendermaßen beheben:

  1. Navigiere im Seiten-Menü zum Drop-down, das dein Drop-down-Menü erstellt.
  2. Verschiebe das Drop-down an eine andere Position im Abschnitt Hauptnavigation. Solange sich dein Drop-down nicht an letzter Stelle befindet, werden die Seitentitel vollständig angezeigt.

Dies geschieht, wenn die Hintergrundfarbe deines Footers teilweise oder vollständig transparent ist. Auf Seiten ohne ausgewählte Bilder wird die Farbe des Footers über einem weißen Hintergrund angezeigt. Auf Seiten mit ausgewählten Bildern wird die Hintergrundfarbe des Footers über der Farbe deines Hauptinhaltsbereichs angezeigt.

So beheben Sie dies:

  1. Scrolle unter Website-Stil zum Abschnitt Footer.
  2. Stelle sicher, dass die Hintergrundfarbe vollständig deckend ist.

Mittlerer Blockbereich des Footers ist verschwunden

Manchmal, wenn du alle Inhalte aus dem mittleren Blockbereich löschst, verschwindet die Beschriftung in der Spaltenansicht. Um dies zu beheben, wechselst du vorübergehend zum gestapelten Layout:

  1. Scrolle unter Website-Stil zum Abschnitt Footer.
  2. Wählen Sie Layout: Stapel.
  3. Verlassen Sie Website-Stil.
  4. Füge Inhalte zum Mittleren Blockbereich des Footers hinzu.
  5. Öffnen Sie Website-Stil erneut und wählen Sie Layout: Spalten.
  6. Klicken Sie auf Speichern.

Kopfzeilen-Elemente werden nicht richtig angezeigt

Wenn zu viele Elemente so eingestellt sind, dass sie im selben Bereich der Kopfzeile angezeigt werden, können sie sich auf Tablets oder in kleineren Browsern eventuell überlappen.

Platziere für optimale Ergebnisse jedes Element in einem anderen Teil der Kopfzeile. Wähle im Abschnitt Kopfzeile: Layout unter Website-Stile, wo jedes Element angezeigt werden soll.

KB Guide Image

Kopfzeilen-Optionen werden unter Website-Stil nicht angezeigt.

Die Anpassungen einiger Elemente werden nur dann unter Website-Stile angezeigt, wenn diese Elemente auf Ihrer Website vorhanden sind.

  • Navigation – Anpassungen werden angezeigt, nachdem Sie Seiten oder Links zu Ihrer Hauptnavigation oder untergeordneten Navigation hinzugefügt haben.
  • Warenkorb und Kundenkonto – Anpassungen werden angezeigt, nachdem du eine Shop-Seite erstellt hast. Die Express-Kasse muss deaktiviert sein.
  • Slogan – Anpassungen werden angezeigt, nachdem du einen Slogan hinzugefügt hast.
  • Kopfzeile: Unten – Dieser Abschnitt wird angezeigt, nachdem du ein oder mehrere Elemente zur oberen Hälfte der Kopfzeile im Abschnitt Kopfzeile: Layout hinzugefügt hast.
  • Kopfzeile: Oben – Dieser Abschnitt wird angezeigt, nachdem du ein oder mehrere Elemente zur oberen Hälfte der Kopfzeile im Abschnitt Kopfzeile: Layout hinzugefügt hast.
  • Intro-Bereich – Anpassungen werden angezeigt, wenn du dich auf einer Seite befindest, die Intro-Bereiche unterstützt.
  • Banner – Anpassungen werden angezeigt, wenn Sie sich auf einer Seite befinden, die Banner unterstützt.

Überschriften werden bei bestimmten Breiten auf zwei Zeilen umgebrochen

In der Brine Familie werden einige Überschriften in zwei Zeilen umgebrochen, wenn der Browser etwa 1400 Pixel breit ist, und werden dann bei einer Breite von 1120 Pixeln wieder in nur einer Zeile dargestellt. Dies ist Teil des Vorlagen-Designs.

Symbole und der Seitentitel überlappen sich auf Mobilgeräten

Wenn die Elemente in deiner Navigationsleiste für Mobilgeräte überlappen, verschiebst du eines oder mehrere davon in die andere Navigationsleiste.

Wenn du z. B. das ☰ von der oberen in die untere Navigationsleiste verschieben möchten:

  1. Scrolle unter Website-Stile zum Abschnitt Mobil: Menü-Symbol.
  2. Ändern Sie die Position auf Unten (links, rechts oder mittig).

Wiederholen Sie diese Schritte für alle Elemente, die sich überlappen.

move-icons.png

Index-Abschnitte werden nicht in der Höhe des Browsers angezeigt

So stellen Sie ein, dass einige oder alle Inhaltsabschnitte in der Höhe des Browsers angezeigt werden:

  1. Scrolle unter Website-Stile zum Abschnitt Index: Seite.
  2. Verwenden Sie Minimale Höhe anwenden, um festzulegen, welche Abschnitte betroffen sind.
  3. Legen Sie die Mindesthöhe auf 100vh fest.

Wenn dein Abschnitt nicht die Höhe des Browsers füllt:

  • Experimentieren Sie mit Padding (Overlay-Seiten) und Padding, bis Sie das Aussehen erreichen, das Ihnen gefällt.
  • Wenn Ihr Abschnittsinhalt (einschließlich Freiraum) größer ist als die Höhe des Browsers, behält er seine ursprüngliche Höhe.
  • Die Anpassung Rand spiegeln kann auch die Anzeige der ersten Abschnitte betreffen.

Für Galerie-Indexabschnitte:

  • Layout: Slideshow – Aktiviere Feste Höhe verwenden, um die Höhe manuell festzulegen.
  • Die Höhe wird automatisch durch die Anzahl und Größe der Bilder in der Galerie bestimmt.

Gespiegelter Rand der Index-Seite hat nicht die richtige Farbe

Die Farbe des gespiegelten Randes von Brine ist identisch mit der Seitenfarbe. Um diese festzulegen, verwendest du Farbe im Abschnitt Haupt von Website-Stile.

Bilder werden nicht in der Seitenbreite angezeigt

Bild-Blöcke folgen nicht der Inhaltseinrückung. Stattdessen werden sie in der Breite der Website angezeigt. Passe die Website-Breite mit Breite im Abschnitt „Website“ unter Website-Stile an.

Du kannst auch Strecken im Bild-Block-Editor aktivieren, um sicherzustellen, dass das Bild in der gesamten Breite des Blocks angezeigt wird.

Tipp

Erstelle randlose Bilder auf den Index-Seiten von Brine, indem du entweder einen „Layout-Seite“-Abschnitt mit einem Hintergrundbild oder einen „Slideshow-Galerie-Seite“-Abschnitt hinzufügst.

KB Guide Image

Die Infoleiste für Mobilgeräte wird überlappt

Wenn dein Website-Header deine Infoleiste für Mobilgeräte überlappt, haben die Besucher deiner Website möglicherweise Probleme beim Erkunden der Inhalte.Dies kommt vor, wenn sowohl die Stil-Anpassung für die Fixierung der oberen Leiste am Seitenanfang auf Mobilgeräten als auch die Infoleiste für Mobilgeräte aktiviert sind.Das kannst du folgendermaßen beheben:

  1. Scrolle unter Website-Stile zum Abschnitt Mobil: oben.
  2. Stelle sicher, dass die Einstellung Seitenanfang auf Mobilgeräten deaktiviert ist.

Wenn die obere Leiste weiterhin am Seitenanfang fixiert sein soll, kannst stattdessen die Infoleiste für Mobilgeräte entfernen.

Mobile Website scrollt horizontal

Horizontales Scrollen kann auftreten, wenn Sie die Seite vergrößert haben. Versuchen Sie, Ihren mobilen Browser zu aktualisieren, um den Zoom zurückzusetzen.

Wenn dies das Problem nicht behebt, verfügt Ihre Website eventuell über einen seitlichen Freiraum von weniger als 17 Pixeln, was dazu führen kann, dass Ihre mobile Website breiter als das Browserfenster angezeigt wird. So beheben Sie dies:

  1. Scrolle unter Website-Stile zum Abschnitt Website.
  2. Stellen Sie sicher, dass der Seitliche Freiraum 17 Pixel oder mehr beträgt.

Stile für Mobilgeräte werden nicht angezeigt.

Wenn deine Stil-Einstellungen für Mobilgeräte nicht auf Mobilgeräten und in der Geräteansicht erscheinen, kann es sein, dass deine Website nur in sehr schmalen Browsern zur mobilen Ansicht wechselt. So setzt du die Breite zurück, bei der sie wechselt:

  1. Scrolle unter Website-Stile zum Abschnitt Mobil.
  2. Stellen Sie sicher, dass Ihr Mobil-Breakpoint auf 640 Pixel oder höher eingestellt ist.
  3. Klicken Sie auf Speichern.

Navigationsleiste hat eine unerwartete Farbe

Wenn du die Deckkraft der unteren Navigationsleiste anpasst, hängt deren Farbe beim Scrollen nach unten von deinen Einstellungen ab. Wenn es einen Seitenrand gibt, wird er über dieser Farbe angezeigt. Ansonsten:

  • Wenn es ein Seiten-Banner gibt, wird es über der Hintergrundfarbe der Website angezeigt
  • Wenn es kein Banner gibt, wird es über der Hintergrundfarbe des Footers angezeigt
mobile-banner-examples.png

Parallax-Bilder sind zu stark beschnitten

Aktiviere im Abschnitt Haupt: Overlay die Option Parallax: Intelligentes Abschneiden. Wenn diese Option aktiviert ist, werden die Banner-Bilder im Mindestmaß beschnitten, das für die Parallax-Anzeige erforderlich ist.

Seitentitel sieht auf Mobilgeräten anders aus

Du kannst die Anzeige deines Website-Titels je nach Gerät ändern. Lege einen unterschiedlichen Schriftstil für Computer und Mobilgeräte fest, indem du die individuell anpassbaren Stile für Mobilgeräte deines Templates verwendest.

Um deine Markenführung auf allen Geräten einheitlich zu halten, wähle den gleichen Schriftstil in den Abschnitten mobile Markenführung und Header-Markenführung unter Website-Stile.

Social-Media-Symbole im oberen Header haben die falsche Farbe auf Index-Seiten

Wenn der erste Abschnitt in deinem Index eine Galerie ist und du Overlay-Header auf der ersten Index-Galerie aktiviert hast, entsprechen die Social-Media-Symbole in deinem Header automatisch der Anpassung Farbe (Overlay) in Social-Media-Symbole. Diese Anpassung wird jedoch nur angezeigt, wenn du die Position der Social-Media-Symbole in Header: Layout auf eine der Optionen für den unteren Header festlegst. Dadurch können Social-Media-Symbole, die im oberen Header positioniert sind, eine unerwartete Farbe haben, die du nicht ändern kannst.

Um diese Farbanpassung zu ändern, lege die Position der Social-Media-Symbole in Header: Layout vorübergehend auf eine der Optionen für den unteren Header fest. Nachdem du die Farbe geändert hast, verschiebe die Social-Media-Symbole zurück in deinen obersten Header.

Text ist schmal und zentriert

Wenn sich bestimmte Blöcke in einer einzigen Spalte befinden, werden sie automatisch zur Seitenmitte eingerückt und Leerräume auf beiden Seiten hinzugefügt. Dies wird als Inhaltseinrückung bezeichnet.

Um die Inhaltseinrückung zu entfernen, setzt du Inhaltseinrückung auf 0 im Hauptabschnitt von Website-Stile.

KB Guide Image
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.