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

Pacific-Template-Gruppe

Die Template-Gruppe „Pacific“ (Bryler, Charlotte, Horizon, Naomi, Pacific) verwendet Text-Overlays und eine scrollende randlose Index-Seite, um alle deine Inhalte einheitlich zu präsentieren.

Diese Anleitung behandelt die Funktionen und Gestaltungsmöglichkeiten der Pacific-Gruppe. Anpassungen unter Website-Stil werden fettgedruckt angezeigt und verlinken auf die Liste aller Pacific-Anpassungen, um dir die Orientierung in dem Menü zu erleichtern.

Unterstützte Seiten

Pacific unterstützt die folgenden Seiten-Typen:

Kopfzeile

Besucher können anhand der Kopfzeile am Seitenanfang durch deine Website navigieren. In Pacific enthält die Kopfzeile Seitentitel oder Logo (Markenführung) und Navigationslinks.

  • Die Markenführung ist zentriert.
  • Index-Startseiten können über eine feste Navigation verfügen.

Unter Website-Kopfzeile du kannst die Schriftarten und Farben der Kopfzeile wunschgemäß anpassen.

  • Lege die Farbe des Headers mit der Hintergrundfarbe fest.
  • Mit Transparent auf Banner-Bildern kannst du Banner hinter der Kopfzeile anzeigen.
  • Die Größe des Seitentitels kannst du mit dem Schieberegler Schriftgröße unter der Anpassung Seitentitel: Schriftart ändern. Beschränke dich auf maximal 72 Pixel, um Verzerrungen zu vermeiden.
  • Ändere die Logo-Größe mit Logo-Breite.

Gestalte die Navigationslinks unter Website-Navigation. Anhand von Immer Overlay-Navigation verwenden kannst du auswählen, ob die Navigation auf der Seite oder hinter einem ☰-Symbol angezeigt werden soll.

  • Wenn diese Option nicht aktiviert ist, werden die Navigationslinks entweder unter der Markenführung oder auf beide Seiten aufgeteilt angezeigt. Dies hängt von der Anzahl an Seiten und der Anzeigebreite des Browsers ab.
  • Du kannst die Link-Farbe ändern und die Overlay-Hintergrundfarbe festlegen – mit Hintergrundfarbe.
  • Im ☰-Overlay ändern Links automatisch ihre Größe, um sich optimal an das Menü anzupassen. Die Anpassung Link-Schriftart: Schriftgröße wirkt sich nicht auf sie aus.

pacific-header.png

Banner

Banner sorgen für ein visuelles Element, das den Ton für deine Seite vorgeben kann. Füge Seitenvorschaubilder und -videos hinzu, um Banner zu erstellen.

  • Banner werden auf Album-, Blog-, Events-, Galerie (nur Bilder-), Produkt- und Layout-Seiten angezeigt.
  • In einem Index kannst du mehrere Banner vertikal anordnen.
  • Seitentitel und -beschreibungen sowie die Website-Kopfzeile können das Banner überlagern.
  • Füge mit Overlay-Farbe in Seiten-Banner einen Farbfilter hinzu. Index-Abschnitte haben separate Overlay-Farben.

pacific-banner.png

Banner-Text

Seitentitel und -beschreibungen können über Bannern angezeigt werden.

  • Gestalte die Schriftarten unter Seiten-Banner. Blende alle Titel mit Seitentitel anzeigen aus.
  • Um Seitenbeschreibungen zu entfernen, lösche diese aus den Seiteneinstellungen. Um sie zu entfernen, ohne die Höhe des Banners zu beeinflussen, ersetze den Text durch Zeilenumbrüche.
  • Wenn du einen anderen Text für Suchergebnisse verwenden möchtest, füge SEO-Titel und -Beschreibungen hinzu.

Banner-Höhe

Um die Höhe zu ändern, kannst du:

  • Ändere das Padding im Seiten-Banner.
  • Die Höhe der Seitenbeschreibung vergrößern, indem du Zeilenumbrüche hinzufügst.

Weitere Hilfe mit Bannern

