Phần hình ảnh tùy chỉnh trong Customizer

Vì vậy, tôi có Phần tùy chỉnh này trong Trình tùy chỉnh kiểm soát các Sản phẩm tính năng trên Trang chủ. Có tất cả đã đăng ký, nhưng vấn đề tôi gặp phải là khi khách hàng tải lên một trong những hình ảnh tính năng mà tôi không biết làm thế nào để cập nhật nó.

functions.php mã tôi đang làm việc với:

    // 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');

Tôi đã đặt 2 sản phẩm có cùng một hình ảnh mặc định nhưng khi tôi vào phần tùy biến và cập nhật Feature Product #2thì nó không cập nhật gì cả.

Tôi biết tôi cần thêm một số mã ở trang đầu bên trong <img>thẻ nhưng tôi không biết gì: /

Tôi có cảm giác rằng những gì tôi có ở trên là một cách dài hơi để làm mọi thứ nhưng đó là những gì tôi đã làm việc, nếu có một cách dễ dàng thì tôi sẽ đánh giá cao bạn chỉ cho tôi theo hướng đó :)

Tôi đánh giá cao sự giúp đỡ

Lưu ý bên : Trang nhất của tôi.php :

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

Vì vậy, tôi đã làm một số nghiên cứu về vấn đề này và tôi đã tìm thấy một giải pháp. Về cơ bản WordPress có tính năng tuyệt vời này, nơi bạn có thể gọi một cái gì đó được gọi là get_theme_modvì vậy những gì tôi thực sự đã làm là thêm get_theme_modvào bên trong của tôi <img> src.

Vì vậy, đây là những gì tôi đã thay đổi <img>thẻ của mình sau khi tìm hiểu về get_theme_mod:

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

Về cơ bản những gì nó đã làm là nó đã lấy $wp_customize->add_setting('customizer-setting-name')và sau đó xuất nội dung. Mặc dù tôi không tìm thấy cách nào để đặt một default-imagebên trong tùy biến nhưng khi tôi làm, tôi sẽ cập nhật bài viết này.

Đây là những gì customizer.phptập tin của tôi trông giống như bây giờ:

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');