Jump to content

How to add "Font-awesome 5" to FieldtypeFontIconPicker?


Mustafa-Online
 Share

Recommended Posts

I will say, I downloaded the module using the class from the module directory, and font awesome 4 was the only option to select in the options (though the FontAwesome5.php was there). I uninstalled the module and installed from the github page and you can select Font Awesome 5.

Link to comment
Share on other sites

Hello,

here is simplified version of icons font fieldtype module: https://github.com/OLSA/FieldtypeFontIcon

This module use the same icons css file like your template (set path relative to template folder, eg. styles/fontawesome5/all.css ).

After module install and created field go to field Input tab to set path (and in some cases prefix classes).

Examples:

Font Awesome 5

font-awesome-5.thumb.png.a7bd716b631a40aa7ed1a3e66d4e6d80.png

IcoMoon

icomoon.thumb.png.59077e846d1fa0f6ca6bfd4da4056dce.png

If everything is ok you will get something like this:

icon-fields.thumb.png.90c74bc3c885eb595cf2deec1e3dc557.png

NOTE:
"Regular expression pattern parser" input field is not required because it will be set by default (by module itself).

Regards.

 

  • Like 7
Link to comment
Share on other sites

  • 1 month later...

@Mustafa-Online  probably you use Fontawsome v4 and get that situation because ProcessWire also use Fontawesome icons v4 and override module css inclusion.
If you go with some other font icons (or FA version v5, Fontelo, IcoMoon...) that would works.
Also switch off option "Repeater dynamic loading (AJAX)" for repeater field.

icon-fields.thumb.png.db4d6e296b8ab94477ed83e6ed138b56.pngicon-in-repeater.png.a91cbf10d52c72d96aac915d479584d3.png

Regards.

Link to comment
Share on other sites

  • 7 months later...

@OLSA many thanks for the module that works great to set up and select! However, I still have a big problem...

If i have selected an icon and then click on save, the information "Session: Saved Page: ...." appears on top.

But when I want to leave the page I ALWAYS get a popup with the following error message (sorry translated from German) "This page asks you to confirm that you want to leave the page - data you have entered may not be saved."

What am I doing wrong or is there an error in the CSS/JS?

Can someone please help me?
Thank you
cu Ralf

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...