Comment utiliser l'API de logo personnalisé WordPress personnalisé

Cet article explique comment utiliser la fonction de logo personnalisée WordPress, introduit dans WordPress 4.5, pour modifier facilement le logo d'un site Web. Il couvre à la fois la perspective utilisateur et la perspective du développeur.

Caractéristiques de clé:

• La fonction de logo personnalisée simplifie les modifications du logo via le personnalisateur de thème.
• Les développeurs permettent à cette fonctionnalité en utilisant add_theme_support('custom-logo') dans le fichier functions.php de leur thème.
• La taille du logo est contrôlée à l'aide de add_image_size() et spécifiant la taille de la déclaration de support du thème. WordPress maintient le rapport d'aspect d'origine pendant le redimensionnement.
• les fonctions the_custom_logo(), get_custom_logo() et has_custom_logo() Gérer l'affichage et la récupération du logo.

Personnalisation côté utilisateur:

Les utilisateurs peuvent facilement modifier le logo de leur site Web via le personnalisateur de thème (accessible via le menu d'apparence dans le tableau de bord WordPress). Le panneau "Identité du site" contient la section "logo", où les utilisateurs peuvent sélectionner ou télécharger un nouveau logo. Le personnalisateur fournit un aperçu en direct des modifications avant d'économiser.

Après avoir sélectionné un logo, le personnalisateur affiche le logo avec des options pour le supprimer ou la modifier.

Implémentation côté développeur:

Les thèmes

doivent activer explicitement la fonction de logo personnalisée. Cela se fait en ajoutant le code suivant au fichier functions.php du thème:

function mytheme_setup() {
    add_theme_support('custom-logo');
}
add_action('after_setup_theme', 'mytheme_setup');

Contrôle de la taille du logo:

Les développeurs peuvent contrôler la taille du logo à l'aide de add_image_size() et spécifier la taille dans la fonction add_theme_support():

add_image_size('mytheme-logo', 160, 90);
add_theme_support('custom-logo', array(
    'size' => 'mytheme-logo'
));

Cela garantit que le logo s'inscrit dans les dimensions spécifiées tout en préservant son rapport d'aspect.

Affichage du logo personnalisé:

La fonction the_custom_logo() affiche le logo avec un HTML approprié. get_custom_logo() récupère le code HTML, et has_custom_logo() vérifie si un logo est défini. Voici un exemple de la façon d'afficher le logo ou le nom du site si aucun logo n'est défini:

<?php the_custom_logo(); ?>
<?php if ( ! has_custom_logo() ) : ?>
    <h1><?php bloginfo( 'name' ); ?></h1>
<?php endif; ?>

Alternativement, une approche plus robuste utilisant function_exists() pour la compatibilité arrière:

function mytheme_custom_logo() {
    $output = '';
    if ( function_exists( 'get_custom_logo' ) ) {
        $output = get_custom_logo();
    }
    if ( empty( $output ) ) {
        $output = '<h1><a href="' . esc_url( home_url( '/' ) ) . '">' . get_bloginfo( 'name' ) . '</a></h1>';
    }
    echo $output;
}

Cette fonction peut ensuite être appelée dans les fichiers de modèle du thème.

Conclusion:

L'API de logo WordPress personnalisé simplifie la personnalisation du logo pour les utilisateurs et les développeurs, améliorant la personnalisation du site Web sans nécessiter de modifications de code par l'utilisateur final. Les extraits de code fournis et les explications permettent aux développeurs de pouvoir intégrer facilement cette fonctionnalité dans leurs thèmes.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!