--- url: 'https://dxpr.com/es/hc/documentation/learn-dxpr-builder/development/architecture' title: 'Arquitectura | DXPR' author: name: Jurriaan url: 'https://dxpr.com/users/jurriaan' date: '2026-10-24T11:18:09+00:00' copyright: 'Copyright DXPR. All rights reserved.' type: article summary: |- DXPR Builder tiene tres partes: un formato de campo en PHP, un editor que funciona en el navegador y un conjunto de rutas que el editor llama para guardar y obtener datos. Esta página explica cómo encajan. tags: - 'Architectuur en API’s' image: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg' published: true og: site_name: DXPR updated_time: '2026-10-24T11:18:09+0000' 'image:alt': 'DXPR, powered by Drupal: AI-powered Drupal for marketers.' schema: '@context': 'https://schema.org' '@graph': - mainEntity: { } - '@type': TechArticle headline: Arquitectura description: |- DXPR Builder tiene tres partes: un formato de campo en PHP, un editor que funciona en el navegador y un conjunto de rutas que el editor llama para guardar y obtener datos. Esta página explica cómo encajan. image: '@type': ImageObject url: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg' width: '1200' height: '630' datePublished: '2026-10-24T11:18:09+0000' dateModified: '2026-10-24T11:18:09+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/documentation/learn-dxpr-builder/development/architecture' articleSection: 'Architectuur en API’s' - '@type': WebPage '@id': 'https://dxpr.com/es/hc/documentation/learn-dxpr-builder/development/architecture' description: |- DXPR Builder tiene tres partes: un formato de campo en PHP, un editor que funciona en el navegador y un conjunto de rutas que el editor llama para guardar y obtener datos. Esta página explica cómo encajan. 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 --- [Help Center](/es/hc)/[Documentation](/es/hc/documentation) /[Learn DXPR Builder](/hc/documentation/learn-dxpr-builder) /[Extend](/hc/documentation/learn-dxpr-builder/extend) /[Architectuur en API’s](/hc/documentation/learn-dxpr-builder/extend/architecture) # Arquitectura. Learn DXPR BuilderExtendArchitectuur en API’s ## In this guide DXPR Builder tiene tres partes: un formato de campo en PHP, un editor que funciona en el navegador y un conjunto de rutas que el editor llama para guardar y obtener datos. Esta página explica cómo encajan. ## Formato de campo El contenido es HTML guardado en un campo de texto ordinario de Drupal (`text`, `text_long` o `text_with_summary`). Un campo pasa a ser editable cuando su presentación usa el formato **DXPR Builder**(`dxpr_builder_text`, en `src/Plugin/Field/FieldFormatter/DxprBuilderFormatter.php`). El formato carga el editor solo cuando se cumple todo esto: - quien mira es facturable: el usuario 1, o una cuenta activa con `edit with dxpr builder` no excluida de la edición con DXPR Builder; - quien mira puede actualizar la entidad; - la cuenta tiene una dirección de correo; - los límites de personas usuarias y contenidos de la licencia no se superan; - el sitio no está en la lista de bloqueo del servidor de licencias, y la página no es una página de revisiones. Las demás reciben el HTML procesado: tokens de ruta expandidos, bloques y vistas de Drupal renderizados en sus marcadores, los atributos de editor `data-az*` quitados, y las bibliotecas que el contenido necesita adjuntas. La salida para personas con sesión iniciada no se guarda en caché (`max-age` 0), porque lleva ajustes por persona. ## Editor El editor es un conjunto de archivos JavaScript cargados como la biblioteca `dxpr_builder/editor.builder`. Vienen de la CDN de DXPR, o de la propia carpeta `dxpr_builder/` del módulo cuando contiene una compilación local; el ajuste **Asset source** en General Settings solo aparece entonces. El editor analiza el HTML del campo en un árbol de objetos de elemento y lo escribe de vuelta a HTML cuando guarda. Los tipos de elementos vienen de dos sitios en `dxpr_builder/build/`: | Carpeta | Tipos de elementos | |---|---| | `dxpr-builder/core-elements/` | Container, Section, Row, Column, Tabs y sus paneles de pestaña, toggle y slide | | `dxpr-elements/elements/` | Elementos de contenido y los elementos de diseño Collapsibles, Carousel y Positioned Layers | Cada elemento guarda sus ajustes en su propio HTML: atributos `data-azat-*`, clases y estilos en línea. El HTML guardado es el único registro del diseño; no hay otro almacén de diseño. [Elementos personalizados](/hc/documentation/learn-dxpr-builder/development/custom-elements) muestra el formato. ### Análisis de HTML existente El marcado sin atributos del constructor se mapea a elementos cuando el editor lo carga. Los contenedores, filas y columnas Bootstrap pasan a ser secciones, filas y columnas. Los componentes reconocidos pasan a ser sus elementos, por ejemplo botones, alertas, tarjetas, citas, imágenes, iconos, barras de progreso, pestañas y plegables. Texto, tablas y otro marcado en línea pasan a ser elementos Text, y un `