• 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

Viewing 11 replies - 1 through 11 (of 11 total)
  • Plugin Author Matt Keys

    (@mattkeys)

    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?

    Thread Starter Sébastien SERRE

    (@sebastienserre)

    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 $prefixis ‘far’

    add_filter( 'ACFFA_icon_prefix', 'ico_custom_prefix', 10, 2 );
    
    function ico_custom_prefix( $prefix, $style ) {
    	if ( 'far' !== $prefix ) {
    		return $prefix;
    	}
    
    	return 'ico';
    }
    Plugin Author Matt Keys

    (@mattkeys)

    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.

    Plugin Author Matt Keys

    (@mattkeys)

    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.
    Thread Starter Sébastien SERRE

    (@sebastienserre)

    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.png

    I’m on a multisite and the code is in a mu-plugins.

    Regards

    Thread Starter Sébastien SERRE

    (@sebastienserre)

    Hello,

    What I found is $fa_icons = apply_filters( 'ACFFA_get_icons', array() ); in wp-content/plugins/advanced-custom-fields-font-awesome/assets/inc/class-ACFFA-Loader-5.php:117 is null

    My add_filter is returning an error but WP at wp-includes/class-wp-hook.php:303 $value = call_user_func_array( $the_['function'], $args ); is reseting my $value to null

    I hope you would be able to help me.

    Thread Starter Sébastien SERRE

    (@sebastienserre)

    Sorry, problem was between Keyboard ans chair…
    What about the “ACFFA_active_icon_sets” filter ?
    Will you add it in the next release ?

    Thread Starter Sébastien SERRE

    (@sebastienserre)

    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-_70ghgfYHQk

    Plugin Author Matt Keys

    (@mattkeys)

    Off 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?

    Plugin Author Matt Keys

    (@mattkeys)

    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).

    Plugin Author Matt Keys

    (@mattkeys)

    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.

Viewing 11 replies - 1 through 11 (of 11 total)
  • The topic ‘Customizing the prefix’ is closed to new replies.