![Bild](https://www.proadsoftware.com/images/dokumentationen_forum/moved_to_zendesk.jpg)
https://proadsoftware.zendesk.com/hc/de ... 0009656998
Umzug nach ZENDESK abgeschlossen
Einbindung von Schriften
Dokumentationsstand: 5.0.137
Diese Dokumentation richtet sich an fortgeschrittene Anwender und Administratoren.
Einleitung
Schriften haben mehrere interne Bezeichnungen, darunter der normale Schriftname, ein oder mehrere Angaben über die Schriftfamilie und andere. Diese Angaben sind in der Schriftdatei eingebettet und haben nichts mit dem Dateinamen zu tun, sie sind Teil der Schrift.
PROAD benötigt für die reibungslose Darstellung von Schriften interne Namen die nicht länger als 8 Zeichen lang sind und die innerhalb eines Dokuments eine eindeutige Bezeichnung haben, insbesondere wenn es um verschiedene Schriftschnitte einer Schriftfamilie geht. Wir empfehlen die Schriftfamilie vollständig aufzulösen, so dass jede Schrift ihre eigene Schriftfamilie ist, Schriftnamen und Familiennamen sollten gleich sein.
Aus diesen Gründen können wir Webfonts, z.B. von Google, nicht ohne Anpassung unterstützen und auch gekaufte Fonts sind meist nicht direkt für die PDF Generierung geeignet. Google bietet aber an, die Fonts herunterzuladen und es gibt kostenfreie Tools die es ermöglichen die Schriften anzupassen.
Diese Anleitung erklärt wie das mit dem Programm FontForge funktioniert und worauf man achten muss.
Schriften mit FontForge anpassen
Schriften können intern sehr lange Namen haben. Dies macht bei der PDF-Ausgabe Probleme. Dies betrifft ebenfalls die Verwendung verschiedener Schriftschnitte einer Schriftenfamilie in einem Dokument. Dies kann aber durch Anpassung der Schriftdateien gelöst werden.
Wir empfehlen derzeit den Einsatz von FontForge zur Bearbeitung der Schriftdateien (kostenlos erhältlich auf https://fontforge.github.io/en-US/)
Ablauf
Öffnen Sie Ihre Schriftdatei mit FontForge
Über [Element -> Schrift-Eigenschaften] kann nun der Schriftname und der Familienname des Fonts angepasst werden.
- Abschnitt 'PS Names' - Eigenschaft 'Schriftname' - Der Name darf nicht länger als 8 Zeichen sein, sollte eindeutig sein im Hinblick auf die Verwendung in den PROAD Dokumentvorlagen und kein Name darf Prefix einer anderen Schrift sein.
Richtig: fontReg (für den normalen Schriftschnitt) und fontLT (für den light Schriftschnitt).
Falsch: font (für den normalen Schriftschnitt) und fontLT (für den light Schriftschnitt). - Abschnitt 'PS Names' - Eigenschaft 'Familienname' - Identisch zum Schriftnamen setzen.
- Abschnitt 'TTF Names' - Eigenschaft 'Familienname' - Identisch zum Schriftnamen setzen.
- Abschnitt 'TTF Names' - Eigenschaft 'Fullname' - Identisch zum Schriftnamen setzen.
- Abschnitt 'TTF Names' - Eigenschaft 'Preferred Family' (nicht immer vorhanden) - Identisch zum Schriftnamen setzen.
- Mit Ok den Dialog bestätigen. Hier kann es zu Nachfragen kommen. Diese einfach ebenfalls bestätigen.
Jetzt können Sie die Schrift exportieren. [Datei --> Fonts herstellen...]
Fonttyp "Truetype" auswählen.
Mit "Generate" wird die Truetype-Datei erzeugt.
Auch hier kann es zu Nachfragen kommen. Oft haben Fonts Fehler oder FontForge gibt Warnungen aus. Diese können ignoriert werden.
Als Ergebnis sollte eine .ttf-Datei erzeugt worden sein.
Schrift als Truetype-Font Datei in eine PROAD Dokumentvorlage einbinden
Direkt auf Ihrem Server muss im Verzeichnis "PROADSoftware\webserver\htdocs" ein Unterverzeichnis "fonts" angelegt werden.
Alternativ kann die Datei auch über einen Cloud Dienst eingebunden werden. Dazu die Datei einfach in die entsprechende Cloud hochladen und die Adresse im @font-face als URL angeben. Wichtig hierbei ist, dass der Cloud Dienst über https, also über eine verschlüsselte Verbindung, erreichbar ist.
Die Truetype-Font Datei dort ablegen.
In PROAD die gewünschte Dokumentvorlage öffnen und in den Quellcode-Modus wechseln.
Gleich am Anfang des Quellcodes im <style>-Bereich kann die Schrift eingebunden werden: (Kommentare sind mit /* und */ gekennzeichnet)
Code: Alles auswählen
@font-face {
font-family: "fontLT"; /* der Name der Schrift */
src: url("https://WEBSEITE-EINFÜGEN/fonts/fontLT.ttf"); /* achten sie auf eine sichere Verbindung via https:// */
font-weight: normal;
font-style: normal;
}
Code: Alles auswählen
<p style="font-family: fontLT;">Das ist ein Schriftentest</p>
- Im Verzeichnis "PROADSoftware\webserver\htdocs" ein Unterverzeichnis "fonts" anlegen.
- Die Truetype-Font Datei dort ablegen.
- Den Dialog [Agentur -> Einstellungen -> Grundeinstellungen -> Dokumente] öffnen.
- Hier einen neuen Eintrag in der Fonts Liste machen.
- Fontname - Mein Font
Hier kann tatsächlich ein für das menschliche Auge gefälligerer Name eingetragen werden - Fontfamily - fontLT
Muss der "font-family" im jetzt kommenden CSS Block entsprechen. - Font-CSS
Code: Alles auswählen
@font-face { font-family: "fontLT"; /* der Name der Schrift */ src: url("https://WEBSEITE-EINFÜGEN/fonts/fontLT.ttf"); /* achten sie auf eine sichere Verbindung via https:// */ font-weight: normal; font-style: normal; }
- Fontname - Mein Font
- Speichern und sich neu Anmelden.
- Ab jetzt steht der Font auch im CKEditor in der Fonts-Dropdown zur Verfügung und kann normal verwendet werden. Alles weiter wird bitte der Dokumentation im PROAD Forum entnommen.
Das Arbeiten mit Schriftschnitten
Anpassung der PROAD Mustervorlage
Beispiel:
Code: Alles auswählen
@font-face {
font-family: "fontLT";
src: url("https://WEBSEITE-EINFÜGEN/fonts/fontLT.ttf");
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: "fontBO";
src: url("https://WEBSEITE-EINFÜGEN/fonts/fontBO.ttf");
font-weight: normal;
font-style: normal;
}
table , tr , td , thead , tfoot, body, p, .cke_editable, div {
font-family: fontLT; /* Standardschrift, diese wird als Grundschrift für das Dokument verwendet */
font-size:10pt;
line-height: 1.2;
color:rgb(0,0,0);
background:rgba(0,0,0,0);
}
strong,b,strong span, span strong {
font-family: "fontBO";
font-weight: normal;
font-style: normal;
}
Um dies zu erreichen kann man die HTML-Bereiche für Bold "überschreiben". Dies geschieht mit
Code: Alles auswählen
strong,b,strong span, span strong {
font-family: "fontBO";
font-weight: normal;
font-style: normal;
}
Dieser Trick funktioniert auch mit Italic Schriftschnitten:
Code: Alles auswählen
em,i,em span, span em {
font-family: "fontIT";
font-weight: normal;
font-style: normal;
}
Bekannte Probleme
Lizenzen
Einige Schriften haben ein Lizenzmodell das es evtl. nicht erlaubt die Schrfiten zu manipulieren oder auf PROAD Art zu verwenden. Hier gibt es nur eine Lösung: den Kontakt mit dem Schrifteninhaber suchen bzw. den Lizenzgeber kontaktieren und nach einer Lösung fragen.
Webfonts
Auch Webfonts können nicht funktionieren und zwar wenn diese ebenfalls längere Namen und der gleichen Schriftenfamilie zugewiesen sind.
Wir empfehlen IMMER alle Fonts herunterzuladen und die Schrift wie oben beschrieben anpassen und einbinden.
Arial unter Windows
Die Schrift Arial hat ein Problem mit dem Zeichenabstand. Hier kann im Dialog [Einstellungen -> Dokumentvorlagen] im Tab "Layout Dokument" der Zoomfaktor helfen. Gute Ergebnisse sind bisher mit der Einstellung 1.67 erreicht worden.
macOS Yosemite
PROAD unterstützt unter macOS Yosemite und ältere macOS Versionen nicht die @font-face Notation.
Lösung: macOS Upgrade auf macOS Sierra.
Adobe Acrobat Reader
Wenn Schriften in Dokumenten unsauber ausgegeben werden kann es Helfen die erzeugten PDF Dateien mit dem Adobe Acrobat Reader zu öffenen. Dieser ist der Standard für das PDF Format und interpretiert manche Eigenarten besser als die browserinternen Anzeigeprogramme.
Trouble Shooting
- Prüfen ob der Font herunterladbar ist. Dafür in die Grundeinstellungen die Font in der Fontliste suchen, die URL aus dem Font-CSS in einem separatem Browsertab eintragen und den Font herunterladen.
- Im Font-CSS prüfen ob die URL dieselbe ist wie PROAD geladen wird.
- Den Font in FontForge öffnen und schauen ob der Name max. 8 Zeichen lang ist und die Fontfamily und der Fontname gleich ist.
- Prüfen ob die Fontfamily im Font-CSS genauso heißt wie in der Fontliste und auch im Dokument.
- Falls Schriftschnitte nicht funktionieren muss geprüft werden ob diese als Hauptschrift für das Dokument funktionieren. Hierfür einfach die Fontfamily des Dokuments austauschen mit der des Schriftschnitts. Falls dies nicht funktioniert die vorherigen Punkte prüfen.
- Schriftschnitte werden am besten über CSS mit "strong,b" bzw. "em,i" Regeln eingebunden.