--- url: 'https://dxpr.com/pt-pt/hc/documentacao/aprender-dxpr-builder/personalizacao/modelos-personalizados' title: 'Sobrepor modelos do DXPR Builder | DXPR' author: name: Jurriaan url: 'https://dxpr.com/users/jurriaan' date: '2026-10-24T11:46:38+00:00' updated: '2026-10-24T17:19:22+00:00' copyright: 'Copyright DXPR. All rights reserved.' type: article summary: |- O DXPR Builder apresenta os elementos no navegador, a partir de modelos compilados no editor. Não há modelo de elemento para copiar para um tema. O módulo traz quatro modelos Twig para as próprias páginas, e esses sobrepõem-se da forma normal do Drupal. Esta página enumera-os, explica por que a marcação de elementos não pode ser sobreposta, e aponta para as rotas que o módulo suporta. Modelos Twig que pode sobrepor Os modelos vivem na pasta templates/ do módulo: tags: - 'Match your brand' 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: 'Sobrepor modelos do DXPR Builder' description: |- O DXPR Builder apresenta os elementos no navegador, a partir de modelos compilados no editor. Não há modelo de elemento para copiar para um tema. O módulo traz quatro modelos Twig para as próprias páginas, e esses sobrepõem-se da forma normal do Drupal. Esta página enumera-os, explica por que a marcação de elementos não pode ser sobreposta, e aponta para as rotas que o módulo suporta. Modelos Twig que pode sobrepor Os modelos vivem na pasta templates/ do módulo: image: '@type': ImageObject url: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg' width: '1200' height: '630' datePublished: '2026-10-24T11:46:38+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/pt-pt/hc/documentacao/aprender-dxpr-builder/personalizacao/modelos-personalizados' articleSection: 'Adaptar à sua marca' - '@type': WebPage '@id': 'https://dxpr.com/pt-pt/hc/documentacao/aprender-dxpr-builder/personalizacao/modelos-personalizados' description: |- O DXPR Builder apresenta os elementos no navegador, a partir de modelos compilados no editor. Não há modelo de elemento para copiar para um tema. O módulo traz quatro modelos Twig para as próprias páginas, e esses sobrepõem-se da forma normal do Drupal. Esta página enumera-os, explica por que a marcação de elementos não pode ser sobreposta, e aponta para as rotas que o módulo suporta. Modelos Twig que pode sobrepor Os modelos vivem na pasta templates/ do módulo: breadcrumb: '@type': BreadcrumbList itemListElement: - '@type': ListItem position: 1 name: Início item: 'https://dxpr.com/pt-pt' publisher: '@type': Organization '@id': 'https://dxpr.com/#organization' name: DXPR inLanguage: pt-pt --- [Centro de ajuda](/pt-pt/node/75)/[Documentação](/pt-pt/hc/documentacao) /[Aprender DXPR Builder](/pt-pt/hc/documentation/learn-dxpr-builder) /[Gerir o site](/pt-pt/hc/documentation/learn-dxpr-builder/manage) /[Adaptar à sua marca](/pt-pt/hc/documentation/learn-dxpr-builder/customization) # Sobrepor modelos do DXPR Builder. Aprender DXPR BuilderGerir o siteAdaptar à sua marca ## Neste guia Guias relacionados - [Comece uma página a partir de um modelo](/pt-pt/hc/documentacao/aprender-dxpr-builder/modelos-reutilizaveis/modelos-de-pagina) - [Theming](/hc/documentation/learn-dxpr-builder/development/theming) O DXPR Builder apresenta os elementos no navegador, a partir de modelos compilados no editor. Não há modelo de elemento para copiar para um tema. O módulo traz quatro modelos Twig para as próprias páginas, e esses sobrepõem-se da forma normal do Drupal. Esta página enumera-os, explica por que a marcação de elementos não pode ser sobreposta, e aponta para as rotas que o módulo suporta. ## Modelos Twig que pode sobrepor Os modelos vivem na pasta `templates/` do módulo: | Template | Used for | Variables | |---|---|---| | `dxpr-license-info.html.twig` | O resumo de utilização nas páginas **User Licenses** e **Content items**, e **License info**, o bloco | `used_count`, `total_count`, `limit`, `block_label`, `total_label`, `used_label`, `more_info_link` | | `page--dxpr-builder--media-library.html.twig` | O invólucro de página do diálogo Media Library em `/dxpr_builder/media-library` | as variáveis `page` padrão | | `html--dxpr-builder--media-library.html.twig` | O invólucro `` do mesmo diálogo | as variáveis `html` padrão | | `page--people-list.html.twig` | Um ponto de partida para a página **People** (`/admin/people`) com um resumo de licença | as variáveis `page` padrão mais `user_license` | Os três primeiros funcionam como estão. O Drupal não carrega `page--people-list.html.twig` a partir do módulo. O DXPR Builder só adiciona a sugestão `page__people_list` e a variável `user_license` na página People. Para mostrar lá o resumo, copie o ficheiro para o tema de administração. Para sobrepor um modelo: 1. Copie o ficheiro de `modules/contrib/dxpr_builder/templates/` para a pasta `templates/` do tema que o apresenta. As páginas de administração e o diálogo Media Library usam o tema de administração. O bloco **License info** usa o tema da região onde o colocou. 2. Edite a cópia. 3. Limpe as caches com `drush cr`. ## Por que a marcação de elementos não pode ser sobreposta A marcação de cada elemento é um modelo twig.js em `dxpr_builder/templates/`, por exemplo `elements/alert/alert.twig.html`. A compilação compila estes modelos em `dxpr_builder/dxpr_templates.js`. O editor apresenta-os no navegador e guarda o HTML resultante no campo. Seguem-se duas coisas: - Um modelo alterado precisa de uma reconstrução do editor. Os sites que carregam o editor da CDN da DXPR não podem usar um modelo alterado. - As páginas guardadas mantêm o HTML com que foram guardadas. Um modelo novo só afeta elementos apresentados após a alteração. Por isso, o módulo não oferece sobreposição por site de modelos de elemento. Use uma das rotas abaixo. ## Rotas de personalização suportadas | Goal | Route | |---|---| | Esquemas reutilizáveis para editores | [Modelos de página](/pt-pt/hc/documentacao/aprender-dxpr-builder/modelos-reutilizaveis/modelos-de-pagina) e [Modelos de utilizador](/pt-pt/hc/documentation/learn-dxpr-builder/reusable-templates/user-templates), ambos escolhidos no construtor | | Mudar o aspeto dos elementos | [CSS personalizado](/pt-pt/hc/documentacao/aprender-dxpr-builder/personalizacao/css-personalizado) no tema, apontado às classes próprias ou às classes `az-*` do construtor | | Dar aos editores estilos nomeados | [Classes utilitárias](/pt-pt/hc/documentacao/aprender-dxpr-builder/personalizacao/classes-utilitarias) do `.info.yml` do tema, e [estilos personalizados](/pt-pt/hc/documentacao/aprender-dxpr-builder/personalizacao/editor-de-texto#set-up) para o editor de texto | | Conjuntos de ícones extra | [Bibliotecas de ícones](/pt-pt/hc/documentacao/aprender-dxpr-builder/personalizacao/bibliotecas-de-icones) | | Novos tipos de elemento | [Criar elementos personalizados](/pt-pt/hc/documentacao/aprender-dxpr-builder/desenvolvimento/elementos-personalizados) | ## O que se segue? - [Modelos de página](/pt-pt/hc/documentacao/aprender-dxpr-builder/modelos-reutilizaveis/modelos-de-pagina): o sistema de modelos que os editores usam. - [Temas no DXPR Builder](/hc/documentation/learn-dxpr-builder/development/theming): como o CSS do construtor e o tema combinam.