Abschnitt "Benutzerdefiniertes Bild" im Customizer

Ich habe also diesen benutzerdefinierten Abschnitt im Customizer, der die Feature-Produkte auf der Startseite steuert. Dort sind alle registriert und so weiter, aber das Problem, an dem ich festhalte, ist, wenn der Client eines der Feature-Images hochlädt, von denen ich nicht weiß, wie ich es aktualisieren soll.

functions.php code Ich arbeite mit:

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

Ich habe die beiden Produkte so eingestellt, dass sie dasselbe Standard-Image haben, aber wenn ich in den Customizer gehe und ihn aktualisiere, wird Feature Product #2er überhaupt nicht aktualisiert.

Ich weiß, dass ich auf der Startseite des <img>Tags Code hinzufügen muss, aber ich weiß nicht, was: /

Ich habe das Gefühl, dass das, was ich oben habe, eine langwierige Art ist, Dinge zu tun, aber es ist das, was ich zum Arbeiten gebracht habe. Wenn es einen einfachen Weg gibt, würde ich es begrüßen, wenn Sie mich in diese Richtung weisen :)

Ich freue mich über jede Hilfe

Side Hinweis : My Front-page.php :

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

Also habe ich einige Nachforschungen angestellt und eine Lösung gefunden. Grundsätzlich hat WordPress diese coole Funktion, mit der Sie etwas nennen können, das so genannt wird, get_theme_modalso habe ich im Wesentlichen get_theme_modin meinem hinzugefügt <img> src.

Das habe ich also geändert <img>, nachdem ich Folgendes herausgefunden hatte get_theme_mod:

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

Im Grunde genommen wurde $wp_customize->add_setting('customizer-setting-name')der Inhalt abgerufen und dann ausgegeben. Ich habe zwar noch keine Möglichkeit gefunden, einen default-imagein den Customizer einzufügen, aber wenn ich das tue, werde ich diesen Beitrag aktualisieren.

So customizer.phpsieht meine Datei jetzt aus:

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