WordPress定製程序隱藏背景圖像複選框

Question

我試圖添加複選框到定製程序以「顯示背景圖像」。如果未選中，則應將background-image：none設置爲該元素。我看不到我要去哪裏錯了。

這是我在我的customizer.php文件

// Background Image   
$wp_customize->add_setting('background_image', array(
    'default'   => get_template_directory_uri() . '/images/default.jpg', 
    'transport'   => 'postMessage' 
));  
$wp_customize->add_control(new WP_Customize_Image_Control($wp_customize, 'background_image', array(
    'label'    => __('Background Image', 'minitheme'), 
    'settings'   => 'background_image' 
))); 

// Display Background Image 
$wp_customize->add_setting('display_background_image', array(
    'default'   => true, 
    'transport'   => 'postMessage' 
)); 
$wp_customize->add_control('display_background_image', array(
    'label'    => __('Display Background Image', 'minitheme'), 
    'type'    => 'checkbox' 
)); 

... 

public static function header_output() { 
    ?> 
    <!--Customizer CSS--> 
    <style type="text/css"> 
     <?php self::generate_css('#header', 'background-image', 'slide_1_background_image'); ?> 
     #slide-1 {display: <?php 
      $display = get_theme_mod('display_slide_1_background_image', '1'); 
      if ('false') {echo 'none';} 
     ?>; } 
    </style> 
    <!--/Customizer CSS--> 
    <?php 
} 

這是我在相應customizer.js文件中的代碼：

// Background Image 
wp.customize('background_image', function(value) { 
    value.bind(function(newval) { 
     $('#slide-1').css('background-image', 'url("' + newval + '")'); 
    }); 
}); 

// Display Background Image 
wp.customize('display_background_image', function(value) { 
    value.bind(function(to) { 
     if (false === to) { 
      $('#header').css('background-image', 'none'); 
     } 
    }); 
}); 

Answer 1

嘗試去除'的缺省值background_image'設置。