Dokumentation

Schriftarten werden in AEM 6.5 HTML5 Forms nicht korrekt gerendert

Last update: Fri Sep 19 2025 00:00:00 GMT+0000 (Coordinated Universal Time)

Beim Rendern von XDP-Vorlagen als HTML5-Formulare in AEM 6.5 Forms können Schriftarten möglicherweise nicht korrekt angezeigt werden - insbesondere auf Computern, auf denen die erforderlichen Schriftarten nicht lokal installiert sind. Selbst wenn die Schriftarten im CRX-Repository vorhanden sind, besteht das Problem aufgrund von Kompatibilitäts- und Konfigurationslücken weiter. Um dies zu beheben, verwenden Sie Webfonts, konfigurieren Sie ein benutzerdefiniertes Renderprofil und überprüfen Sie die Einrichtung in allen Umgebungen.

Beschreibung description

Umgebung

Produkt: Adobe Experience Manager - Forms (AEM - Forms)
Version: 6.5
Bereitstellung: On-Premise
Komponente: Rendern von HTML5-Formularen

Problem/Symptome

  • Schriftarten werden in HTML5-Formularen, die aus XDP-Vorlagen generiert wurden, nicht korrekt dargestellt.
  • Das Problem tritt auch dann auf, wenn Schriftarten im CRX-Repository verfügbar sind.
  • Schriftarten werden nur auf Computern korrekt angezeigt, auf denen sie lokal installiert sind.
  • Die Konfiguration von Gibson Font Manager löst das Problem nicht.

Auflösung resolution

Gehen Sie wie folgt vor, um Probleme beim Rendern von Schriftarten in HTML5-Formularen zu beheben:

  1. TrueType-Schriftarten sind nicht mit dem HTML5-Rendering kompatibel. Verwenden Sie Web-kompatible Schriftarten wie .woff. Übertragen Sie diese Schriftarten dann über Ihr Code-Projekt oder -Paket in CRX.

  2. Erstellen Sie ein benutzerdefiniertes Profil für die Wiedergabe von HTML5-Formularen anhand der Anweisungen unter Erstellen eines benutzerdefinierten Profils für HTML5 im Benutzerhandbuch zu AEM 6.5.

    code language-none 
    @font-face {
      font-family: 'Charles Modern';
      src: url( ../resources/fonts/CharlesModern-Bold.woff') format('woff ); /* add bold font here */
      font-style: normal;
      font-weight: bold;
    }

    @font-face {
      font-family: 'Charles Modern';
      src: url( ../resources/fonts/CharlesModern-Regular.woff') format('woff );
      font-style: normal;
      font-weight: normal;
    }

    @font-face {
      font-family: 'Charles Modern';
      src: url( ../resources/fonts/CharlesModern-CondBold.woff') format('woff ); /* add italics font here */
      font-style: italic;
      font-weight: bold;
    }

  • Referenzieren Sie die Schriftarten in Ihrer Renderer-Profilkonfiguration mithilfe @font-face CSS-Regeln, wie in diesem Beispiel gezeigt:
    : Stellen Sie sicher, dass Ihr benutzerdefiniertes Profil diese Clientlibs enthält:

  • xfaforms.loadingProfile.loadingPage

  • xfaforms.3rdparty, xfaforms.xfalib, xfaforms.toolbar, xfaforms.scrollnav
    : Setzen Sie allowProxy in benutzerdefinierten Profil auf true“.

  • Schließen Sie die folgenden Clientlibs-Zeilen in formRuntime.jsp ein:

    "
    <ui:includeClientLib categories="${xfaLocale},xfaforms.loadingProfile.loadingPage“ />
    <ui:includeClientLib categories=„Codebase.customFunctionsCategory“ />
    "
    ​-

    Hierarchie für benutzerdefiniertes Profil:

    /apps/hrform

    "
    └── demo
    ├── formRuntime.jsp
    ├──.jsp
    └── loadingProfile
    ├── css
    └── css.txt
    ├── javascript
    └──.txt
    └── Ressourcen
    └──SchriftartenCharlesModern-Bold.WoffffFF
    ├── CharlesModern-BoldItalic.woff
    ├── CharlesModern-Cond.woff
    ├──"
    -Hierarchie für Code-Paket:apps/Codebase/customclientlib„cssCSS.txtJSmodern-woffJSwoffJSmodern.woffCSmodernCJSwoffCJSwoff

    ├──
    └──
    ├──
    └──
    └──
    └──
    ├──
    ├──
    ├──
    └──

woff

Starten Sie dann AEM neu, nachdem Sie die Schriftarten bereitgestellt und die Konfigurationen aktualisiert haben.

Testen Sie das Rendern von Formularen in Windows- und Mac-Umgebungen und verschiedenen Browsern. Verwenden Sie Ihre benutzerdefinierte Profil-URL ähnlich wie:

  • http://host:port/content/xfaforms/profiles/hrform.html?contentRoot=crx:///content/dam/formsanddocuments/sample-form&template=sample-form.xdp
recommendation-more-help
3d58f420-19b5-47a0-a122-5c9dab55ec7f