---
url: 'https://dxpr.com/de/hc/documentation/learn-dxpr-builder/elements/jumbotron'
title: 'Ein Jumbotron hinzufügen | DXPR'
author:
  name: Jurriaan
  url: 'https://dxpr.com/users/jurriaan'
date: '2026-10-23T23:55:18+00:00'
updated: '2026-10-24T09:09:48+00:00'
copyright: 'Copyright DXPR. All rights reserved.'
type: article
summary: 'Sie erhalten ein großes Hero-Banner mit Titel, Lead-Satz und Marken-Hintergrund, bereit für einen Button. Nutzen Sie es, um eine Seite zu eröffnen, eine Veranstaltung anzukündigen oder Besucher zu einer Aktion zu führen.'
tags:
  - Marketing
image: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
published: true
og:
  site_name: DXPR
  updated_time: '2026-10-24T09:09:48+0000'
  'image:alt': 'DXPR, powered by Drupal: AI-powered Drupal for marketers.'
schema:
  '@context': 'https://schema.org'
  '@graph':
    -
      mainEntity: {  }
    -
      '@type': TechArticle
      headline: 'Ein Jumbotron hinzufügen'
      description: 'Sie erhalten ein großes Hero-Banner mit Titel, Lead-Satz und Marken-Hintergrund, bereit für einen Button. Nutzen Sie es, um eine Seite zu eröffnen, eine Veranstaltung anzukündigen oder Besucher zu einer Aktion zu führen.'
      image:
        '@type': ImageObject
        url: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
        width: '1200'
        height: '630'
      datePublished: '2026-10-23T23:55:18+0000'
      dateModified: '2026-10-24T09:09:48+0000'
      author:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
        url: 'https://dxpr.com/'
        logo:
          '@type': ImageObject
          url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg'
          width: '1348'
          height: '501'
      publisher:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
        url: 'https://dxpr.com/'
        logo:
          '@type': ImageObject
          url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg'
          width: '1348'
          height: '501'
      mainEntityOfPage: 'https://dxpr.com/de/hc/documentation/learn-dxpr-builder/elements/jumbotron'
      articleSection: Marketing
    -
      '@type': WebPage
      '@id': 'https://dxpr.com/de/hc/documentation/learn-dxpr-builder/elements/jumbotron'
      description: 'Sie erhalten ein großes Hero-Banner mit Titel, Lead-Satz und Marken-Hintergrund, bereit für einen Button. Nutzen Sie es, um eine Seite zu eröffnen, eine Veranstaltung anzukündigen oder Besucher zu einer Aktion zu führen.'
      breadcrumb:
        '@type': BreadcrumbList
        itemListElement:
          -
            '@type': ListItem
            position: 1
            name: Startseite
            item: 'https://dxpr.com/de'
      publisher:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
      inLanguage: de
---
[Help Center](/de/hc)/[Documentation](/de/hc/documentation) /[Learn DXPR Builder](/hc/documentation/learn-dxpr-builder) /[Build pages](/hc/documentation/learn-dxpr-builder/build) /[Add content](/hc/documentation/learn-dxpr-builder/elements) /[Marketing](/hc/documentation/learn-dxpr-builder/elements/marketing) # Ein Jumbotron hinzufügen.

 Learn DXPR BuilderBuild pagesAdd contentMarketing

   ## In this guide

 Related guides

- [Das Aussehen eines Elements im Style-Tab ändern](/de/hc/documentation/learn-dxpr-builder/element-settings/style-tab)

Sie erhalten ein großes Hero-Banner mit Titel, Lead-Satz und Marken-Hintergrund, bereit für einen Button. Nutzen Sie es, um eine Seite zu eröffnen, eine Veranstaltung anzukündigen oder Besucher zu einer Aktion zu führen.

## Ein Jumbotron hinzufügen

1. Fahren Sie mit der Maus über die Spalte und klicken Sie in ihrer Steuerleiste auf **+**; klicken Sie auf einer leeren Seite auf **Add Elements**. Öffnen Sie den **Content**-Tab und klicken Sie auf **Jumbotron**.
2. Geben Sie den **Title** ein.
3. Fügen Sie einen **Lead**-Satz hinzu, der die Veranstaltung verkauft.
4. Wählen Sie einen **Type** für den Hintergrund; Primary mit weißem Text sticht hervor.
5. Klicken Sie im Dialog auf **Speichern**.
6. Klicken Sie auf das **+** im Jumbotron und fügen Sie einen **Button** hinzu, denn ein Jumbotron ist ein Container.

Klicken Sie dann in der Symbolleiste oben im Inhaltsbereich auf **Speichern**, um die Seite zu speichern.

  ## Was Sie sehen

Titel, Lead und Button sitzen in einem Marken-Banner über die Spalte. Der Button ist ein normales Button-Element im Jumbotron, Sie bearbeiten und gestalten ihn also einzeln.

## Ihr Jumbotron einrichten

Öffnen Sie an dem Element **More &gt; Settings**. Optionen:

- **Title:** die Hauptüberschrift, die im Jumbotron angezeigt wird.
- **Lead:** größerer Einführungstext unter dem Titel.
- **Type:** Hintergrundstil: Light, Primary, Secondary, Success, Info, Warning, Danger, Dark oder Default.
- **Padding:** Innenabstand um den Inhalt: Large, Medium oder Small.

Der Jumbotron ist ein Container. Ziehen Sie andere Elemente hinein oder fügen Sie sie hinzu: Buttons, Bilder oder mehr Text.

## Wenn Sie es nicht sehen

- **Der Jumbotron ist nicht im Content-Tab.** Ihr Benutzerprofil blendet ihn aus. Bitten Sie die Administration, ihn unter [User Profiles](/de/hc/documentation/learn-dxpr-builder/admin/user-profiles-admin) zu aktivieren.
- **Es ist nach dem Neuladen verschwunden.** Die Seite wurde nicht gespeichert. Fügen Sie es erneut hinzu und klicken Sie in der Symbolleiste oben im Inhaltsbereich auf **Speichern**.
- **Das Banner zeigt ein „+“ und sonst nichts.** Es wurde noch kein Element darin hinzugefügt. Klicken Sie auf das **+** im Jumbotron und wählen Sie einen Button oder Text.
- **Weißer Text auf hellem Hintergrund.** **Type** steht auf Light, während der Theme-Text hell ist. Wählen Sie Primary oder Dark.

## Wie geht es weiter?

[Style-Tab](/de/hc/documentation/learn-dxpr-builder/element-settings/style-tab), um Abstände und Hintergrund Ihres Jumbotrons zu ändern.