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

Styling image captions

Captions are text titles and descriptions that add information and context to your images. Captions don’t have their own style tweaks. Instead, they follow the tweaks for other text on your site.

How you style an image’s caption depends on where it is and how it’s set to display. Captions generally display in one of three ways:

  • Caption below - The text displays on the page, below the image. 
  • Caption overlay - The text displays over the image, either at all times or only on hover.
  • Lightbox caption overlay - With lightbox enabled, the image appears in a popup when clicked. A caption displays over the image either at all times or only on hover.

This guide covers the style rules for all images on your site that display captions. 

Video ansehen

Bevor Sie anfangen

  • Image captions don't support line breaks in titles. 
  • Fonts and colors have separate tweaks.
  • Es wird empfohlen, die Untertitel kurz zu halten, insbesondere wenn die Beschriftung ein Bild überlagert. Längere Untertitel können in bestimmten Geräten und Browsern abgeschnitten werden.

In version 7.0

  • Jedes Template hat seine eigenen Anpassungsnamen, aber wir verwenden den Begriff „Textkörper“, um auf jeden Text zu verweisen, der keine Überschrift oder Metatext ist. In Adirondack heißt beispielsweise die Anpassung, die die Textschriftart des Textkörpers steuert, Text. In Skye heißt sie Textkörper. Weitere Informationen finden Sie unter Formatieren und Gestalten von Text.
  • Some templates only have one tweak that controls all header colors or all header fonts. In those cases, captions that follow specific header styles (like Heading 3) will follow the general header tweak.

If you’re having difficulty styling captions on a 7.0 site, we recommend experimenting on a test page:

  1. Create a Layout Page in the Not Linked section of your navigation.
  2. Add a Text Block that contains Heading 1, Heading 2, Heading 3, and body text (You’ll need at least four lines of text).
  3. Use Site Styles to give each of these a distinct font and color.
  4. Look at your caption to see how it’s changed.

Galerie-Abschnitt

Version 7.0 doesn't support gallery sections. Use a Gallery Page instead.

Bilder in Galerieabschnitten unterstützen Beschreibungen, die angezeigt werden, wenn Beschriftungen im Abschnittseditor aktiviert sind.

In all layouts: 

  • Schriftart: Folgt Schriftarten
  • Farbe: Folgt Abschnitt: Mittelgroß unter Farben
  • Größe: Nicht anpassbar

Denken Sie daran:

  • In the Slideshow: Reel layout, captions only appear under the center image. 
  • Captions don't appear in lightbox view. 

Bild-Block

Most Image Block layouts support a title and subtitle with their own style settings.

How you style captions depends on which version of Squarespace your site is on.

For the Inline layout, captions can display below the image, as an overlay, or as a lightbox overlay. See the below for style rules for each.

Bildunterschrift unten

For captions that display below the Inline Image Block:

  • Schriftart: Folgt Schriftarten
  • Color: Follows Colors
  • Size: Set in the text editor

Bildunterschrift-Overlay

For captions that display over the Inline Image Block at all times or on hover:

  • Schriftart: Folgt Schriftarten
  • Color: Always white
  • Size: Set in the text editor

Lightbox overlay

For captions that display over the Inline Image Block while in a lightbox pop-up:

  • Font: Follows Fonts
  • Color: Always white
  • Size: Follows Paragraphs: Paragraph 3 under Fonts

Beim Inline-Layout können Beschriftungen unter dem Bild, als Overlay oder als Lightbox-Overlay angezeigt werden. Die jeweiligen Stilregeln findest du unten.

Bildunterschrift unten

In most templates, for captions that display below the Inline Image Block:

  • Schriftart: Folgt dem Textkörper
  • Color: Follows body text
  • Größe: Nicht anpassbar

There are exceptions in these template families:

Bedford

Size: Follows body text

Five

Font: Always black and uppercase

Pacific

Size: Follows body text

Skye

Font, color, and size: Follows the Image & Gallery Block Captions tweak

York

Size: Follows body text

Bildunterschrift-Overlay

