Abaksoft Posted December 28, 2019 Share Posted December 28, 2019 Dear Friends, Here is a step by step way to use them. 1. Download the official kit from : https://fontawesome.com/download by choosing FreeForWeb 2. Copy this folder (uncompressed) into your files Folder 3. In your Unigui Project add this simple line on your ServerModule > CustomFiles : (Thx to GerhardV) <link rel="stylesheet" href="files/fontawesome-free-5.12.0-web/css/all.css"> (5.12 is the current release) 4. Put an UniLabel on Mainform and set its TextConversion to txtHTML 5. Use your FontAweSome like this : procedure TMainForm.UniFormCreate(Sender: TObject); begin Unilabel1.caption:='<i class="fa fa-dove" style=color:green></i>'; end; Where : fa is the Class Name and fa-dove is icon's Name. See more details in : https://fontawesome.com/how-to-use/on-the-web/referencing-icons/basic-use 6. Choose your icon from 1553 free icons : https://fontawesome.com/icons?d=gallery&s=solid&m=free 7. You can also, use them OnLine from public CDNs : by adding this simple line to the CustomFiles (Thx to Marlon) <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.0/css/all.css"> ___________ Enjoy OffLine_FontAwSome.zip 7 Quote Link to comment Share on other sites More sharing options...
mhmda Posted December 29, 2019 Share Posted December 29, 2019 Thank you شكرا اخي العزيز Quote Link to comment Share on other sites More sharing options...
billyChou Posted January 1, 2020 Share Posted January 1, 2020 Thanks Quote Link to comment Share on other sites More sharing options...
fraxzi Posted February 28, 2020 Share Posted February 28, 2020 HI @Abaksoft, Why the Pro looks like this on popmenu: and the Free looks like better arranged? using "far fa-shopping-cart, etc.." are aligned compare to using "fad fa-shopping-cart"? Any workaround? Thanks, Frances Quote Link to comment Share on other sites More sharing options...
Abaksoft Posted February 28, 2020 Author Share Posted February 28, 2020 8 hours ago, fraxzi said: HI @Abaksoft, Why the Pro looks like this on popmenu: and the Free looks like better arranged? using "far fa-shopping-cart, etc.." are aligned compare to using "fad fa-shopping-cart"? Any workaround? Thanks, Frances Hello Frances, Mmm...i don't know (i don't have the Pro edition). Are you sure your setting (parent RTL ) are the same on the 2 test cases ? That said, i like your design Quote Link to comment Share on other sites More sharing options...
fraxzi Posted February 29, 2020 Share Posted February 29, 2020 8 hours ago, Abaksoft said: Hello Frances, Mmm...i don't know (i don't have the Pro edition). Are you sure your setting (parent RTL ) are the same on the 2 test cases ? That said, i like your design Hi @Abaksoft, Thanks! I tried your suggestion on/off on both but still the same.. Regards, Frances Quote Link to comment Share on other sites More sharing options...
thiagopedro Posted April 29, 2020 Share Posted April 29, 2020 On 12/28/2019 at 10:31 AM, Abaksoft said: Dear Friends, Here is a step by step way to use them. 1. Download the official kit from : https://fontawesome.com/download by choosing FreeForWeb 2. Copy this folder (uncompressed) into your files Folder 3. In your Unigui Project add this simple line on your ServerModule > CustomFiles : (Thx to GerhardV) <link rel="stylesheet" href="files/fontawesome-free-5.12.0-web/css/all.css"> (5.12 is the current release) 4. Put an UniLabel on Mainform and set its TextConversion to txtHTML 5. Use your FontAweSome like this : procedure TMainForm.UniFormCreate(Sender: TObject); begin Unilabel1.caption:='<i class="fa fa-dove" style=color:green></i>'; end; Where : fa is the Class Name and fa-dove is icon's Name. See more details in : https://fontawesome.com/how-to-use/on-the-web/referencing-icons/basic-use 6. Choose your icon from 1553 free icons : https://fontawesome.com/icons?d=gallery&s=solid&m=free 7. You can also, use them OnLine from public CDNs : by adding this simple line to the CustomFiles (Thx to Marlon) <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.0/css/all.css"> ___________ Enjoy OffLine_FontAwSome.zip How to change the icon of place? Place on the right side. Quote Link to comment Share on other sites More sharing options...
Freeman35 Posted April 29, 2020 Share Posted April 29, 2020 1 hour ago, thiagopedro said: How to change the icon of place? Place on the right side. You can try this code, Unilabel1.caption:= 'Text on Left' +'  ' + '<i class="fa fa-dove" style=color:green></i>' + ' Text on rigth'; Quote Link to comment Share on other sites More sharing options...
Abaksoft Posted May 4, 2020 Author Share Posted May 4, 2020 Hello Experts, Since Build 1530, Farshad integrated the free pack FontAwsome in Unigui. So, it is now very easy to use them : in the Object Inspector : 1. Choose your Font version : ServerModule > FontAwsomeVersion : fontAws5 2. set the TextConversion property of your (caption, uniEdit, etc...) : txtHTML 3. Copy / Paste the text of your icons (obtained from the siteweb) : https://fontawesome.com/icons?d=gallery&s=solid&m=free Best regards Quote Link to comment Share on other sites More sharing options...
x11 Posted May 4, 2020 Share Posted May 4, 2020 TUniTreeMenu Quote Link to comment Share on other sites More sharing options...
crystian Posted May 14, 2020 Share Posted May 14, 2020 On 5/4/2020 at 5:04 AM, Abaksoft said: Hello Experts, Since Build 1530, Farshad integrated the free pack FontAwsome in Unigui. So, it is now very easy to use them : in the Object Inspector : 1. Choose your Font version : ServerModule > FontAwsomeVersion : fontAws5 2. set the TextConversion property of your (caption, uniEdit, etc...) : txtHTML 3. Copy / Paste the text of your icons (obtained from the siteweb) : https://fontawesome.com/icons?d=gallery&s=solid&m=free Best regards how can change that free pack for a premium pack (i have a premium). Quote Link to comment Share on other sites More sharing options...
Abaksoft Posted May 14, 2020 Author Share Posted May 14, 2020 9 hours ago, crystian said: how can change that free pack for a premium pack (i have a premium). Hello, Did you try ? Copy / Paste the text of your icons From the PRO siteweb : https://fontawesome.com/icons?d=gallery&s=solid&m=pro Maybe (I did'nt try it) on Step 3 : 3. In your Unigui Project add this simple line on your ServerModule > CustomFiles : <link rel="stylesheet" href="files/myfontawesome_pro/css/all.css"> with : myfontawesome_pro your uncompressed Directory Pro Edition. Quote Link to comment Share on other sites More sharing options...
crystian Posted May 15, 2020 Share Posted May 15, 2020 13 hours ago, Abaksoft said: Hello, Did you try ? Copy / Paste the text of your icons From the PRO siteweb : https://fontawesome.com/icons?d=gallery&s=solid&m=pro Maybe (I did'nt try it) on Step 3 : 3. In your Unigui Project add this simple line on your ServerModule > CustomFiles : <link rel="stylesheet" href="files/myfontawesome_pro/css/all.css"> with : myfontawesome_pro your uncompressed Directory Pro Edition. yeap, then works ty Quote Link to comment Share on other sites More sharing options...
Freeman35 Posted May 26, 2020 Share Posted May 26, 2020 procedure TDM_Server.UniGUIServerModuleBeforeInit(Sender: TObject); begin CustomFiles.add('\files\myfontawesome_pro\css\all.min.css'); I use this way use. And I'm recomemded always use ".min" text added files. 'cos this files mean compressed, mean it has small size. Quote Link to comment Share on other sites More sharing options...
fraxzi Posted June 4, 2020 Share Posted June 4, 2020 On 2/29/2020 at 12:51 AM, Abaksoft said: Hello Frances, Mmm...i don't know (i don't have the Pro edition). Are you sure your setting (parent RTL ) are the same on the 2 test cases ? That said, i like your design Hi @Abaksoft, The misalignment happens with 'Duotone' icons .. I hope anyone has a workaround. Thanks, Frances Quote Link to comment Share on other sites More sharing options...
fraxzi Posted June 10, 2020 Share Posted June 10, 2020 Hi All, what if you you have 2 apps.. then you need to copy each fontawesome offline folders to each 'files' forder?? Thanks, Frances Quote Link to comment Share on other sites More sharing options...
mazluta Posted July 29, 2021 Share Posted July 29, 2021 thanks. very good! Quote Link to comment Share on other sites More sharing options...
Abaksoft Posted August 30, 2021 Author Share Posted August 30, 2021 Dear All Unigueers, There is no need to do all above as FontAwsome is integrated on Unigui since 2020 - 15xx (did'nt remember). Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.