--- url: 'https://dxpr.com/es/hc/documentacion/aprender-dxpr-builder/primeros-pasos/guia-producto' title: 'Conoce DXPR Builder y elige tu configuración | DXPR' author: name: Jurriaan url: 'https://dxpr.com/users/jurriaan' date: '2026-10-24T00:12:39+00:00' updated: '2026-10-24T17:19:22+00:00' copyright: 'Copyright DXPR. All rights reserved.' type: article summary: |- Haz un tour corto de DXPR Builder y mira dónde encaja DXPR Theme. Abres el selector de elementos, construyes una sección con estilo y la previsualizas. El resto de esta página muestra qué añade cada producto, para elegir entre el constructor por su cuenta, el constructor con DXPR Theme, o DXPR CMS con ambos. El vídeo recorre DXPR Builder en una página nueva y vacía y construye una sección. tags: - 'Build your first page' 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: 'Conoce DXPR Builder y elige tu configuración' description: |- Haz un tour corto de DXPR Builder y mira dónde encaja DXPR Theme. Abres el selector de elementos, construyes una sección con estilo y la previsualizas. El resto de esta página muestra qué añade cada producto, para elegir entre el constructor por su cuenta, el constructor con DXPR Theme, o DXPR CMS con ambos. El vídeo recorre DXPR Builder en una página nueva y vacía y construye una secció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:12:39+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/primeros-pasos/guia-producto' articleSection: 'Crea tu primera página' - '@type': WebPage '@id': 'https://dxpr.com/es/hc/documentacion/aprender-dxpr-builder/primeros-pasos/guia-producto' description: |- Haz un tour corto de DXPR Builder y mira dónde encaja DXPR Theme. Abres el selector de elementos, construyes una sección con estilo y la previsualizas. El resto de esta página muestra qué añade cada producto, para elegir entre el constructor por su cuenta, el constructor con DXPR Theme, o DXPR CMS con ambos. El vídeo recorre DXPR Builder en una página nueva y vacía y construye una secció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) /[Empieza aquí](/es/hc/documentation/learn-dxpr-builder/start-here) /[Crea tu primera página](/es/hc/documentation/learn-dxpr-builder/start-here/first-steps) # Conoce DXPR Builder y elige tu configuración. Aprende DXPR BuilderEmpieza aquíCrea tu primera página ## En esta guía Guías relacionadas - [Crea tu primera página](/es/hc/documentacion/aprender-dxpr-builder/primeros-pasos/primera-pagina) - [Quién usa DXPR Builder](/es/hc/documentacion/aprender-dxpr-builder/empezar-aqui/quien-usa-dxpr-builder) Haz un tour corto de DXPR Builder y mira dónde encaja DXPR Theme. Abres el selector de elementos, construyes una sección con estilo y la previsualizas. El resto de esta página muestra qué añade cada producto, para elegir entre el constructor por su cuenta, el constructor con DXPR Theme, o DXPR CMS con ambos. El vídeo recorre DXPR Builder en una página nueva y vacía y construye una sección. ## Recorre el editor Empieza en una página guardada y vacía de un tipo de contenido que muestra el constructor. 1. Haz clic en **Add Elements** para abrir el selector de elementos. 2. Mira sus pestañas: **Content**, **Drupal Blocks**, **Drupal Views**, **Saved templates** y **Layout**. 3. Elige **Section** en la pestaña **Layout**. 4. Pasa el cursor sobre la sección, abre **More**, elige **Settings** y escoge un **Background** en el panel **Style**. 5. Haz clic en **+** en la sección para añadir un **Row**, y añade un **Button** y **Text** a sus columnas. Elige un **Font color** para el texto en su panel **Style**. 6. Haz clic en **Save** en la barra de herramientas, y abre el menú de vista y elige **Preview**. ## Lo que ves En **Preview**, una sección gris clara muestra dos columnas. La izquierda tiene un encabezado, una línea de texto y un botón **Más información**; la derecha tiene un encabezado morado y su texto. La vista previa oculta las barras de controles y botones de añadir, así ves la página como la verán las visitas. ## Qué añade cada producto **DXPR Builder** es el módulo Drupal que acabas de recorrer. Funciona con cualquier tema y añade: - 22 elementos de contenido y 6 elementos de diseño - Edición en la página misma, con vista previa - Texto con IA, creación de páginas e imágenes, con los módulos de IA instalados - Plantillas de página y plantillas de usuario reutilizables - Perfiles de usuario que definen qué puede usar cada rol - Bloques y vistas Drupal dentro de tus diseños **DXPR Theme** es un tema Bootstrap 5 de DXPR. Añade ajustes de colores, fuentes, cabecera y diseño de página, y se adapta a teléfonos y tabletas. No necesita clave de producto propia. | | DXPR Builder con otro tema | DXPR Builder con DXPR Theme | |---|---|---| | Bootstrap 5 | De tu tema, o **Sideload Bootstrap files** en **Bootstrap 5** | La provee el tema | | Muestras de color en el constructor | La paleta de tu tema, si define una | La paleta de color de DXPR Theme | | Desplazamiento suave bajo una cabecera fija | Pon **Scroll offset selector** a tu cabecera | Funciona instalado | | Clave de producto | Necesaria | Necesaria solo para DXPR Builder | Ambos ajustes están en la página **General Settings** de DXPR Builder, en **Bootstrap** y **Advanced Settings**. ## Elige tu configuración | Quiero… | Usa | Necesita | |---|---|---| | empezar un sitio nuevo con todo configurado | [Empieza un sitio nuevo con DXPR CMS](/es/hc/documentacion/aprender-dxpr-builder/primeros-pasos/instalar-dxpr-cms) | Un sitio Drupal 11 nuevo | | añadir construcción visual de páginas a un sitio que ya funciona | [Instala DXPR Builder en tu sitio Drupal](/es/hc/documentacion/aprender-dxpr-builder/primeros-pasos/instalacion) | Bootstrap 5 del tema o del ajuste de carga lateral | | ajustar el constructor a un tema personalizado | DXPR Builder más [Aplicación de temas a DXPR Builder](/es/hc/documentacion/aprender-dxpr-builder/desarrollo/aplicacion-temas) | Una persona desarrolladora | Equipos de marketing que empiezan desde cero sacan el máximo de DXPR CMS: ambos productos y páginas de demostración llegan listos para usar. Los webmasters con un sitio existente añaden DXPR Builder y conservan su tema. ## Si no ves el selector de elementos - **La página vacía muestra "Choose a template" pero ningún botón Add Elements.** **Enable page creation assistant** está desactivado en `/admin/dxpr_studio/dxpr_builder/ai_settings`. Haz clic en **+** en la barra de herramientas del constructor para abrir el selector. - **Botones y columnas se ven sin estilo.** Tu tema no carga Bootstrap 5. Pon **Sideload Bootstrap files** en **Bootstrap 5** en **Bootstrap** en `/admin/dxpr_studio/dxpr_builder/settings`. - **El selector de color no muestra muestras.** Tu tema no define paleta de color. Elige el color en el selector mismo, o usa un tema con paleta, como DXPR Theme. ## ¿Qué sigue? - [Crea tu primera página](/es/hc/documentacion/aprender-dxpr-builder/primeros-pasos/primera-pagina): una página completa, paso a paso. - [Quién usa DXPR Builder](/es/hc/documentacion/aprender-dxpr-builder/empezar-aqui/quien-usa-dxpr-builder): qué hacen con él equipos de marketing, webmasters y desarrollo.