Denken Sie daran:

  • Video-Banner werden je nach Verbindungsgeschwindigkeit 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 eine Galerie-Seite kein Vorschaubild hat, wird das erste Bild automatisch zum Banner, wenn du eine Änderung in der Galerie vornimmst. Wenn du kein Banner auf deiner Galerie-Seite haben möchtest, öffne die Seiteneinstellungen, um das Vorschaubild zu entfernen.

Hintergrund

Lege die Hintergrundfarbe der Website mit Hintergrundfarbe unter Hauptinhalt fest.

Fußzeilen

Passe den Footer für die gesamte Website von Pacific mit Blöcken an. Der Footer kann Navigationslinks, Kontaktinformationen und einen zweiten Inhaltsbereich, die so genannte Vor-Fußzeile, enthalten.

Gestalte den Footer, die Kontaktinformationen und die Fußzeilen-Navigationslinks im Abschnitt Footer.

  • Die Kontaktinformationen kannst du mit den Website-Info-Anpassungen anzeigen und gestalten. Ändere die Informationen mit den Feldern Physischer Standort, Kontakt-E-Mail-Adresse und Kontakt-Telefonnummer unter Geschäftsinformationen.
Tipp: Wenn die Anpassung Website-Informationen nicht angezeigt wird, kannst du ein anderes Template auf deiner Website anzeigen und dann die Vorschau abbrechen.

Die Vor-Fußzeile wird über dem Footer angezeigt.

  • Gestalte den Hintergrund und die Textfarben im Abschnitt Vor-Fußzeile.
  • Wähle zum Anzeigen der Vor-Fußzeile Inhalt: Benutzerdefiniert aus. Wenn du sie ausblenden möchtest, wähle Inhalt: Leer aus.

Denken Sie daran:

  • Die Demo-Inhalte einiger Templates enthalten einen Social-Link-Block. Lösche den Block, um die Social-Media-Symbole zu entfernen.
  • Text-Links im Footer und Pre-Footer sind unterstrichen.

pacific-footers.png

Blogseiten

Pacific-Blog-Seiten werden als Liste vertikal angeordneter Beiträge angezeigt.

Auf der Landing-Page:

  • Füge Kategorie-Navigation hinzu, um Kategorie-Filter oben auf der Seite anzuzeigen.
  • Beitrags-Vorschaubilder werden unterhalb des Titels für Beiträge mit Auszügen angezeigt.
  • Auszüge zeigen „Mehr lesen“-Links.
  • Der vollständige Inhalt der einzelnen Beiträge wird unter dem Titel für Beiträge ohne Auszüge angezeigt.

Auf einzelnen Beiträgen:

  • Die Navigation zu vorherigen und nächsten Beiträgen wird in den einzelnen Beiträgen unterhalb der Kommentare angezeigt.
  • Einspaltige Text-Blöcke werden auf einer Seite eingerückt. Durch solche Layout-Variationen werden deine Beiträge optisch interessanter. Es gibt keine Optionen, um die Breite der Einrückung zu ändern.

Gestalte die Metadaten im Blog-Abschnitt:

  • Datum, Kategorien und Verfassernamen werden über dem Beitrag angezeigt. Mit der Option Meta-Priorität kannst du eine dieser Angaben über den Beitragstitel verschieben.
  • Wähle Eintrag ausblenden: Autor aus, um die Verfassernamen auszublenden. Diese Anpassung ist nicht verfügbar, wenn Meta-Priorität: Verfasser ausgewählt ist.
  • Unter dem Beitrag werden Quell-URLs, Tags und Kommentare sowie „Gefällt mir“- und Sharing-Buttons angezeigt. Aktiviere Footer des Listeneintrags verbergen, um sie auszublenden.

Unter Hauptinhalt kannst du den Text gestalten:

  • Gestalte die Metadaten mit den Meta-Anpassungen.
  • Beitragstitel folgen den Überschrift 1-Anpassungen.
  • Der Textkörper folgt den Anpassungen Text-Schriftart und Textfarbe.

pacific-blog.png

Index-Seiten