In most templates, for captions that display over the Inline Image Block when it's displaying on the page:

  • Schriftart: Folgt dem Textkörper
  • Color: Always gray
  • Größe: Nicht anpassbar

There are exceptions in these template families:

Five

Font: Always uppercase

Skye

Font: Follows the Image & Gallery Block Captions tweak

Lightbox overlay

In most templates, for captions that display over the Inline Image Block while in a lightbox pop-up:

  • Schriftart: Folgt dem Textkörper
  • Color: Always white
  • Größe: Nicht anpassbar

There are exceptions in these template families:

Adirondack

Font: Not adjustable

Bedford

Font: Not adjustable

Five Size: Follows body text

Flatiron

Color: Follows body text

Pacific

Font: Not adjustable

Skye

Font: Follows the Excerpt tweak
Size: Follows the Excerpt tweak

Tremont

Font: Not adjustable
Color:
Follows body text

Wexley

Size: Follows body text

Summary Block

The Summary Block supports captions for all its designs (Wall, List, Carousel, Grid).

How you style the Summary Block caption depends on which version of Squarespace your site is on.

In all Summary Block designs:

  • Title size: Follows Paragraphs: Paragraph 2 under Fonts
  • Description size and Meta size: Not adjustable
  • All fonts: Follow Fonts
  • All colors: Follow Colors

In allen Templates:

  • Title size, Description size, and Meta size: Not adjustable
  • Beschreibungs-Schriftart: Folgt dem Textkörper
  • Description color: Follows body text
  • Title color: Varies by template, see the list below

In den meisten Templates:

  • Meta 1 and 2 font: Follows body text
  • Farbe Meta 1 und 2: Folgt dem Textkörper
  • Titel-Schriftart: Folgt dem Textkörper

Dabei gibt es Ausnahmen, und zwar in folgenden Template-Gruppen:

Adirondack

Title font: Follows the Summary Block Title Font tweak
Title color: Follows the Summary Block Title Color tweak

Avenue

Title font: Follows the Summary Block Title Font tweak
Title color: Follows the Summary Block Title Color tweak

Aviator

Title font: Follows the Summary Block Title Font tweak
Title color: Follows the Summary Block Title Color tweak

Bedford

Title font: Follows the Summary Block Title Font tweak
Title color: Follows the Summary Block Title Color tweak
Meta 1 and 2 color: Follows the Page Meta Color tweak

Brine

Title color: Follows body text

Farro

Title color: Follows body text

Five

Title color: Follows the Body Link tweak

Gallery and Blog:

  • Farbe Meta 1: Folgt dem Textkörper
  • Meta 2 color: Follows the Body Link tweak

Events:

  • Farbe Meta 1 und 2: Folgt dem Textkörper

Products:

  • Meta 1 and 2 color: Follows the Body Link tweak

Flatiron

Title color: Follows the Link Color tweak

Forte

Title color: Follows the Body Link Color tweak
The Underline Body Links tweak affects Meta 2

Galapagos

Title color: Follows the Link Color tweak

Ishimoto

Title color: Follows the Body Link Color tweak

Marquee (eingestellt)

Title font: Follows the Summary Block Title Font tweak
Title color: Follows the Summary Block Title Color tweak

Momentum

Title font: Follows the Summary Block Title Font tweak
Title color: Follows the Summary Block Title Color tweak

Montauk

Title font: Follows the Summary Block Title Font tweak
Title color: Follows the Summary Block Title Color tweak

Native

Title font: Follows Heading 1
Title color: Follows Heading 1

Pacific

Title font: Follows the Summary Block Title Font tweak
Title color: Follows the Summary Block Title Color tweak
Meta 1 and 2 font: Follows the Meta Font tweak
Meta 1 and 2 color: Follows the Meta Color tweak

Skye

Title font: Follows the List Title tweak
Title color: Follows the Title Color tweak
Meta 1 and 2 font: Follows the Meta tweak
Meta 1 and 2 color: Follows the Meta Color tweak

Supply

