Okay
  Print

Update FontAwesome for more icon

Hi! The current version of FontAwesome seems to be old now as it don't have the Yelp icon, etc. So, update to the latest version will be a good choice. However, it might be complex to do. Bellow we give you some code to get the FontAwesome from the CDN, as well as add the new Yelp icon. Please insert the following code into the end of functions.php file. BUT, we recommend you using Child Theme to avoid losing all of your Custom Code whenever Main Theme is update. For more details of using Child Theme, check out here https://linethemes.ticksy.com/article/5608/

/**
 * This action will remove the fontawesome that bundled
 * in the theme and use the CDN instead
 */
add_action( 'init', 'anycar_fontawesome_cdn', 99 );

if ( ! function_exists( 'anycar_fontawesome_cdn' ) ) {
    function anycar_fontawesome_cdn() {
        wp_deregister_style( 'op-fontawesome' );
        wp_deregister_style( 'anycar-fontawesome' );

        wp_register_style( 'op-fontawesome', '//maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css', array(), '4.5.0' );
        wp_register_style( 'anycar-fontawesome', '//maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css', array(), '4.5.0' );
    }
}

/**
 * The filter for adding Yelp icon into
 * the theme customizer
 */
add_filter( 'op_available_social_icons', 'anycar_social_icons' );

if ( ! function_exists( 'anycar_social_icons' ) ) {
    function anycar_social_icons( $icons ) {
        $icons['yelp'] = array(
            'icon_class' => 'fa-yelp',
            'title'      => 'Yelp'
        );
        return $icons;
    }
}

At the last step, please add this code into Appearance >> Advanced >> Custom CSS to change the icon's background. Alternatively, adding code in style.css file in your-folder\wp-content\themes\your-theme-child folder is a advanced method.

#site-header #headerbar .social-links a i.fa-yelp {
    background: #C41200;
}