Differences

This shows you the differences between two versions of the page.

--- 74:configure_font_for_process_visualization [2020/03/10 16:34] – [Option 2] twn
+++ 74:configure_font_for_process_visualization [2020/04/17 12:12] – [Option 1 [recommended]] pklr
@@ Line 4: / Line 4: @@
   - Place the font file in the folder webapp/fonts
-  - Add the diagram.font.list property to your config.xml file in the following way: \\ <property name="diagram.font.list" value="Pacifico:/fonts/Pacifico-Regular.ttf"/>
+  - Add the diagram.font.list property to your config.xml file in the following way: \\ <property name="diagram.font.list" value="Pacifico:/webapp/fonts/Pacifico-Regular.ttf"/>
   - Update your scriptconfig.js like this: var FONTNAME = "Pacifico"
+  - Add a font-face to your custom.css file like this:
+    <blockquote>
+@font-face { \\ font-family: 'YourFont'; \\ font-style: normal; \\ font-weight: 400; \\ font-display: swap; \\ src: local('YourFont'), local('YourFont'), url (''/pathToFont/YourFont.ttf') format('truetype'); \\ unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; \\ }
+//Note1: The unicode-range is completely optional and can be used in combination with a font splitt up into several .woff oder .woff2 files. //
+//Note2: Take care, you are using the appropriate format (e.g. .ttf -> truetype, .woff2 -> woff2 ...)//
+</blockquote>
 //Caution: On update / upgrade your font file will be removed and this steps has to be redone.//