theme customizer – Can wp.customize() receive multiple values for the first parameter?

I am trying to find a way to add multiple values for the first parameter of wp.customize. Here’s my function:

  wp.customize('_themename_accent_colour', (value) => {
    value.bind( (to) => {
      let inline_css = ``;
      let inline_css_obj = _themename('inline-css');
      for(let selector in inline_css_obj) {
        inline_css += `${selector} {`;
        for(let prop in inline_css_obj(selector)) {
          let val = inline_css_obj(selector)(prop);
          inline_css += `${prop}: ${wp.customize(val).get()}`;
        }
        inline_css += `}`;
      }
      $('#_themename-styles-inline-css').html(inline_css);
    })
  })

I have been trying to find a way to add multiple values to the first parameter(‘_themename_accent_colour’) without success though. When I say multiple values I mean something like this:

wp.customize('_themename_accent_colour, _themename_accent_colour', (value) => {

Any help would be appreciated.

Time consuming callbacks in customizer

I am having a custom state ex. ‘visibility-state’ which having values as true | false.

I am binding this state to all the settings and settings are in 1000+ numbers. SO when the state changes it is recalling all the states 1000+ times which seems to be a heavy process.

    var setActiveState = function () {
    // This is calling 1000+ times.
                            element.active.set( logic_to_toggle() );
    };

    // This is in the loop of all the controls.
    api.state('visibility-state').bind( setActiveState );

Is there any optimized way to remove all bound functions and set only for the expanded sections so controls under the expanded section would toggle only?

Customizer – binding jQuery created controls

I tried several plugins posted by Weston Ruter for jQuery created controls for the wp customizer. They work but are different from those created via PHP.
For example, controls created with PHP ( customizer.php ) respond normally to code in customize-controls.js or in customize-previews.js:

”’ api( ‘tzkmx_test_control’, function( value ){
value.bind( function( to ) {
var answer = to;
});});
”’
Controls created with jQuery do not respond to binding!
Does anyone know how to bind them?

SPFX Application customizer is not working after deployment

I have an custom application customizer. When I run gulp serve it is working fine. But after deployment it is not working. I have added element.xml. But don’t why is it not working?

theme development – wp.customize is undefined in customizer scripts

I have some scripts I am loading in the customizer like this:

add_action('customize_controls_enqueue_scripts', function() {
    wp_enqueue_script('jquery');
    wp_enqueue_script('json-editor', 'https://cdnjs.cloudflare.com/ajax/libs/jsoneditor/9.0.5/jsoneditor.min.js');
    wp_enqueue_style('json-editor', 'https://cdnjs.cloudflare.com/ajax/libs/jsoneditor/9.0.5/jsoneditor.min.css');
    wp_enqueue_script('wf-customizer', get_template_directory_uri() . '/assets/js/customizer.js');
    wp_localize_script('wf-customizer', 'conditions', $this->conditions);
});

In the wf-customizer script, I am trying to use this:

wp.customize.bind('ready', function() {
    //...
});

But I keep getting Cannot read property 'bind' of undefined in the JS console. Somehow, wp.customize is undefined for me.

customization – wordpress customizer – pass setting value into another control to live update dropdown choices

In the wordpress customizer script I am trying to pass the value from one setting into a custom control that displays taxonomies associated with the selected post type (1st control). –

        $wp_customize->add_control( new Tax_Dropdown_Control( $wp_customize, 'select_tax', array(
                'section'       => 'section_1',
                'label'         => __( 'Select Post Taxonomy', 'textdomain' ),
                'description'   => __( 'Select a taxonomy based on post type selected.', 'textdomain' ),
                'dropdown_args' => array(
                    'post_type' => $wp_customize->get_setting("select_post_type"), // here I need to pass the first setting's value
                ),
            ) ) );
    
     // custom controls related snippet
.....    
$dropdown_args = wp_parse_args( $this->dropdown_args, array(
                'post_type'          => 'post',
            ) );
    
            $dropdown_args('echo') = false;
            
            $taxonomies = get_object_taxonomies($dropdown_args);
            
    if  ($taxonomies) {
    echo '<select>';
      foreach ($taxonomies  as $taxonomy ) {
        echo '<option>'. $taxonomy. '</option>';
      }
      echo '</select>';
    } 
....

It would need to update the choices live when the select post type is changed. I’m not sure if maybe an active_callback can be used to recall the function with the updated variable?

theme customizer – wordpress Comments error

I am having a problem in my WordPress site, when I create a new post or update a post to my site automatically get 2-6 comment by my post(Author is post title and comment is post content).i have to delete manually those comments. i am getting this error almost 10 days.i thought it might be theme or plugin but i check all of them by disabling. but the same thing happens if i disabled all plugin and use another theme.

I am using the latest version of WordPress and my host is siteground.my theme is updated. i am using generatepress theme and also i changed the theme to check but the problem wasn’t resolved.i couldn’t find any solution and don’t have an idea why this is happing.plz if you can help me with this problem.

Add settings to menu items in the Customizer

WordPress 5.4 added the wp_nav_menu_item_custom_fields_customize_template hook to add custom fields to the Nav Menu Item settings in the customizer. I’ve figured out how to display the additional fields I would like to add (As part of my Nav Menu Roles plugin), with the following snippet:

/**
* Display the fields in the Customizer.
*/
function kia_customizer_custom_fields() { 

    global $wp_roles;

    /**
    * Pass the menu item to the filter function.
    * This change is suggested as it allows the use of information from the menu item (and
    * by extension the target object) to further customize what filters appear during menu
    * construction.
    */
    $display_roles = apply_filters( 'nav_menu_roles', $wp_roles->role_names );

    if( ! $display_roles ) return;

    ?>
    <p class="field-nav_menu_logged_in_out nav_menu_logged_in_out nav_menu_logged_in_out-thin">
        <fieldset>
            <legend><?php _e( 'Display Mode', 'nav-menu-roles' ); ?></legend>

            <label for="edit-menu-item-role_logged_in-{{ data.menu_item_id }}">
                <input type="radio" id="edit-menu-item-role_logged_in-{{ data.menu_item_id }}" class="edit-menu-item-logged_in_out" value="in" name="menu-item-role_logged_in" />
                    <?php _e( 'Logged In Users', 'nav-menu-roles' ); ?><br/>
            </label>
            <label for="edit-menu-item-role_logged_out-{{ data.menu_item_id }}">
                <input type="radio" id="edit-menu-item-role_logged_out-{{ data.menu_item_id }}" class="edit-menu-item-logged_in_out" value="out" name="menu-item-role_logged_out" />
                    <?php _e( 'Logged Out Users', 'nav-menu-roles' ); ?><br/>
            </label>
            <label for="edit-menu-item-role_everyone-{{ data.menu_item_id }}">
                <input type="radio" id="edit-menu-item-role_everyone-{{ data.menu_item_id }}" class="edit-menu-item-logged_in_out" value="" name="menu-item-role_everyone" />
                    <?php _e( 'Everyone', 'nav-menu-roles' ); ?><br/>
            </label>

        </fieldset>
    </p>
    <p class="field-nav_menu_roles nav_menu_roles nav_menu_roles-thin">
        <fieldset class="roles">
            <legend><?php _e( 'Restrict menu item to a minimum role', 'nav-menu-roles' ); ?></legend>

            <?php

            /* Loop through each of the available roles. */
            foreach ( $display_roles as $role => $name ) : ?>
               
               <label for="edit-menu-item-role_<?php echo $role; ?>-{{ data.menu_item_id }}">
                    <input type="checkbox" id="edit-menu-item-role_<?php echo esc_attr( $role ); ?>-{{ data.menu_item_id }}" class="edit-menu-item-role" value="<?php echo esc_attr( $role ); ?>" name="menu-item-role_<?php echo esc_attr( $role ); ?>" />
                        <?php echo esc_html( $name ); ?><br/>
                </label>

            <?php endforeach; ?>

        </fieldset>
    </p>
    <?php
}
add_action( 'wp_nav_menu_item_custom_fields_customize_template', 'kia_customizer_custom_fields' );

but I’m not sure how to add any data as the default fields are all getting data from some Javascript templating.

For example the description’s value is {{ data.description }}.

It looks like the data is being added in the WP_Customize_Manager class and that the data is fetched from each setting’s json() method, which has no filters to modify the result.

If I’m tracing it back correctly, the json() method tries to get the values from the WP_Customize_Nav_Menu_Item_Setting class which also has no filter for adding custom data.

So, I’m trying to track down how to 1. pass some additional properties to data and 2. set the radio and checkbox values when loaded in the Customizer.

WordPress Customizer screenshot for a menu item named "My Shop" and showing radio buttons for "Display mode" and checkboxes for "restrict menu item to minimum role"

Cannot Get Customizer To Display Custom Sections

I have been working on this for a while now and just can’t seem to get my custom section to display in my Customizer. I just need a few basic settings and controls to run on my site, but it’s not happening with the below code:

<?php

//* Add custom sections and settings to the Admin Customizer
class UWM_Customizer {
    
    public function _construct() {
        add_action('customize_register', array($this, 'register_customize_sections'));
        }
        
        public function register_customize_sections ($wp_customize) {
            //Initialize section
            $this->homepage_image_section($wp_customize); 
        }
        
        //Homepage Image Selection
        private function homepage_image_section($wp_customize) {
            
            //New panel 
            $wp_customize->add_section('basic-homepage-image-section', array(
                'title' => 'Main Image',
                'description' => _('This is where you will add in the main image of the site')
                ) );
                
            //Add Homepage Image
            $wp_customize->add_setting('basic-main-homepage-image', array(
                'default' => '',
                'type' => 'theme_mod',
                'capability' => 'edit_theme_options'));
            
            $wp_customize->add_control(new WP_Customize_Cropped_Image_Control(wp_customize, 'basic-main-homepage-image-control', array(
                'label' => 'Image',
                'section' => 'homepage_image_section',
                'settings' => 'basic-main-homepage-image',
                'width' => 2500,
                'height' => 999,
                
                ) ));
            
        }
            
    
}

Any help you could offer would be greatly appreciated.

theme development – How to dynamically set a background image with the customizer without putting the css as an inline-style

Here is what I am using currently,

<div class="home-header" style="background-image:url('<?php echo get_theme_mod( 'home-header-img' ); ?>'); height: 500px; width: 100%; display: flex; justify-content: center; align-items: center; background-repeat: no-repeat">

I have the background-image being set by the customizer and it’s working great however I am unable to have inline styles due to the ThemeForest theme standards. What should I be doing here? or is there a better way to go out this? thanks