Section Image personnalisée dans Customizer


9

J'ai donc cette section personnalisée dans le personnalisateur qui contrôle les produits de fonctionnalité sur la page d'accueil. Il y a tout enregistré et ainsi de suite, mais le problème sur lequel je suis bloqué est lorsque le client télécharge l'une des images de fonctionnalité, je ne sais pas comment la mettre à jour.

code functions.php avec lequel je travaille:

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

J'ai défini les 2 produits pour avoir la même image par défaut, mais lorsque je vais dans le personnalisateur et que je le mets à jour, Feature Product #2il ne se met pas à jour du tout.

Je sais que je dois ajouter du code dans la première page à l'intérieur de la <img>balise mais je ne sais pas quoi: /

J'ai le sentiment que ce que j'ai ci-dessus est un moyen de faire des choses de longue haleine, mais c'est ce que j'ai travaillé, s'il y a un moyen facile, alors j'apprécierais que vous me dirigiez dans cette direction :)

J'apprécie toute aide

Note latérale : Mon front-page.php :

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

Réponses:


11

J'ai donc fait quelques recherches sur la question et j'ai trouvé une solution. Fondamentalement, WordPress a cette fonctionnalité intéressante où vous pouvez appeler quelque chose appelé get_theme_moddonc ce que j'ai essentiellement fait était d'ajouter get_theme_moddans mon <img> src.

Voici donc ce que j'ai changé mon <img>tag après avoir découvert get_theme_mod:

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

Fondamentalement, cela a récupéré $wp_customize->add_setting('customizer-setting-name')le contenu, puis l'a généré. Bien que default-imageje n'aie pas encore trouvé de moyen de mettre un dans le personnalisateur, mais quand je le ferai, je mettrai à jour ce message.

Voici à quoi customizer.phpressemble mon fichier maintenant:

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');
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.