Customizing the prefix
-
Hello,
I’m adding custom icon thanks to
ACFFA_get_icons
filter and it works but to differentiate them from the native FA icon, I would like to customize/add a prefix.I’ve found
ACFFA_icon_prefix
filter, but not sure if I will be able to reach my goal with it.Do you have a tip for me ?
Thank you
-
Well I’ve never tried to use those filters to accomplish what you are trying to do here but it is an interesting idea.
Where are you at with it / what is your current sticking point?
Hey,
I’ve followed https://thivinfo.com/en/tutorials/add-custom-icons-to-your-acf-with-acf-projects-fontawesome-field/ to add custom icons to your plugins, and it’s working well.
But as said in the tutorials, all customs icons are in the ‘far’ category and I would like to create a custom to not being in conflict with FA.
When using
ACFFA_icon_prefix
, I don’t know how to know if I’m on a custom icon or if I’m on a FontAwesome ones as$prefix
is ‘far’add_filter( 'ACFFA_icon_prefix', 'ico_custom_prefix', 10, 2 ); function ico_custom_prefix( $prefix, $style ) { if ( 'far' !== $prefix ) { return $prefix; } return 'ico'; }
Wow, I didn’t know this tutorial was out there and it is kinda fun to see. I’ll read through it and see if there is something I can tweak here to make things smoother for folks.
So playing around with this a bit locally, here is what I came up with if you’d like to test it out and see if it does what you are expecting/needing.
In /advanced-custom-fields-font-awesome/assets/inc/class-ACFFA-Loader-5.php, replace the get_ajax_query() function with the following version of it:
private function get_ajax_query( $options = array() ) { $options = acf_parse_args($options, array( 'post_id' => 0, 's' => '', 'field_key' => '', 'paged' => 0 )); $results = array(); $s = null; if ( 'default_value' != $options['field_key'] ) { $field = acf_get_field( $options['field_key'] ); if ( ! $field ) return false; } if ( $options['s'] !== '' ) { $s = strval( $options['s'] ); $s = wp_unslash( $s ); } $active_icon_sets = isset( $field['icon_sets'] ) ? $field['icon_sets'] : []; $active_icon_sets = apply_filters( 'ACFFA_active_icon_sets', $active_icon_sets ); if ( isset( $active_icon_sets ) // Make sure we have an icon set && in_array( 'custom', $active_icon_sets ) // Make sure that icon set is 'custom' && isset( $field['custom_icon_set'] ) // Make sure a custom set has been chosen && stristr( $field['custom_icon_set'], 'ACFFA_custom_icon_list_' . $this->version ) // Make sure that chosen custom set matches this version of FontAwesome && $custom_icon_set = get_option( $field['custom_icon_set'] ) // Make sure we can retrieve the icon set from the DB/cache ) { $fa_icons = array( 'list' => $custom_icon_set ); } else { $fa_icons = apply_filters( 'ACFFA_get_icons', array() ); } if ( $fa_icons ) { foreach ( $fa_icons['list'] as $prefix => $icons ) { if ( ! empty( $active_icon_sets ) && ! in_array( 'custom', $active_icon_sets ) && ! in_array( $prefix, $active_icon_sets ) ) { continue; } $prefix_icons = array(); foreach( $icons as $k => $v ) { $v = strval( $v ); if ( is_string( $s ) && false === stripos( $v, $s ) ) { continue; } $prefix_icons[] = array( 'id' => $k, 'text' => $v ); } $results[] = array( 'id' => 'fab', 'text' => apply_filters( 'ACFFA_icon_prefix_label', 'Regular', $prefix ), 'children' => $prefix_icons ); } } $response = array( 'results' => $results ); return $response; }
This adds a new filter called “ACFFA_active_icon_sets”.
With that in place, these are all of the filters I used to test it out:
function add_icomoon_icons( $icons ) { $icomoon = array( 'cierge' => array( 'name' => 'cierge', 'hex' => '\e90e', 'unicode' => '' ), 'calice' => array( 'name' => 'calice', 'hex' => '\e90f', 'unicode' => '' ), ); foreach ( $icomoon as $ico ) { $icons['list']['icomoon'][ 'icomoon ' . $ico['name'] ] = '<i class="icon-' . $ico['name'] . '"></i> ' . ucfirst( $ico['name'] ); $icons['details']['icomoon']['icomoon ' . $ico['name']]['hex'] = $ico['hex']; $icons['details']['icomoon']['icomoon ' . $ico['name']]['unicode'] = $ico['unicode']; } return $icons; } add_filter( 'ACFFA_get_icons', 'add_icomoon_icons' ); function acf_icomoon_prefix( $prefix, $style ) { $prefix = empty( $prefix ) ? 'far' : $prefix; switch ( $style ) { case 'icomoon': $prefix = 'icomoon'; break; } return $prefix; } add_filter( 'ACFFA_icon_prefix', 'acf_icomoon_prefix', 10, 2 ); function acf_icomoon_prefix_label( $label, $prefix ) { $label = empty( $label ) ? 'Regular' : $label; switch ( $prefix ) { case 'icomoon': $label = 'Icomoon'; break; } return $label; } add_filter( 'ACFFA_icon_prefix_label', 'acf_icomoon_prefix_label', 10, 2 ); function add_icomoon_to_icon_sets( $icon_sets ) { $icon_sets[] = 'icomoon'; return $icon_sets; } add_filter( 'ACFFA_active_icon_sets', 'add_icomoon_to_icon_sets', 10, 1 );
I haven’t gone so far as to testing this with actually icomoon icons and having them display on the frontend. So curious to here if this works for you. Please share your results.
-
This reply was modified 2 years, 9 months ago by
Matt Keys.
Hello,
Thank you for helping me.
I’ve added your code to my project and unfortunately, the list of icons in the field remain empty:
https://i.imgur.com/QFEoos6.pngI’m on a multisite and the code is in a mu-plugins.
Regards
Hello,
What I found is
$fa_icons = apply_filters( 'ACFFA_get_icons', array() );
inwp-content/plugins/advanced-custom-fields-font-awesome/assets/inc/class-ACFFA-Loader-5.php:117
is nullMy
add_filter
is returning an error but WP atwp-includes/class-wp-hook.php:303
$value = call_user_func_array( $the_['function'], $args );
is reseting my$value
tonull
I hope you would be able to help me.
Sorry, problem was between Keyboard ans chair…
What about the “ACFFA_active_icon_sets” filter ?
Will you add it in the next release ?There is always a problem
When I select a FontAwsome Icon, it’s OK but with an Icomoon, It disapear:
https://cloud.serre.xyz/d/s/mWh1qEL87x61CyKzcS9QZL7yofXGxXcM/xYDh4C9soDqW5XPbWxD14iuGc81Rqqq2-_70ghgfYHQkOff the top of my head I am not sure what would be causing that issue. Did you not run into this problem when you were putting your custom icons in the ‘far’ icon set?
As far as including this in a future update, I am open to it if something can easily be done without impacting the main goal of this plugin (FontAwesome icons).
Ah I see where the issue is. The plugin expects all icon sets to have a 3 letter prefix, because that is what FontAwesome uses.
Instead of using ‘icomoon’ as the prefix as I showed you in my example, you need to use something three letters, like ‘ico’ or ‘icm’ or whatever makes sense to you. The label can still be as long as you want it to be though.
-
This reply was modified 2 years, 9 months ago by
- The topic ‘Customizing the prefix’ is closed to new replies.