web-dev-qa-db-fra.com

Personnalisation du thème Image d'arrière-plan/en-tête personnalisée

Je travaille sur un thème avec des options pour changer le design. Pour les options, j'utilise le personnalisateur de thème. Avec le personnalisateur de thème, il existe de nombreux types d'options comme la couleur, le téléchargement, le téléchargement d'image, l'image d'arrière-plan et l'image d'en-tête. J'ajoute le contrôle d'image d'arrière-plan avec ce code:

function tcx_register_theme_customizer( $wp_customize ) {
    $wp_customize->add_section(
            'tcx_advanced_options',
            array(
                    'title'     => 'Advanced Options',
                    'priority'  => 201
            )
    );

    $wp_customize->add_setting(
            'tcx_background_image',
            array(
                'default'      => '',
                'transport'    => 'postMessage'
            )
    );

    $wp_customize->add_control(
            new WP_Customize_Background_Image_Control(
                    $wp_customize,
                    'tcx_background_image',
                    array(
                        'label'    => 'Background Image',
                        'settings' => 'tcx_background_image',
                        'section'  => 'tcx_advanced_options'
                    )
            )
    );
}
add_action( 'customize_register', 'tcx_register_theme_customizer' );

mais le contrôle ne sera pas affiché dans le personnalisateur de thème. La même chose avec l'image d'en-tête. "Image Upload", "Upload" et tous les autres types tels que "texte", radio, etc. fonctionnent correctement. Je ne veux pas l'utiliser avec add_theme_support parce que je ne veux pas les entrées de menu de la section "Conception" car cela peut être déroutant pour le client. (Sry pour mon mauvais anglais :))

Mise à jour: c'est le code que j'utilise. Nouvelle section, nouveau paramètre et contrôle de l’image d’arrière-plan intégrée à Wordpress.

theme-customizer
2
Markus Schober

Voici un code que j'utilise qui place un contrôle dans la section Titre et slogans pour ajouter une image de logo.

$wp_customize->add_setting( 'theme_logo' );
$wp_customize->add_control( 
    new WP_Customize_Image_Control(
        $wp_customize,'theme_logo',array(
            'label' => 'Logo',
            'section' => 'title_tagline',
            'settings' => 'theme_logo',
            'priority' => 1
        )
    )
);

Je l'appelle ensuite dans header.php avec ce bit ..

<?php if( get_theme_mod( 'theme_logo' ) != '') { ?> // if there is a logo img
    <img src="<?php echo get_theme_mod('tonic_logo'); ?>">
<?php } ?>

Pour une image de fond, vous pouvez utiliser exactement la même chose que le logo.

$wp_customize->add_setting( 'theme_header_bg' );
$wp_customize->add_control( 
    new WP_Customize_Image_Control(
        $wp_customize,'theme_header_bg',array(
            'label' => 'Header Background Image',
            'section' => 'title_tagline',
            'settings' => 'theme_header_bg',
            'priority' => 2
        )
    )
);

Nous avons tout configuré, de la même manière que l’autre image (le logo). En ce qui concerne header.php, nous l'appelons simplement un peu différent, de sorte qu'il apparaît comme arrière-plan plutôt que comme un img.

<?php 
    if( get_theme_mod( 'theme_header_bg' ) != '') { // if there is a background img
        $theme_header_bg = get_theme_mod('theme_header_bg'); // Assigning it to a variable to keep the markup clean
    }
?>

<header style="background-image:url('<?php echo $theme_header_bg ?>');">
3
davidcondrey