Secțiune personalizată de imagini în Customizer

Question

Secțiune personalizată de imagini în Customizer

26 ian. 2016, 13:52:11

Vizualizări: 17.3K

Voturi: 9

Am această secțiune personalizată în Customizer care controlează produsele recomandate pe pagina principală. Totul este înregistrat corect, dar problema la care m-am blocat este că atunci când clientul încarcă una dintre imaginile recomandate, nu știu cum să o fac să se actualizeze.

functions.php codul cu care lucrez:

    // Personalizator
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'           => __('Produse Recomandate', 'themeRemax'),
        'description'     => __('Cele 5 imagini recomandate pe pagina principală.'), 
        'priority'        => 70,
        'active_callback' => 'is_front_page',
    ));

    $wp_customize->add_control( new WP_Customize_Image_Control( $wp_customize, 'feature_product_one_control', array(
        'label' => __('Produs Recomandat #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' => __('Produs Recomandat #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' => __('Produs Recomandat #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' => __('Produs Recomandat #4', 'themeRemax'),
        'section' => 'feature_images',
        'settings' => 'feature_product_four',
    )));     

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

Am setat cele 2 produse să aibă aceeași imagine implicită, dar când intru în customizer și actualizez Produs Recomandat #2, nu se actualizează deloc.

Știu că trebuie să adaug ceva cod în front-page în interiorul tag-ului <img> dar nu știu exact ce :/

Am senzația că ceea ce am făcut mai sus este o metodă prea complicată de a face lucrurile, dar este ceea ce am reușit să fac să funcționeze. Dacă există o metodă mai simplă, aș aprecia să mi-o arătați :)

Apreciez orice ajutor

Notă laterală: front-page.php-ul meu:

<div class="featureImg">
    <img src="Ce pun aici?" alt="Produs 1">
    <img src="Ce pun aici?" alt="Produs 1">
</div>

Stephen

1.3K

dezvoltare teme personalizator tema

Toate răspunsurile la întrebare

Stephen 1.3K · Accepted Answer · 2016-01-26T14:00:50Z

Așa că am făcut niște cercetări pe această temă și am găsit o soluție. Practic WordPress are această funcționalitate interesantă unde poți apela ceva numit get_theme_mod, așa că în esență am adăugat get_theme_mod în interiorul atributului <img> src.

Deci iată cum am modificat tag-ul meu <img> după ce am aflat despre get_theme_mod:

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

Practic, acest cod a preluat setarea $wp_customize->add_setting('customizer-setting-name') și apoi a afișat conținutul. Deși încă nu am găsit o metodă de a adăuga o imagine-implicită în interiorul customizer-ului, dar când o voi face voi actualiza acest post.

Iată cum arată acum fișierul meu customizer.php:

function themeName_customize_register( $wp_customize ) {

    // Adăugare Setări
    $wp_customize->add_setting('customizer_setting_one', array(
        'transport'         => 'refresh',
        'height'         => 325,
    ));
    $wp_customize->add_setting('customizer_setting_two', array(
        'transport'         => 'refresh',
        'height'         => 325,
    ));

    // Adăugare Secțiune
    $wp_customize->add_section('slideshow', array(
        'title'             => __('Imagini Slider', 'name-theme'), 
        'priority'          => 70,
    ));    

    // Adăugare Controale
    $wp_customize->add_control( new WP_Customize_Image_Control( $wp_customize, 'customizer_setting_one_control', array(
        'label'             => __('Imagine Slider #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'             => __('Imagine Slider #2', 'name-theme'),
        'section'           => 'slideshow',
        'settings'          => 'customizer_setting_two',
    )));    
}
add_action('customize_register', 'themeName_customize_register');