monakh2
3/17/2020 - 6:01 AM

Add a custom icon library to the icon element WPBakery

<?php
// Add new custom font to Font Family selection in icon box module
	function knm_add_new_icon_set_to_iconbox() {

		$param                                         = WPBMap::getParam( 'vc_icon', 'type' );
		$param['value'][ __( 'Dali-icons', 'total' ) ] = 'dali';
		vc_update_shortcode_param( 'vc_icon', $param );
	}

	add_filter( 'init', 'knm_add_new_icon_set_to_iconbox', 40 );

// Add font picker setting to icon box module when you select your font family from the dropdown
	function knm_add_font_picker() {
		vc_add_param( 'vc_icon', array(
				'type'       => 'iconpicker',
				'heading'    => esc_html__( 'Icon', 'total' ),
				'param_name' => 'icon_dali',
				'settings'   => array(
					'emptyIcon'    => true,
					'type'         => 'dali',
					'iconsPerPage' => 200,
				),
				'dependency' => array(
					'element' => 'type',
					'value'   => 'dali',
				),
			)
		);
	}

	add_filter( 'vc_after_init', 'knm_add_font_picker', 40 );

// Add array of your fonts so they can be displayed in the font selector
	function knm_icon_array() {
		return array(
			array( 'icon icon-hands' => 'hands' ),
			array( 'icon icon-woman-haircat' => 'woman-haircat' ),
			array( 'icon icon-man-haircat' => 'man-haircat' ),
			array( 'icon icon-woman1' => 'woman1' ),
			array( 'icon icon-check' => 'check' ),
			array( 'icon icon-man-haircat-1' => 'man-haircat-1' ),
			array( 'icon icon-man-haircat-2' => 'man-haircat-2' ),
			array( 'icon icon-bear' => 'bear' ),
			array( 'icon icon-sprai' => 'sprai' ),
			array( 'icon icon-beautician' => 'beautician' ),
			array( 'icon icon-hand-cream' => 'hand-cream' ),
			array( 'icon icon-cream' => 'cream' ),
			array( 'icon icon-waxing' => 'waxing' ),
			array( 'icon icon-beautician_1' => 'beautician_1' ),
			array( 'icon icon-clipper' => 'clipper' ),
			array( 'icon icon-mark' => 'mark' ),
			array( 'icon icon-brash-bold' => 'brash-bold' ),
			array( 'icon icon-brash' => 'brash' ),
			array( 'icon icon-child' => 'child' ),
			array( 'icon icon-diamont' => 'diamont' ),
			array( 'icon icon-man' => 'man' ),
			array( 'icon icon-massage' => 'massage' ),
			array( 'icon icon-nail' => 'nail' ),
			array( 'icon icon-pen' => 'pen' ),
			array( 'icon icon-phone' => 'phone' ),
			array( 'icon icon-scissors' => 'scissors' ),
			array( 'icon icon-time' => 'time' ),
			array( 'icon icon-woman' => 'woman' ),
		);
	}

	add_filter( 'vc_iconpicker-type-dali', 'knm_icon_array' );


	/**
	 * Register Backend and Frontend CSS Styles
	 */
	add_action( 'vc_base_register_front_css', 'knm_vc_iconpicker_base_register_css' );
	add_action( 'vc_base_register_admin_css', 'knm_vc_iconpicker_base_register_css' );
	function knm_vc_iconpicker_base_register_css() {
		wp_register_style( 'dali', get_stylesheet_directory_uri() . '/assets/dali/style.css' );
	}

	/**
	 * Enqueue Backend and Frontend CSS Styles
	 */
	add_action( 'vc_backend_editor_enqueue_js_css', 'knm_vc_iconpicker_editor_jscss' );
	add_action( 'vc_frontend_editor_enqueue_js_css', 'knm_vc_iconpicker_editor_jscss' );
	function knm_vc_iconpicker_editor_jscss() {
		wp_enqueue_style( 'dali' );
	}

	/**
	 * Enqueue CSS in Frontend when it's used
	 */
	add_action( 'vc_enqueue_font_icon_element', 'knm_enqueue_font_dali' );
	function knm_enqueue_font_dali( $font ) {
		switch ( $font ) {
			case 'dali':
				wp_enqueue_style( 'dali' );
		}
	}