--- url: 'https://dxpr.com/nl/hc/documentation/learn-dxpr-builder/development/architecture' title: 'DXPR Builder themen | DXPR' author: name: Jurriaan url: 'https://dxpr.com/users/jurriaan' date: '2026-10-24T02:32:49+00:00' updated: '2026-10-24T09:09:48+00:00' copyright: 'Copyright DXPR. All rights reserved.' type: article summary: |- DXPR Builder heeft drie delen: een veldformatter in PHP, een editor die in de browser draait, en een set routes die de editor aanroept om data op te slaan en op te halen. Deze pagina legt uit hoe ze in elkaar passen. 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-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: 'DXPR Builder themen' description: |- DXPR Builder heeft drie delen: een veldformatter in PHP, een editor die in de browser draait, en een set routes die de editor aanroept om data op te slaan en op te halen. Deze pagina legt uit hoe ze in elkaar passen. image: '@type': ImageObject url: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg' width: '1200' height: '630' datePublished: '2026-10-24T02:32:49+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/nl/hc/documentation/learn-dxpr-builder/development/architecture' articleSection: 'Architectuur en API’s' - '@type': WebPage '@id': 'https://dxpr.com/nl/hc/documentation/learn-dxpr-builder/development/architecture' description: |- DXPR Builder heeft drie delen: een veldformatter in PHP, een editor die in de browser draait, en een set routes die de editor aanroept om data op te slaan en op te halen. Deze pagina legt uit hoe ze in elkaar passen. breadcrumb: '@type': BreadcrumbList itemListElement: - '@type': ListItem position: 1 name: Home item: 'https://dxpr.com/nl' publisher: '@type': Organization '@id': 'https://dxpr.com/#organization' name: DXPR inLanguage: nl --- [Help Center](/nl/hc)/[Documentatie](/nl/hc/documentatie) /[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) # DXPR Builder themen. Learn DXPR BuilderExtendArchitectuur en API’s ## In this guide DXPR Builder heeft drie delen: een veldformatter in PHP, een editor die in de browser draait, en een set routes die de editor aanroept om data op te slaan en op te halen. Deze pagina legt uit hoe ze in elkaar passen. ## Veldformatter Inhoud is HTML opgeslagen in een gewoon Drupal-tekstveld (`text`, `text_long` of `text_with_summary`). Een veld wordt bewerkbaar wanneer zijn weergave de **DXPR Builder**-formatter gebruikt (`dxpr_builder_text`, in `src/Plugin/Field/FieldFormatter/DxprBuilderFormatter.php`). De formatter laadt de editor alleen wanneer dit allemaal geldt: - de kijker is factureerbaar: gebruiker 1, of een actief account met `edit with dxpr builder` dat niet is uitgesloten van DXPR Builder-bewerken; - de kijker mag de entiteit bijwerken; - het account heeft een e-mailadres; - de gebruikers- en inhoudslimieten van de licentie zijn niet overschreden; - de site staat niet op de blokkeerlijst van de licentieserver, en de pagina is geen revisiepagina. Iedereen anders krijgt de verwerkte HTML: padtokens uitgevouwen, Drupal-blokken en views gerenderd in hun placeholders, de `data-az*`-editorattributen verwijderd, en de libraries die de inhoud nodig heeft gekoppeld. Output voor ingelogde gebruikers wordt niet gecachet (`max-age` 0), omdat die gebruikersspecifieke instellingen draagt. ## Editor De editor is een set JavaScript-bestanden geladen als de `dxpr_builder/editor.builder`-library. Ze komen van het DXPR CDN, of van de eigen map `dxpr_builder/` van de module wanneer die een lokale build bevat; de **Asset source**-instelling op General Settings verschijnt alleen dan. De editor parset de HTML van het veld naar een boom van elementobjecten en schrijft hem bij opslaan terug naar HTML. Elementtypen komen uit twee plekken in `dxpr_builder/build/`: | Map | Elementtypen | |---|---| | `dxpr-builder/core-elements/` | Container, Section, Row, Column, Tabs en hun tab-, toggle- en slidepanelen | | `dxpr-elements/elements/` | Inhoudselementen en de lay-outelementen Collapsibles, Carousel en Positioned Layers | Elk element bewaart zijn instellingen in zijn eigen HTML: `data-azat-*`-attributen, klassen en inline stijlen. De opgeslagen HTML is de enige vastlegging van de lay-out; er is geen aparte lay-outopslag. [Aangepaste elementen](/nl/hc/documentation/learn-dxpr-builder/development/custom-elements) toont het formaat. ### Bestaande HTML parsen Markup zonder builderattributen wordt bij laden aan elementen gekoppeld. Bootstrap-containers, -rijen en -kolommen worden secties, rijen en kolommen. Herkende componenten worden hun elementen, bijvoorbeeld knoppen, meldingen, kaarten, citaten, afbeeldingen, pictogrammen, voortgangsbalken, tabs en inklappanelen. Tekst, tabellen en andere inline markup worden Tekst-elementen, en een `