Support » Plugin: Getwid - Gutenberg Blocks » Support for Font Awesome Pro

  • Resolved scottsawyer

    (@scottsawyer)


    Hi, great plugin. I am using Font Awesome Pro, how do I add the Pro Icons to the Icon selector? I saw the post about adding icons to the icon selector, but there are thousands of icons in the Pro set, so that isn’t really feasible from what I can tell. Please advise.

Viewing 2 replies - 1 through 2 (of 2 total)
  • FYI, what I wound up doing is downloading the Fontawesome pro icons and uploaded to my theme. Then I used Symfony\Yaml to parse the categories.yml and icons.yml to build an array of icons.

    
    /*
     * Add font with icons to Getwid plugin.
     * Use this code in functions.php or custom plugin.
     */
    
    // add hook
    add_action( 'getwid/icons-manager/init', 'my_theme_getwid_add_custom_icons' );
    
    function my_theme_getwid_add_custom_icons( $manager ) {
    
    	// register new font
    	$custom_icons = [
    		// load icons list for visual editor from function
    		'icons' => my_theme_custom_icons_list(),
    		// or load icons list for visual editor from file
    		//'icons' => require( get_template_directory() . '/custom-icons-list.php' ),
    		'style' => 'custom-icons',
    		'enqueue_callback' => 'my_theme_enqueue_custom_icons_style'
    	];
    
    	$manager->registerFont( 'fontawesome-pro', $custom_icons );
    }
    
    function my_theme_enqueue_custom_icons_style() {
    	//load font css
    	wp_enqueue_style( 'fontawesome-pro', get_template_directory_uri() . '/assets/vendor/fontawesome-pro/css/all.min.css' );
    }
    
    function my_theme_custom_icons_list() {
    	$icons = [];
    	$icon_prefix = 'fa-';
    	$style_prefixes = [
    		'brands' => 'fab',
    		'solid' => 'fas',
    		'regular' => 'far',
    		'light' => 'fal',
    		'doutone' => 'fad',
    	];
    	// This is the directory where I put the fontawesome pro yml files
    	$meta_dir = get_template_directory() . '/assets/vendor/fontawesome-pro/metadata';
    	// This is where I call Symfony\Yaml which parses the yml to an array.
    	$categories = $this->utils->parse_yml( $meta_dir . 'categories.yml' );
    	$icons_array = $this->utils->parse_yml( $meta_dir . 'icons.yml' );
    	foreach ( $categories as $category ) {
    		foreach ( $category['icons'] as $icon ) {
    			foreach ( $icons_array[$icon['styles']] as $style ) {
    				$icons[$category['label'][] = $style_prefixes[$style] . ' ' . $icon_prefix . $icon;
    			}
    		}
    	}
    	return $icons;
    
    }
    

    This will effectively overwrite the icon list for the free version that come with the plugin. However, you will now be loading the pro css and the free css. So I just wp_dequeue_style( ‘fontawesome-free’ ); wp_deregister_style( ‘fontawesome-free’ );

    This works pretty well. Future enhancement would be to cache the icons list…

    Plugin Support Arsen A.

    (@arsengunner)

    @scottsawyer Hi there! Thanks for your insights, it is much appreciated.
    You may also check the following example of adding custom iconic font to Getwid.

    Best regards,
    Arsen A.
    MotoPress Support Team

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Support for Font Awesome Pro’ is closed to new replies.