Author Topic: How to use "Font Awesome" in Elxis 4.x? (Read 9026 times)

chongbing · « **on:** April 30, 2015, 20:13:33 »

Hi there,

Does anyone know If I want to use the "Font Awesome" in Elxis 4.x ? ref, http://fortawesome.github.io/Font-Awesome/get-started/

How to load files (CSS/JS) in Elxis page ?
Because font-awesome.min.css should be referenced in the <head> of webpage(html/php)

Thanks a lot.

datahell · « **Reply #1 on:** May 01, 2015, 14:04:56 »

You should do so in your template's index.php file.
The code to add a style-sheet file in <head> section is this:

$eDoc->addStyleLink('http://www.example.com/css/anyfile.css');

If $eDoc is not previously declared do that first:
$eDoc = eFactory::getDocument();

Documentation for Elxis Document library

chongbing · « **Reply #2 on:** May 01, 2015, 16:58:42 »

Hi datahell,

I’ve added a style-sheet file in <head> section as you said but it not worked.
Could you kindly check that ?

URL at http://filemaker.bz/en/filemakergo/test-font-awesome.html

Thanks a lot.

datahell · « **Reply #3 on:** May 01, 2015, 17:16:27 »

The CSS style has been loaded fine but you don't use it correctly. You have to insert some elements and apply to them the css classes you want to display.

chongbing · « **Reply #4 on:** May 01, 2015, 17:59:32 »

Thank datahell for quick reply.

Yes, I just wrote a some elements and “fortawesome” classes via CKEditor as below
but the some css codes will be cleared in CKEditor after i click save or apply buttom.

Do you know why the some css codes will be cleared ? Thanks again.

Code: [Select]

<i class="fa fa-camera-retro fa-lg"></i> fa-lg
<i class="fa fa-camera-retro fa-2x"></i> fa-2x
<i class="fa fa-camera-retro fa-3x"></i> fa-3x
<i class="fa fa-camera-retro fa-4x"></i> fa-4x
<i class="fa fa-camera-retro fa-5x"></i> fa-5x

datahell · « **Reply #5 on:** May 01, 2015, 20:11:52 »

No css class is been cleared by the editor. What may be cleared is some old fashioned html tags.

chongbing · « **Reply #6 on:** May 01, 2015, 20:55:07 »

Could you give me some advice ? if I want to use more "Web font" like in your Elxis 4.x ? Thanks datahell

datahell · « **Reply #7 on:** May 02, 2015, 20:42:14 »

I don't know what you want to do and I don't see why you must use this "awesome" font. With standard CSS you can do anything, you don't need such external frameworks. If you want to display some graphical signs next to your text (like cars, phone, etc) you can use a sprite image. CSS is simple: you declare a rule in your stylesheet file and you use it in HTML code. Be careful for CSS overwrites and browser compatibility!

chongbing · « **Reply #8 on:** May 03, 2015, 10:22:37 »

For the end users, clicking "awesome font" from the editor shall be easier and help prevent errors in editing. As below image, the preset boomstrap is available to select. It's a great thing !

http://forum.j2eemx.com/files/images/ScreenShotEditor.png

chongbing · « **Reply #9 on:** May 04, 2015, 15:01:37 »

Hope this feature can be added to the next release, If possible

---
Is possible add the "Font Awesome" in CKEditor for user to pick ?

Please see the demo(font-awesome in CKEditor)
http://michaeljanea.byethost7.com/ckeditor/font-awesome

Author Topic: How to use "Font Awesome" in Elxis 4.x? (Read 9026 times)

chongbing

How to use "Font Awesome" in Elxis 4.x?

datahell

Re: How to use "Font Awesome" in Elxis 4.x?

chongbing

Re: How to use "Font Awesome" in Elxis 4.x?

datahell

Re: How to use "Font Awesome" in Elxis 4.x?

chongbing

Re: How to use "Font Awesome" in Elxis 4.x?

datahell

Re: How to use "Font Awesome" in Elxis 4.x?

chongbing

Re: How to use "Font Awesome" in Elxis 4.x?

datahell

Re: How to use "Font Awesome" in Elxis 4.x?

chongbing

Re: How to use "Font Awesome" in Elxis 4.x?

chongbing

Re: How to use "Font Awesome" in Elxis 4.x?