Joget DX Beta Available for Download

Check out Joget DX, the next generation successor to Joget Workflow for faster, simpler digital transformation.

Skip to end of metadata
Go to start of metadata


Introduction

Font Awesome is a font and icon UI toolkit based on CSS and LESS, which you can add into your Joget app, especially the userview menus. Joget DX includes the Fontawesome v5.8.1 & v4.6.1 libraries.


Figure 1: Joget app menus with prefix Fontawesome icons.



Figure 2: Example adding Fontawesome HTML codes into Userview menus.


Example Usage

Here are some usage examples for Fontawesome 5:

<i class="fas fa-home"></i><br/>
<i class="far fa-bookmark"></i><br/>
<i class="fas fa-file"></i><br/>


How To Get The Full FontAwesome Classes


Figure 3: Fontawesome icon website


Reference the FontAwesome 5 icon codes from https://fontawesome.com/icons?d=gallery&m=free .

You can also view the FontAwesome icon codes names (example "fa-arrow-up") in the CSS source files in your Joget DX "[Joget folder]\apache-tomcat-8.5.41\webapps\jw\js\fontawesome5\css\" folder to know which icons are supported.


Add Your Own Fontawesome Library

You can add your own FontAwesome library into your app if you need a version that is newer than currently available in Joget DX, using the following syntax in Userview Custom Header (change the href="" url accordingly). Here is the "Font Awesome CDN reference":https://cdnjs.com/libraries/font-awesome/5.12.0-1 for "v5.12.0-1":

<link rel="preload" href="/jw/js/fontawesome5/fonts/fontawesome-webfont.woff2?v=4.6.1" as="font" crossorigin />
<link rel="preload" href="/jw/js/fontawesome5/webfonts/fa-brands-400.woff2" as="font" crossorigin />
<link rel="preload" href="/jw/js/fontawesome5/webfonts/fa-solid-900.woff2" as="font" crossorigin />



  • No labels