Title color: Follows the Link Color tweak

Tremont

Title color: Follows the Body Link Color tweak

Gallery and Blog:

  • Meta 1 and 2 font: Follows the Meta Font tweak
  • Meta 1 color: Follows the Meta Color tweak
  • Farbe Meta 2: Folgt der Anpassung Textkörper: Link-Farbe

Events:

  • Meta 1 and 2 font: Follows the Meta Font tweak
  • Meta 1 and 2 color: Follows the Meta Color tweak

Produkte

  • Meta 1 and 2 font: Follows the Meta Font tweak
  • Farbe Meta 1 und 2: Folgt der Anpassung Textkörper: Link-Farbe

Wells

Title color: Follows the Body Link Color tweak

Wexley

Title color: Follows the Body Link Color tweak

York

Title color: Follows the Body Link Color tweak

Gallery and Blog:

  • Farbe Meta 1: Folgt dem Textkörper
  • Farbe Meta 2: Folgt der Anpassung Textkörper: Link-Farbe

Event:

  • Farbe Meta 1 und 2: Folgt dem Textkörper

Products:

  • Farbe Meta 1 und 2: Folgt der Anpassung Textkörper: Link-Farbe

Instagram-Block

The Instagram Block supports captions for the Slideshow and Stacked designs, and in the Grid design when viewed in a lightbox.

How you adjust the caption text depends on which version of Squarespace your site is on.

Stapel

Stacked captions below each image:

  • Caption font: Follows Fonts
  • Caption color: Follows Paragraph: Medium under Colors
  • Caption size: Follows Paragraphs: Paragraph 2 under Fonts

Slideshow 

Slideshow captions display as an overlay, either at all times or on hover:

  • Caption font: Follows Fonts
  • Caption color: Always white
  • Caption size: Not adjustable

Grid (Raster)

Grid captions display in the lightbox overlay:

  • Caption font: Follows Fonts
  • Caption color: Always white
  • Beschriftungs-Größe: Nicht anpassbar

Stapel

Gestapelte Bildunterschriften unter jedem Bild. In allen Templates:

  • Caption font: Follows body text
  • Caption color: Follows body text
  • Caption size: Follows body text

Slideshow 

Slideshow-Beschriftungen werden als Overlay angezeigt, entweder dauerhaft oder bei Mouseover. In allen Templates:

  • Caption font: Follows body text
  • Caption color: Always white
  • Beschriftungs-Größe: Nicht anpassbar

Grid (Raster)

Rasterbeschriftungen werden im Lightbox-Overlay angezeigt. In den meisten Templates:

  • Caption font: Follows body text
  • Caption color: Always white
  • Caption size: Follows body text

Ausnahmen

The caption font and caption size aren't adjustable in these template families:

  • Adirondack
  • Bedford
  • Pacific

Raster-Galerie-Block

How you adjust Grid Gallery Block caption text depends on which version of Squarespace your site is on.

In Version 7.1 kannst du Galerie-Blöcke nur zu Blogeinträgen, Produktartikeln und einzelnen Veranstaltungen hinzufügen.

Grid Gallery Block titles can display below the image. Titles and descriptions display in the lightbox overlay.

Title below

For titles that display below Grid Gallery Block images:

  • Schriftart: Folgt Schriftarten
  • Farbe: Folgt Abschnitt: Mittelgroß unter Farben
  • Größe: Nicht anpassbar

Lightbox overlay

For captions that display over Grid Gallery Block images while in a lightbox popup:

  • Titel-Schriftart: Folgt Schriftarten
  • Title color: Always white
  • Titel-Größe: Nicht anpassbar
  • Beschreibungs-Schriftart: Folgt Schriftarten
  • Description color: Always white
  • Beschreibungs-Größe: Nicht anpassbar

Grid Gallery Block titles can display below the image. Titles and descriptions display in the lightbox overlay.

Title below

In all templates, for titles that display below Grid Gallery Block images:

  • Schriftart: Folgt dem Textkörper
  • Color: Follows body text
  • Größe: Nicht anpassbar

