WordPress : Obtenir la largeur de l’image à partir de l’ensemble de fichiers WP_Customize_Image_Control() dans le personnalisateur de thème WP

Voici le code que nous utilisons pour définir un fichier image comme option pour le logo du site via le personnalisateur de thème WordPress :

/* Logo > Image
-------------------------------------------------- */
$wp_customize->add_setting( 'themeslug_logo' );

$wp_customize->add_control(
    new WP_Customize_Image_Control(
        $wp_customize, 'themeslug_logo', array(
            'label'    => __( 'Logo', 'themeslug', 'themeslug' ),
            'section'  => 'themeslug_header',
            'settings' => 'themeslug_logo',
            'description' => 'Upload a logo to replace the default site name in the header.',
        )
    )
);

En conséquence, nous affichons le logo comme ceci :

<img src='<?php echo esc_url( get_theme_mod( 'themeslug_logo' ) ); ?>' alt='<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?> Logo' class="img-responsive">

Cependant, ce faisant, nous avons réalisé que nous ne définissions pas les attributs de hauteur/largeur de l’image.

Donc, ce que nous voulons accomplir, c’est extraire la hauteur/largeur de l’image du fichier multimédia téléchargé, les stocker en tant que variable, puis les exécuter, comme :

<?php
    $logo = get_theme_mod( 'themeslug_logo' );
    $logoatts = wp_get_attachment_metadata($logo); // obviously doesn't work
    $logoheight = ; // don't know how to get this
    $logowidth = ; // don't know how to get this
?>
<img
    src='<?php echo esc_url( get_theme_mod( 'themeslug_logo' ) ); ?>'
    alt='<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?> Logo'
    class="img-responsive"
    height="<?php echo($logoheight);?>"
    width="<?php echo($logowidth);?>"
>

Essentiellement, là où nous rencontrons des problèmes, c’est : nous voulons obtenir la largeur de l’image à partir du fichier telle que définie par WP_Customize_Image_Control() au lieu de simplement l’URL.

Merci d’avance

Solution n°1 trouvée

OK, eh bien, nous avons trouvé une solution rapide et peut-être un peu sale en utilisant la fonction getimagesize() de PHP.

Plus précisément, voici le code :

<?php if ( get_theme_mod( 'themeslug_logo' ) ) :
    $themelogo = get_theme_mod( 'themeslug_logo' );
    $themelogo_size = getimagesize($themelogo);
    $themelogo_width = $themelogo_size[0];
    $themelogo_height = $themelogo_size[1];
?>
<img src='<?php echo esc_url( get_theme_mod( 'themeslug_logo' ) ); ?>' alt='<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?> Logo' class="img-responsive full" height="<?php echo($themelogo_height);?>" width="<?php echo($themelogo_width);?>">

Je ne sais pas si c’est la meilleure méthode ou non, donc si quelqu’un d’autre a une idée brillante, j’aimerais l’entendre !

Solution n°2 trouvée

Réponse moderne à cette question :

Nous avons WP_Customize_Media_Controlle contrôle dans WP depuis la version 4.2 qui vous donne l’identifiant de la pièce jointe.

Cette réponse a été publiée sur une question similaire. Vous pouvez voir la documentation WP_Customize_Media_Controlici.

Exemple d’utilisation :

$wp_customize->add_setting( 'my_menu_image' );
        $wp_customize->add_control( new WP_Customize_Media_Control(
            $wp_customize,
            'storms_menu_image_ctrl',
            array(
                'priority'    => 10,
                'mime_type'   => 'image',
                'settings'    => 'my_menu_image',
                'label'       => __( 'Image on menu bar', 'my' ),
                'section'     => 'title_tagline',
            )
        ) );

Lors de la récupération des informations, vous pouvez procéder comme suit :

$image_id = get_theme_mod( "my_menu_image" );
if ( ! empty( $image_id ) ) {
    $url          = esc_url_raw( wp_get_attachment_url( $image_id ) );
    $image_data  = wp_get_attachment_metadata( $image_id );
    $width = $image_data['width'];
    $height = $image_data['height'];
}

Solution n°3 trouvée

La réponse ci-dessus est certainement la meilleure pour obtenir des tailles d’image via la personnalisation, voici quelques informations supplémentaires.

    // Add your customizer block
    $wp_customize->add_setting(
        'logo'
    );

    $wp_customize->add_control(
        new WP_Customize_Media_Control(
            $wp_customize,
            'logo',
            array(
                'label'    => __('Logo', 'theme'),
                'section'  => 'styles',
                'settings' => 'logo',
            )
        )
    );

    // Add your image size to your function.php file
    add_image_size('logo_image_size', 100, 9999, false);

    // Output your media anywhere in your theme
    $logo = get_theme_mod( "logo" );

    if ( !empty($logo) ) {

        echo wp_get_attachment_image( $logo, 'logo_image_size' ) ;

    }