🎨 App Theming
Het toepassen van omgevingsspecifieke branding binnen een model-driven app in Dynamics 365 / Dataverse.
Met App Theming kunnen OTAP-omgevingen (DEV, TST, ACC en PRD) visueel van elkaar worden onderscheiden door middel van:
- Een afwijkende applicatie-headerkleur
- Een omgevingsspecifiek logo
- Een centrale theme-configuratie
Hierdoor herkennen gebruikers direct in welke omgeving zij werken, wat de kans op fouten tijdens ontwikkeling, testen en beheer aanzienlijk verkleint.
Toepassing
Deze werkwijze is geschikt voor:
- Model-driven apps binnen Dynamics 365 / Dataverse
- Omgevingen die duidelijk OTAP-onderscheid vereisen
- Organisaties die consistente branding willen toepassen
- Implementaties die gebruikmaken van de moderne Fluent UI ("New Look")
Componenten
De oplossing bestaat uit de volgende onderdelen:
| Component | Doel |
|---|---|
| XML Web Resource | Configuratie van de app-headerkleur |
| Image Web Resource | Weergave van een logo in de applicatie |
Setting OverrideAppHeaderColor |
Activeert de XML-configuratie |
| Theme | Koppelt branding aan de applicatie |
1. Solution aanmaken
Maak een solution met de naam Theme.
| Voorbeeld |
|---|
 |
Voeg vervolgens de volgende componenten toe:
- XML Web Resource
- Image Web Resource
- Setting
XML Web Resource
Maak per omgeving een afzonderlijke XML-webresource aan.
Voorbeeld ACC:
- File Type: XML
- Name:
customer_themes/CustomerACC.xml - Display Name:
customer_themes/CustomerACC.xml - Description: Centralized XML-based theme configuration resource for Dynamics 365
- Language: None
| Web Resource |
|---|
 |
XML-structuur
De XML-webresource bepaalt de kleuren van de applicatie-header.
Ondersteunde eigenschappen:
| Eigenschap | Omschrijving |
|---|---|
| Background | Achtergrondkleur van de header |
| Foreground | Tekstkleur |
| BackgroundHover | Achtergrondkleur bij hover |
| ForegroundHover | Tekstkleur bij hover |
| BackgroundPressed | Achtergrondkleur tijdens klikken |
| ForegroundPressed | Tekstkleur tijdens klikken |
| BackgroundSelected | Achtergrondkleur van geselecteerde onderdelen |
| ForegroundSelected | Tekstkleur van geselecteerde onderdelen |
Voorbeeld:
| XML |
|---|
 |
Aanbevolen OTAP-kleuren
| Omgeving | Kleur |
|---|---|
| DEV | Groen |
| TST | Blauw |
| ACC | Oranje |
| PRD | Donkerblauw of huisstijl |
Image Web Resource
Voeg een logo toe dat in de applicatie wordt weergegeven.
Voorbeeld:
- File Type: PNG
- Name:
customer_images/CustomerLogo.png - Display Name:
customer_images/CustomerLogo.png - Description: Branding logo for use within the Dynamics 365 user interface
- Language: None
| Logo |
|---|
 |
2. CRM-configuratie
Na installatie van de solution moet per omgeving de juiste XML-configuratie worden geactiveerd.
Setting aanpassen
Pas de Microsoft-setting OverrideAppHeaderColor aan.
Deze setting verwijst naar de XML-webresource die voor de betreffende omgeving gebruikt moet worden.
| Setting |
|---|
 |
 |
Na publicatie wordt de headerkleur automatisch toegepast.
3. Theme configureren
Navigeer naar:
Customizations → Themes
Maak een nieuw theme aan.
Configuratie
- Theme Name: Customer Theme
- Logo: customer_images/CustomerLogo.png
- Logo Tooltip: Customized for a better user experience
| Theme |
|---|
 |
Publiceer vervolgens het theme zodat de wijzigingen actief worden.
| Publish Theme |
|---|
 |
⚠️ Aandachtspunten
- Maak voor iedere OTAP-omgeving een aparte XML-webresource.
- Gebruik consistente kleuren per omgeving.
- Importeer dezelfde solution in alle omgevingen.
- Pas uitsluitend de configuratie aan per omgeving.
- Controleer na upgrades van Dynamics 365 of de theming nog correct wordt toegepast.
Samenvatting
Met App Theming kan een model-driven app visueel worden aangepast per omgeving door middel van:
- Een omgevingsspecifieke headerkleur
- Een eigen logo
- Een centraal beheerde XML-configuratie
Deze aanpak verbetert de herkenbaarheid van OTAP-omgevingen, ondersteunt veilige deploymentprocessen en vermindert de kans dat gebruikers werkzaamheden uitvoeren in de verkeerde omgeving.
✅ Aanbevolen voor iedere Dynamics 365 / Dataverse implementatie met meerdere omgevingen.