Lightbox overlay

In most templates, for captions that display over Grid Gallery Block images while in a lightbox popup:

  • Titel-Schriftart: Folgt Überschrift 1
  • Title color: Always white
  • Title size: Follows body text
  • Beschreibungs-Schriftart: Folgt dem Textkörper
  • Beschreibungsfarbe: Immer weiß
  • Description size: Follows body text

There are exceptions in these template families:

Adirondack

Title size: Not adjustable
Description font: Not adjustable
Description size: Not adjustable

Bedford

Title size: Not adjustable
Description font: Not adjustable
Description size: Not adjustable

Five

Titel-Größe: Folgt Überschrift 1

Flatiron

Description color: Follows body text

Galapagos

Title color: Follows Heading 1
Title size:
Follows Heading 1

Note: Enable Custom Headings in Site Styles

Pacific

Title color: Follows Heading 1
Title size: Follows Heading 1
Description font: Not adjustable

Skye

Title font: Follows the List Title tweak
Title color: Follows the Title Color tweak under Site-wide text colors
Title size: Not adjustable
Description font: Follows the Excerpt tweak
Description size: Follows the Excerpt tweak

Note: List Title and Title Color tweaks are only available when viewing a Blog Page

Tremont

Description font: Not adjustable
Description color: Follows body text
Description size: 
Not adjustable

York

Title color: Follows Heading 1
Title size:
Follows Heading 1

Tip: In some templates, the Title Color tweak also affects blog post titles. To ensure visibility, your Title Color should be different than your site's background color.

Slideshow-Galerie-Block

How you adjust Slideshow Gallery Block caption text depends on which version of Squarespace your site is on.

In Version 7.1 kannst du Galerie-Blöcke nur zu Blogeinträgen, Produktartikeln und einzelnen Veranstaltungen hinzufügen.

Slideshow Gallery Block captions can only display as an overlay. For captions that display over the Slideshow Gallery Block:

  • Titel-Schriftart: Folgt Schriftarten
  • Title color: Always white
  • Titel-Größe: Nicht anpassbar
  • Beschreibungs-Schriftart: Folgt Schriftarten
  • Description color: Always white
  • Beschreibungs-Größe: Nicht anpassbar

Slideshow Gallery Block captions can only display as an overlay. In most templates, for captions that display over the Slideshow Gallery Block:

  • Titel-Schriftart: Folgt dem Textkörper
  • Title color: Always white
  • Titel-Größe: Nicht anpassbar
  • Beschreibungs-Schriftart: Folgt dem Textkörper
  • Description color: Always white
  • Beschreibungs-Größe: Nicht anpassbar

In the Skye family:

  • Titel-Schriftart: Folgt dem Textkörper
  • Beschreibungs-Schriftart: Folgt der Anpassung Bild- und Galerie-Block-Beschriftungen

Stapel-Galerie-Block

Wie du Seitenbannertext anpasst, hängt davon ab, auf welcher Version von Squarespace deine Website basiert.

In Version 7.1 kannst du Galerie-Blöcke nur zu Blogeinträgen, Produktartikeln und einzelnen Veranstaltungen hinzufügen.

Stack Gallery Block captions can only display below the image:

  • Title font: Follows Fonts
  • Title color: Follows Heading: Medium in Colors
  • Title size: Follows Heading 3 in Fonts
  • Beschreibungs-Schriftart: Folgt Schriftarten
  • Description color: Follows Paragraph (Medium) in Colors
  • Description size: Follows Paragraph 2 in Fonts

Beschriftungen im Rahmen von Stapel-Galerie-Blöcken können ausschließlich unter dem Bild angezeigt werden. In den meisten Templates:

  • Title font: Follows Heading 3
  • Title color: Follows Heading 3
  • Titel-Größe: Folgt Überschrift 3
  • Beschreibungs-Schriftart: Folgt dem Textkörper
  • Description color: Follows body text
  • Beschreibungs-Größe: Folgt dem Textkörper
Tip: Enable Custom Headings in Site Styles to style Galapagos headers.

