---
url: 'https://dxpr.com/es/hc/documentacion/aprender-dxpr-builder/elementos/jumbotron'
title: 'Añadir un jumbotron | DXPR'
author:
  name: Jurriaan
  url: 'https://dxpr.com/users/jurriaan'
date: '2026-10-24T00:14:02+00:00'
updated: '2026-10-24T17:19:22+00:00'
copyright: 'Copyright DXPR. All rights reserved.'
type: article
summary: 'Obtienes un gran banner hero con un título, una frase de entradilla y un fondo de marca, listo para llevar un botón. Úsalo para abrir una página, anunciar un evento o llevar las visitas a una acción.'
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-24T17:19:22+0000'
  'image:alt': 'DXPR, powered by Drupal: AI-powered Drupal for marketers.'
schema:
  '@context': 'https://schema.org'
  '@graph':
    -
      mainEntity: {  }
    -
      '@type': TechArticle
      headline: 'Añadir un jumbotron'
      description: 'Obtienes un gran banner hero con un título, una frase de entradilla y un fondo de marca, listo para llevar un botón. Úsalo para abrir una página, anunciar un evento o llevar las visitas a una acción.'
      image:
        '@type': ImageObject
        url: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
        width: '1200'
        height: '630'
      datePublished: '2026-10-24T00:14:02+0000'
      dateModified: '2026-10-24T17:19:22+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/es/hc/documentacion/aprender-dxpr-builder/elementos/jumbotron'
      articleSection: Marketing
    -
      '@type': WebPage
      '@id': 'https://dxpr.com/es/hc/documentacion/aprender-dxpr-builder/elementos/jumbotron'
      description: 'Obtienes un gran banner hero con un título, una frase de entradilla y un fondo de marca, listo para llevar un botón. Úsalo para abrir una página, anunciar un evento o llevar las visitas a una acción.'
      breadcrumb:
        '@type': BreadcrumbList
        itemListElement:
          -
            '@type': ListItem
            position: 1
            name: Inicio
            item: 'https://dxpr.com/es'
      publisher:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
      inLanguage: es
---
[Centro de ayuda](/es/hc)/[Documentación](/es/hc/documentacion) /[Aprende DXPR Builder](/es/hc/documentation/learn-dxpr-builder) /[Crear páginas](/es/hc/documentation/learn-dxpr-builder/build) /[Añadir contenido](/es/hc/documentation/learn-dxpr-builder/elements) /[Marketing](/es/hc/documentation/learn-dxpr-builder/elements/marketing) # Añadir un jumbotron.

 Aprende DXPR BuilderCrear páginasAñadir contenidoMarketing

   ## En esta guía

 Guías relacionadas

- [Cambia el aspecto de un elemento en el panel Style](/es/hc/documentacion/aprender-dxpr-builder/ajustes-elemento/pestana-style)

Obtienes un gran banner hero con un título, una frase de entradilla y un fondo de marca, listo para llevar un botón. Úsalo para abrir una página, anunciar un evento o llevar las visitas a una acción.

## Añade un jumbotron

1. Pasa el cursor sobre la columna y haz clic en **+** en su barra de controles, o haz clic en **Add Elements** en una página vacía. Abre la pestaña **Content** y haz clic en **Jumbotron**.
2. Escribe el **Title**.
3. Añade una frase **Lead** que venda el evento.
4. Elige un **Type** para el fondo; Primary con texto blanco destaca.
5. Haz clic en **Save** en el diálogo.
6. Haz clic en **+** dentro del jumbotron y añade un **Button**, porque un jumbotron es un contenedor.

Luego haz clic en **Save** en la barra de herramientas arriba de la zona de contenido para guardar la página.

  ## Lo que ves

Título, entradilla y botón quedan en un banner de marca por toda la columna. El botón es un elemento Button normal dentro del jumbotron, así que lo editas y le das estilo por su cuenta.

## Configura tu jumbotron

Abre **More > Settings** en el elemento. Opciones:

- **Title:** el encabezado principal del jumbotron.
- **Lead:** texto introductorio mayor bajo el título.
- **Type:** estilo de fondo: Light, Primary, Secondary, Success, Info, Warning, Danger, Dark o Default.
- **Padding:** espaciado interno alrededor del contenido: Large, Medium o Small.

El jumbotron es un contenedor. Arrastra o añade otros elementos dentro: botones, imágenes o más texto.

## Si no lo ves

- **Jumbotron no está en la pestaña Content.** Tu perfil de usuario lo oculta. Pide a una cuenta administradora que lo active en [User profiles](/es/hc/documentacion/aprender-dxpr-builder/administracion/perfiles-usuario-administracion).
- **Ya no está tras recargar.** La página no se guardó. Añádelo de nuevo y haz clic en **Save** en la barra de herramientas arriba de la zona de contenido.
- **El banner muestra un "+" y nada más.** Aún no se añadió ningún elemento dentro. Haz clic en el **+** del jumbotron y elige un Button o Text.
- **Texto blanco sobre fondo claro.** **Type** está en Light mientras el texto del tema es claro. Elige Primary o Dark.

## ¿Qué sigue?

[Panel Style](/es/hc/documentacion/aprender-dxpr-builder/ajustes-elemento/pestana-style) para cambiar espaciado y fondo de tu jumbotron.