I have seen a number of posts in the forum where in Couch Developers want to use Font Awesome from the Couch Admin Panel. I have come to this point quite a few times myself.
So I finally wrote an Addon for it. I hope it comes in handy for CouchCMS users.
ADDON: Font Awesome
Now use Font Awesome from within cms:editable tag.
This is only for Font Awesome 4.7 | 600+ icons available
Installation:
1. Download the attached zip file (fa-icon.zip) and extract it.
2. Copy the extracted folder to /couch/addons/
3. Add the following line to kfunctions.php
Usage
1. Define an editable region as:
2. To display the icon selected in the backend, use the following code:
For those who are familiar with Font Awesome, would know that there is a size range for the icons in Font Awesome (fa-lg, fa-1x to fa-5x) to use that you can just add it to the output as:
Checked With and works:
1. globals.php (as in the tutorial section of couch)
2. In repeatable regions
3. Standalone editable regions
If you find it useful, please do let us know.
This can be extended to use almost all other text based icons such as: Google Material Icons, Ionicons, etc. with some tweaks.
Regards,
Team GXCPL
So I finally wrote an Addon for it. I hope it comes in handy for CouchCMS users.
ADDON: Font Awesome
Now use Font Awesome from within cms:editable tag.
This is only for Font Awesome 4.7 | 600+ icons available
Installation:
1. Download the attached zip file (fa-icon.zip) and extract it.
2. Copy the extracted folder to /couch/addons/
3. Add the following line to kfunctions.php
- Code: Select all
require_once( K_COUCH_DIR.'addons/fa-icon/fa-icon.php' );
Usage
1. Define an editable region as:
- Code: Select all
<cms:editable name="text_icon" type="fa_icon" />
2. To display the icon selected in the backend, use the following code:
- Code: Select all
<i class="fa <cms:show text_icon />"></i>
For those who are familiar with Font Awesome, would know that there is a size range for the icons in Font Awesome (fa-lg, fa-1x to fa-5x) to use that you can just add it to the output as:
- Code: Select all
<i class="fa <cms:show text_icon /> fa-3x"></i>
Checked With and works:
1. globals.php (as in the tutorial section of couch)
2. In repeatable regions
3. Standalone editable regions
If you find it useful, please do let us know.
This can be extended to use almost all other text based icons such as: Google Material Icons, Ionicons, etc. with some tweaks.
Regards,
Team GXCPL