TransWikia.com

WordPress Customizer Help with FontAwesome Icon

WordPress Development Asked by Ashiquzzaman Kiron on December 24, 2021

Here’s the scenario – I want to select fontawesome icons from the dropdown list but it’s not working. For some reason the class inside span is not adding up (I have tried jQuery().append(), CSS) but so far no luck. ANY help would be appreciated.

Code in Page.php file

<div class="features-block-one">
  <div class="icon-one">
   <span class="<?php get_theme_mod('features_one_icon' ,'fa fa-bullseye');?>">  </span>
  </div>
</div>

Code in Customizer file

//block one icon
       $wp_customize->add_setting(
        'features_one_icon',
        array(
            'default' => 'fa-fa box',
            'transport' => 'postMessage',
            'sanitize_callback' => 'sanitize_key',
        )
    );

    $wp_customize->add_control(
        'features_one_icon_control',
         array(
            'label' => __('Select Icon', 'text-domain'),
            'section' => 'features_block',
            'type' => 'select',
            'settings' => 'features_one_icon',
            'choices' => tar_icons() /*With function tar_icons() I'm pulling all the icons from the function */
        )
    );

Code in customizer.js file

wp.customize( 'features_one_icon', function( value ) {
        value.bind( function( to ) {
            $( '.features-block-one .icon-one span' ).css( to  );
          } );
    } );

enter image description here

2 Answers

You have missed "echo". Use the code below. Should work.

<span class="<?php echo get_theme_mod('features_one_icon' ,'fa fa-bullseye');?>">  </span>

Answered by user1503662 on December 24, 2021

I think You have error on default value for setting, You write 'default' => 'fa-fa box'

instead 'fa fa-box'.

I can't find box icon on fontAwesome too.

Answered by easyScript on December 24, 2021

Add your own answers!

Ask a Question

Get help from others!

© 2024 TransWikia.com. All rights reserved. Sites we Love: PCI Database, UKBizDB, Menu Kuliner, Sharing RPP