Die Index-Seite von Pacific wandelt den Inhalt mehrerer Seiten in gestapelte Abschnitte um, sodass du verschiedene Bilder und Informationen am gleichen Ort hervorheben kannst.

  • Inhaltsabschnitte werden mit Layout-Seiten erstellt. Sie sind eine gute Option zum Hinzufügen von Text, Buttons und sonstigen Blöcken.
  • Galerie-Indexabschnitte werden auf der Grundlage von Galerie-Seiten erstellt und können in einem Raster oder einer Slideshow angezeigt werden.
  • Album-Abschnitte werden auf der Grundlage von Albumseiten erstellt.
  • Seiten-Vorschaubilder werden als Hintergrund für Inhalts- und Album-Abschnitte angezeigt.

pacific-index.gif

Galerie-Index-Abschnitte

Galerie-Index-Abschnitte kannst du im Abschnitt Index-Galerie von „Website-Stil“ nach Wunsch gestalten. Über die Anpassung Design kannst du das Layout aller Galerie-Index-Abschnitte festlegen.

Für Slideshow-Layouts:

  • Wähle aus, ob Galerien über die Funktion Autoplay verfügen sollen, und setze den Slideshow-Übergang auf Verblassen oder Scrollen.
  • Mit der Galerie-Steuerung kannst du Navigationselemente hinzufügen oder ausblenden.
  • Ein Augen-Symbol, mit dem Besucher Beschriftungen aktivieren oder deaktivieren können, kannst du mit Galerie: Overlay-Schalter hinzufügen.
  • Bildtitel und -beschreibungen werden über dem Bild zentriert.

Für Raster-Layouts:

  • Mit Raster: max. Spalten kannst du auswählen, wie viele Bilder horizontal angezeigt werden.
  • Bildtitel werden bei Mouseover angezeigt. Bildbeschreibungen werden nicht angezeigt.

Zur Galerie hinzugefügte Videos:

Abschnittshintergründe

Für Inhalts- und Album-Abschnitte:

  • Seiten-Vorschaubilder werden als Hintergrund angezeigt.
  • Bei Abschnitten ohne Vorschaubilder wird die Hintergrundfarbe der Website angezeigt.
  • Mit Abschnittstrennzeichen unter Index kannst du auswählen, was passieren soll, wenn zwei aufeinanderfolgende Abschnitte ohne Hintergrundbilder vorhanden sind. Du kannst entweder abwechselnde Hintergrundfarben oder einen Rahmen zur Unterteilung der Abschnitte festlegen.

Für Galerie-Indexabschnitte:

  • Slideshow-Layout – Bilder werden randlos angezeigt.
  • Raster-Layout – Die Galerie-Overlay-Farbe unter Index-Galerie wird vollständig deckend in sämtlichen leeren Flächen im Raster angezeigt.

Farb-Overlays

Du kannst Bilder und Videos mit einem Farbfilter versehen. Dies trägt dazu bei, dass überlagernde Inhalte hervorstechen.

  • Inhalts- und Album-Abschnitte – Verwende Farbe unter Index-Overlay.
  • Galerie-Index-Abschnitte – Verwende Galerie-Overlay-Farbe unter Index-Galerie. Die Farbe wird nur auf Bildern mit Titeln oder Beschreibungen angezeigt. Bei Raster-Layouts wird die Farbe bei Mouseover angezeigt.

Abschnittshöhe

Um die Höhe von Inhalts- und Album-Abschnitten zu ändern, passe das Padding an:

  • Abschnitte mit Banner-Bildern – Verwende Seiten-Padding unter Index-Overlay.
  • Abschnitte ohne Banner-Bilder – Verwende Seiten-Padding unter Index.
  • Bei Inhaltsabschnitten kannst du die Höhe vergrößern, indem du zusätzliche Zeilenumbrüche in den Seiteninhalt einfügst.

Unter Indexgalerie kannst du die Höhe für Galerie-Indexabschnitte ändern:

  • Slideshow-Layout – Hier kannst du das Slideshow-Seitenverhältnis ändern.
  • Raster-Layout – Ändere das Raster-Seitenverhältnis and Raster: Max. Spalten.

