How to use fontawesome in param visual composer? - font-awesome

Question

I code element with visual composer. I want to use fontawesome in element.
Code here show list font-awesome in param visual composer
<code>
array(
'type' => 'iconpicker',
'heading' => esc_html__('Fontawesome', 'interior'),
'param_name' => 'fontawesome_icon',
'settings' => array(
'type' => 'fontawesome'
),
'description' => esc_html__( 'Fontawesome list. Pickup your choice.', 'interior'
),
'dependency' => array(
'element' => 'icon_type',
'value' => array( 'fontawesome-icon' )
)
</code>
I showed list icon in element but i chosen it don't saved and i don't know get value font-awsome display html.
Help me!!!

Answer 1

I have made a code only for Font Awesome Icon... You can try this
below code. it's tested and definitely works. here I have used
"Facebook" in title...Let me know via comment if you found any issue
in code or having any trouble for this.
<?php
if ( ! defined( 'ABSPATH' ) ) exit;
if( !class_exists( 'RN_FA_Icon_list' ) ) {
class RN_FA_Icon_list {
private $shortcode;
function __construct() {
/* shortcode base */
$this->shortcode = 'rn_fa_icon_list';
add_action( 'init', array( $this, 'rn_map_shortcode' ) );
add_shortcode( $this->shortcode, array( $this, 'rn_create_shortcode' ) );
}
function rn_map_shortcode( $atts, $content = NULL ) {
if( function_exists( 'vc_map' ) ) {
vc_map(
array(
'name' => esc_html__( 'Font Awesome Icon', 'rn_shortcodes' ),
//'icon' => RN_SHORTCODES_URL . '/admin/img/vc_icons/fancy-list.png',
'base' => $this->shortcode,
'category' => 'Structual',
'class' => 'rn-vc-icon-module rn-structual-module',
'content_element' => true,
'params' => array(
array(
'type' => 'textfield',
'heading' => esc_html__( 'Description', 'rn_shortcodes' ),
'description' => esc_html__( 'Only for internal use. This adds a label to Visual Composer for an easier element identification.', 'rn_shortcodes' ),
'param_name' => 'list_description',
'admin_label' => true,
'group' => 'General'
),
array(
'type' => 'iconpicker',
'heading' => __( 'Icon', 'js_composer' ),
'param_name' => 'icon_fontawesome',
'value' => 'fa fa-adjust',
'group' => 'General',
'settings' => array(
'emptyIcon' => false,
'type' => 'fontawesome',
'iconsPerPage' => 4000,
),
'dependency' => array(
'element' => 'type',
'value' => 'fontawesome',
),
'description' => __( 'Select icon from library.', 'js_composer' ),
),
array(
'type' => 'css_editor',
'param_name' => 'css',
'group' => esc_html__( 'Design Options', 'rn_shortcodes' ),
),
)
)
); /* end mapping */
}
}
function rn_create_shortcode( $atts, $content = NULL ) {
extract( shortcode_atts( array (
'icon_fontawesome' => '',
'css' => ''
), $atts ) );
/* extract list items */
if( function_exists('vc_param_group_parse_atts') && !empty( $values ) ) {
$values = vc_param_group_parse_atts( $values );
}
/* unique listz ID */
$id = uniqid("rn_fa_");
$output = '';
$output .= '<div id="' . esc_attr( $id ) . '">';
$output .= '<i class="' . $icon_fontawesome . '"></i> Facebook';
$output .= '</div>';
return '<div class="wpb_content_element ' . apply_filters( VC_SHORTCODE_CUSTOM_CSS_FILTER_TAG, vc_shortcode_custom_css_class( $css, ' ' ), $this->shortcode, $atts ) . '">' . $output . '</div>';
}
}
}
new RN_FA_Icon_list;
?>