Customizer中的“自定义图像”部分


9

因此,我在定制器中有此定制部分,用于控制主页上的功能产品。所有这些都已注册,依此类推,但我遇到的问题是客户端上载我不知道如何进行更新的功能图片之一。

我正在使用的functions.php代码:

    // Customiser
function themeName_customize_register( $wp_customize ) {
    $wp_customize->add_setting('feature_product_one', array(
        'default-image' => get_template_directory_uri() . '/assest/imgs/featureProducts/product1.png',
        'transport'     => 'refresh',
        'height'        => 180,
        'width'        => 160,
    ));

    $wp_customize->add_setting('feature_product_two', array(
        'default-image' => get_template_directory_uri() . '/assest/imgs/featureProducts/product1.png',
        'transport'     => 'refresh',
        'height'        => 180,
        'width'        => 160,
    ));

    $wp_customize->add_setting('feature_product_three', array(
        'default-image' => get_template_directory_uri() . '/assest/imgs/featureProducts/product1.png',
        'transport'     => 'refresh',
        'height'        => 180,
        'width'        => 160,
    ));

    $wp_customize->add_setting('feature_product_four', array(
        'default-image' => get_template_directory_uri() . '/assest/imgs/featureProducts/product1.png',
        'transport'     => 'refresh',
        'height'        => 180,
        'width'        => 160,
    ));

    $wp_customize->add_section('feature_images', array(
        'title'           => __('Featured Products', 'themeRemax'),
        'description'     => __('Your 5 Feature Images on the Home-Page.'), 
        'priority'        => 70,
        'active_callback' => 'is_front_page',
    ));

    $wp_customize->add_control( new WP_Customize_Image_Control( $wp_customize, 'feature_product_one_control', array(
        'label' => __('Feature Product #1', 'themeRemax'),
        'section' => 'feature_images',
        'settings' => 'feature_product_one',
    )));

    $wp_customize->add_control( new WP_Customize_Image_Control( $wp_customize, 'feature_product_two_control', array(
        'label' => __('Feature Product #2', 'themeRemax'),
        'section' => 'feature_images',
        'settings' => 'feature_product_two',
    )));  

    $wp_customize->add_control( new WP_Customize_Image_Control( $wp_customize, 'feature_product_three_control', array(
        'label' => __('Feature Product #3', 'themeRemax'),
        'section' => 'feature_images',
        'settings' => 'feature_product_three',
    )));

    $wp_customize->add_control( new WP_Customize_Image_Control( $wp_customize, 'feature_product_four_control', array(
        'label' => __('Feature Product #4', 'themeRemax'),
        'section' => 'feature_images',
        'settings' => 'feature_product_four',
    )));     

}
add_action('customize_register', 'themeName_customize_register');

我将这两个产品设置为具有相同的默认图像,但是当我进入定制器并进行更新时,Feature Product #2它根本不会更新。

我知道我需要在<img>标签的首页添加一些代码,但是我不知道什么:/

我有一种感觉,就是上面我做的事情很漫长,但这是我正在做的事情,如果有一种简单的方法,那么我将不胜感激您将我指向这个方向:)

感谢您的帮助

旁注:我的前page.php文件

<div class="featureImg">
    <img src="What goes here?" alt="Product 1">
    <img src="What goes here?" alt="Product 1">
</div>

Answers:


11

因此,我对此事进行了一些研究,找到了解决方案。基本上WordPress具有这个很酷的功能,您可以调用一个叫做的东西,get_theme_mod因此我所做的基本上是get_theme_mod在我的<img> src

所以这是我<img>发现以下内容后将其更改为的标签get_theme_mod

<img src="<?php echo esc_url( get_theme_mod( 'customizer-option-name' ) ); ?>" alt="Product 1">

基本上,这样做是先获取$wp_customize->add_setting('customizer-setting-name')内容,然后输出内容。虽然我还没有找到default-image在定制工具中放一个的方法,但是当我这样做的时候我会更新这篇文章。

这是我的customizer.php文件现在的样子:

function themeName_customize_register( $wp_customize ) {

    // Add Settings
    $wp_customize->add_setting('customizer_setting_one', array(
        'transport'         => 'refresh',
        'height'         => 325,
    ));
    $wp_customize->add_setting('customizer_setting_two', array(
        'transport'         => 'refresh',
        'height'         => 325,
    ));

    // Add Section
    $wp_customize->add_section('slideshow', array(
        'title'             => __('Slider Images', 'name-theme'), 
        'priority'          => 70,
    ));    

    // Add Controls
    $wp_customize->add_control( new WP_Customize_Image_Control( $wp_customize, 'customizer_setting_one_control', array(
        'label'             => __('Slider Image #1', 'name-theme'),
        'section'           => 'slideshow',
        'settings'          => 'customizer_setting_one',    
    )));
    $wp_customize->add_control( new WP_Customize_Image_Control( $wp_customize, 'customizer_setting_two_control', array(
        'label'             => __('Slider Image #2', 'name-theme'),
        'section'           => 'slideshow',
        'settings'          => 'customizer_setting_two',
    )));    
}
add_action('customize_register', 'themeName_customize_register');
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.