In the Skye family:

  • Title color: Follows the Body Gallery Block Title tweak
  • Beschreibungs-Schriftart: Folgt der Anpassung Bild- und Galerie-Block-Beschriftungen
  • Description color: Follows the Image & Gallery Block Captions tweak
  • Description size: Follows the Image & Gallery Block Captions tweak

Karussell-Galerie-Block

In Version 7.1 kannst du Galerie-Blöcke nur zu Blogeinträgen, Produktartikeln und einzelnen Veranstaltungen hinzufügen.

Carousel Gallery Blocks don’t display captions.

Galerie-Seite

Version 7.1 doesn't support Gallery Pages. Use a gallery section instead.

Every template has a built-in Gallery Page. Many templates use a standard Gallery Page, which can display either as a slideshow or grid. Others have unique Gallery Pages.

Unique Gallery Pages

These template families have unique (template-specific) Gallery Pages. Use the links below to learn about each template’s Gallery Page. If your template isn’t listed here, it has a standard Gallery Page.

In most templates with standard Gallery Pages:

Grid format:

  • Titel-Schriftart: Folgt Überschrift 1
  • Title color: Always white
  • Titel-Größe: Folgt dem Textkörper
  • Beschreibungs-Schriftart: Folgt dem Textkörper
  • Beschreibungsfarbe: Immer weiß
  • Beschreibungs-Größe: Folgt dem Textkörper

Slideshow format:

  • Titel-Schriftart: Folgt dem Textkörper
  • Title color: Always white
  • Titel-Größe: Nicht anpassbar
  • Beschreibungs-Schriftart: Folgt dem Textkörper
  • Description color: Always gray
  • Description size: Not adjustable
  • Note: The body text tweak adjusts the space between the title and description

There are exceptions in these template families:

Template-Gruppe

Grid format

Slideshow format

Adirondack

Title font: Not adjustable
Title size: Not adjustable
Description font: Not adjustable
Description size: Not adjustable

Titel-Schriftart: Folgt Überschrift 1

Note: Always displays at the top and centered

Bedford

Titel-Größe: Nicht anpassbar
Beschreibungs-Schriftart: Nicht anpassbar
Beschreibungs-Größe: Nicht anpassbar

 

Five

Titel-Größe: Folgt Überschrift 1

 

Galapagos

Title color: Follows Heading 1
Title size:
Follows Heading 1

Hinweis: Aktiviere Benutzerdefinierte Überschriften unter „Website-Stile“.

 

Marquee (eingestellt)

Title font: Follows body text
Title size: Follows body text
Description size: Follows body text

 

Native

 

Note: Always displays at the top

Pacific

Title color: Follows Heading 1
Title size:
Follows Heading 1
Description font:
Not adjustable
Description size: Not adjustable

 

Skye

Title font: Follows the List Title tweak
Title color: Follows the Title Color tweak
Title size: Follows the List Title tweak
Description font: Follows the Excerpt tweak
Description size: Follows the Excerpt tweak

Note: List Title and Title Color tweaks are only available when viewing a Blog Page

Title font: Follows the List Title tweak
Title color: Follows the Title Color tweak
Title size: Follows the List Title tweak
Description font: Follows the List Title tweak
Description color: Follows the Title Color tweak
Description size: Follows the List Title tweak

Note: List Title and Title Color tweaks are only available when viewing a Blog Page

York

Title font: Follows Heading 1
Title color: Follows Heading 1
Title size: Follows Heading 1

 

Projektseiten

Version 7.1 doesn't support Project Pages. Use a gallery section instead.

The Project Page is a template-specific portfolio layout, available in the York family (Artesia, Flores, Harris, Jasper, Jones, Lange, Shibori, York). On Project Pages, the image title and description text display on the page beside or below the image.

Use the tweaks in the Project: Fonts section of Site Styles to style the text of your image title and descriptions. You can also scale the fonts to control how they display.

War dieser Beitrag hilfreich?
9 von 79 fanden dies hilfreich