--- url: 'https://dxpr.com/es/hc/documentacion/aprender-dxpr-builder/elementos/panel' title: 'Añadir un panel | DXPR' author: name: Jurriaan url: 'https://dxpr.com/users/jurriaan' date: '2026-10-24T00:11:29+00:00' updated: '2026-10-24T17:19:22+00:00' copyright: 'Copyright DXPR. All rights reserved.' type: article summary: 'Obtienes un recuadro enmarcado con una barra de título de color que mantiene junto el contenido relacionado, como horarios de apertura o un aviso. Úsalo cuando un bloque de una página necesita su propio encabezado y marco.' 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 panel' description: 'Obtienes un recuadro enmarcado con una barra de título de color que mantiene junto el contenido relacionado, como horarios de apertura o un aviso. Úsalo cuando un bloque de una página necesita su propio encabezado y marco.' image: '@type': ImageObject url: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg' width: '1200' height: '630' datePublished: '2026-10-24T00:11:29+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/panel' articleSection: Marketing - '@type': WebPage '@id': 'https://dxpr.com/es/hc/documentacion/aprender-dxpr-builder/elementos/panel' description: 'Obtienes un recuadro enmarcado con una barra de título de color que mantiene junto el contenido relacionado, como horarios de apertura o un aviso. Úsalo cuando un bloque de una página necesita su propio encabezado y marco.' 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 panel. 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 recuadro enmarcado con una barra de título de color que mantiene junto el contenido relacionado, como horarios de apertura o un aviso. Úsalo cuando un bloque de una página necesita su propio encabezado y marco. ## Añade un panel Abre tu página con la sesión iniciada: los controles del constructor aparecen cuando pasas el cursor sobre la zona de contenido. [Crea tu primera página](/es/hc/documentacion/aprender-dxpr-builder/primeros-pasos/primera-pagina) muestra lo básico. 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 **Panel**. Queda arriba de la columna, sin diálogo. 2. Pasa el cursor sobre el panel, haz clic en **More** en su barra de controles y elige **Settings**. Escribe un **Title**. 3. Elige un **Type** para el color: DXPR, Default, Primary, Success, Info, Warning o Danger. Aquí elegimos **Primary**. 4. Haz clic en **Save** en el diálogo. 5. Haz clic en el **+** dentro del cuerpo del panel y añade un **Button** desde la pestaña **Content**. Un elemento Text también sirve, por ejemplo para horarios de apertura. Luego haz clic en **Save** en la barra de herramientas arriba de la zona de contenido para guardar la página. ## Lo que ves Tu título queda en una barra de título de color, y el botón queda en el cuerpo del panel debajo. El botón es su propio elemento, así que lo editas y le das estilo por su cuenta. En el vídeo, un panel Primary titulado Citizen Services Opening Hours contiene un botón de reserva. Las visitas lo ven cuando guardas la página y está publicada. ## Configura tu panel Pasa el cursor sobre el elemento y abre **More > Settings** en su barra de controles. Opciones: - **Title:** el texto en la barra de título. Déjalo vacío para un panel sin barra de título. - **Type:** el color del borde y la barra de título, tomado de tu tema: Default, Primary, Success, Info, Warning o Danger. DXPR, el valor predeterminado, es en cambio un recuadro oscuro con texto claro. El panel es un contenedor. Añade o arrastra texto, imágenes, iconos o botones a su cuerpo. ## Si no lo ves - **Panel no está en la pestaña Content.** Tu perfil de usuario lo oculta. Pide a una cuenta administradora que marque **Panel (Bootstrap 3)** en **Elements** 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. - **No se abre ningún diálogo de ajustes al añadir el panel.** Un panel entra sin diálogo. Pasa el cursor sobre el elemento y abre **More > Settings** para definir su título y tipo. - **El panel muestra una barra de título y nada debajo.** Aún no se añadió ningún elemento dentro. Haz clic en el **+** del cuerpo del panel y añade un Text o Button. - **Falta la barra de título.** El campo **Title** está vacío. Pasa el cursor sobre el elemento y abre **More > Settings**, y escribe un título. ## ¿Qué sigue? [Panel Style](/es/hc/documentacion/aprender-dxpr-builder/ajustes-elemento/pestana-style) para cambiar espaciado y fondo de tu panel.