Auf Index-Seiten als Startseite festlegen:

  • Die Header-Navigation kann fixiert werden, sodass sie oben im Browserfenster angezeigt wird, wenn du auf der Index-Seite über den ersten Abschnitt hinaus nach unten scrollst (feste Navigation).
  • Du kannst Links für Inhalts- und Album-Abschnitte zur Navigation hinzufügen. Wenn du auf den Link klickst, scrollt die Seite zu diesem Abschnitt.

Wähle zum Fixieren der Navigation Index-Scrolling-Nav: beim Scrollen anzeigen unter Website-Navigation aus. Lege die Hintergrundfarbe für die Navigation mit Hintergrundfarbe unter Website-Header fest.

Denken Sie daran:

  • Die Markenführung der Website wird nicht angezeigt.
  • Du musst mehr als einen Abschnitt in deinem Index haben, damit die feste Navigation erscheint.

charlotte-fixed-nav.png

Aktiviere zum Erstellen von Navigationslinks für Inhalts- und Album-Abschnitte die Option Startseiten-Index-Links erweitern unter Website-Navigation.

  • Galerie-Index-Abschnitte werden in der Navigation nicht angezeigt. Verwende stattdessen Index-Anker-Links, um Links für sie zu erstellen.

index-nav-links.jpg

Weitere Hilfe zu Index-Seiten

  • Bearbeitungs-Anmerkungen werden in leeren Abschnitten eventuell nicht angezeigt. Wenn du eine leere Seite bearbeiten möchtest, verschiebe sie aus dem Index heraus, füge Inhalte hinzu und verschiebe sie dann wieder zurück.
  • Anhand der Index-Overlay-Anpassungen kannst du die Farbe von Button-, Formular- und Zitat-Blöcken über Bildern ändern.
  • Sharing-Buttons werden in Album-Abschnitten immer angezeigt.

Kategorie-Navigation

Besucher können über Kategorie-Navigationslinks Seiten nach Beitrags- oder Produktkategorien filtern.

Oben auf Blog- und Shop-Seiten im Abschnitt Kategorie-Navigation kannst du Kategorie-Navigationen hinzufügen und gestalten. Stiländerungen betreffen alle Kategorie-Navigationen auf deiner Website.

pacific-category-nav.png

Warenkorb

Wenn ein Kunde ein Produkt in seinen Warenkorb gelegt hat, wird ein Warenkorb-Button oben rechts auf allen Seiten angezeigt. So gestaltest du den Button:

  1. Füge mindestens ein Produkt zu deinem Warenkorb hinzu, sodass der Warenkorb-Button angezeigt wird.
  2. Du kannst Warenkorb-Button: Hintergrundfarbe und Warenkorb-Button: Schriftfarbe unter Website-Kopfzeile ändern.

pacific-shopping-cart.png

Mobilgerät

Mit dem integrierten Responsiven Design von Squarespace passt sich Ihre Website an, damit sie auf jedem Gerät hervorragend aussieht.

  • Die Navigation wird zu einem ☰ oben links eingeklappt und kann beim Scrollen auf Index-Seiten als Startseite an der gleichen Stelle fixiert bleiben.
  • Der Seitentitel oder das Logo wird oben in der Mitte mit einer maximalen Höhe von 50 Pixeln angezeigt.
  • Der Warenkorb-Button wird unten rechts angezeigt.
  • Du kannst Stil für Mobilgeräte deaktivieren, wir raten jedoch davon ab.
  • Raster-Galerien zeigen zwei Bilder pro Zeile an. Wenn du eine ungerade Anzahl von Bildern hast, wird neben dem letzten Bild ein Leerraum gelassen.

Überschriften werden über die folgenden Maximalgrößen hinaus auf Mobilgeräten nicht angezeigt:

  • Überschrift 1 – 34 Pixel
  • Überschrift 2 – 26 pixels
  • Überschrift 3 – 20 Pixel

Auf Smartphones:

  • Ein Zurück zum Seitenanfang-Link erscheint unten über dem Footer.
  • Galerien auf Index-Seiten zeigen keine Bildbeschreibungen an.

pacific-mobile.png

Sprachoptionen

Innerhalb dieser Familie unterstützen die Templates Charlotte, Naomi und Pacific zwei Sprachoptionen:

War dieser Beitrag hilfreich?
20 von 41 fanden dies hilfreich
Pacific-Template-Gruppe