Elxis CMS Forum
Support => General => Topic started by: 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.
-
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 (https://www.elxis.net/docs/developers/libraries/elxisdocument.html)
-
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.
-
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.
-
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.
<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
-
No css class is been cleared by the editor. What may be cleared is some old fashioned html tags.
-
Could you give me some advice ? if I want to use more "Web font" like in your Elxis 4.x ? Thanks datahell
-
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!
-
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
-
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