| Table of Contents |
|---|
Introduction
| Thai |
|---|
บทนำ |
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.
| Thai |
|---|
Font Awesome เป็นชุดเครื่องมือตัวอักษรและไอคอน UI ที่ใช้ CSS และ LESS ซึ่งคุณสามารถเพิ่มลงในแอพ Joget ของคุณได้โดยเฉพาะเมนู userview Joget DX รวมถึงห้องสมุด Fontawesome v5.8.1 & v4.6.1 |
Figure 1: Joget app menus with prefix Fontawesome icons.
| Thai |
|---|
รูปที่ 1: เมนูแอป Joget พร้อมไอคอนนำหน้า Fontawesome |
Figure 2: Example adding Fontawesome HTML codes into Userview menus.
| Thai |
|---|
รูปที่ 2: ตัวอย่างการเพิ่มรหัส HTML Fontawesome ลงในเมนู Userview |
Example Usage
| Thai |
|---|
ตัวอย่างการใช้งาน |
Here are some usage examples for Fontawesome 5:
| Thai |
|---|
นี่คือตัวอย่างการใช้งานสำหรับ Fontawesome 5: |
| Code Block | ||
|---|---|---|
| ||
<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
| Thai |
|---|
วิธีการรับคลาส FontAwesome แบบเต็ม |
Figure 3: Fontawesome icon website
| Thai |
|---|
รูปที่ 3: เว็บไซต์ไอคอน Fontawesome |
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.
| Thai |
|---|
อ้างอิงรหัสไอคอน FontAwesome 5 จาก https://fontawesome.com/icons?d=gallery&m=free คุณยังสามารถดูชื่อรหัส FontAwesome ไอคอน (ตัวอย่าง "fa-arrow-up") ในไฟล์ต้นฉบับ CSS ใน Joget DX "[โฟลเดอร์ Joget] \ apache-tomcat-8.5.41 \ webapps \ jw \ js \ fontawesome5 \ โฟลเดอร์ css \ "เพื่อรับทราบว่าไอคอนใดรองรับ |
Add Your Own Fontawesome Library
| Thai |
|---|
เพิ่มห้องสมุด Fontawesome ของคุณเอง |
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":
| Thai |
|---|
คุณสามารถเพิ่มห้องสมุด FontAwesome ของคุณเองในแอพของคุณหากคุณต้องการรุ่นที่ใหม่กว่าใน Joget DX ที่มีอยู่ในปัจจุบันโดยใช้ไวยากรณ์ต่อไปนี้ใน Userview Custom Header (เปลี่ยน href = "" url ตามลำดับ) นี่คือ "การอ้างอิง Font Awesome CDN": https://cdnjs.com/libraries/font-awesome/5.12.0-1 สำหรับ "v5.12.0-1": |
| Code Block | ||
|---|---|---|
| ||
<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 /> |
...