web-dev-qa-db-fra.com

Changer le logo sur chaque page du thème University Hub

J'utilise le thème University Hub http://wenthemes.com/item/wordpress-themes/university-hub/ et j'ai beaucoup cherché et n'a pas trouvé de solution. Je souhaite changer le logo principal sur chaque page du site. J'ai réussi à changer la couleur de fond de l'en-tête avec CSS, mais pour le logo, il me semble qu'il me faut une solution personnalisée pour ce thème, mais je ne sais vraiment pas comment le faire, toute aide sera la bienvenue. Merci! : D P.D .: J'utilise déjà un thème pour enfants.

2
SpaceSpartan

J'ajouterais un filtre à la classe body dans votre fichier functions.php. Cela va ajouter une classe basée sur le slug page/post/cpt:

PHP:

/**
 *
 * Add Page/Post Body Class Slug
 *
 * post-slug-for-post
 * page-slug-for-page
 *
 *
 */
function yourprefix_page_slug_body_class( $classes ) {
    global $post;
    if ( isset( $post ) ) {
        $classes[] = $post->post_type . '-' . $post->post_name;
    }
    return $classes;
}
add_filter( 'body_class', 'yourprefix_page_slug_body_class' );

Ensuite, j'utiliserais jQuery pour échanger le code src en fonction de la classe body. Vous devrez changer la variable de chemin d'accès et éventuellement la classe parente où se trouve le logo img (l'exemple utilise .site-branding).

jQuery

 ( function( window, $, undefined ) {

     'use strict';


     $( document ).ready( function(  ) {


        /* ==== change logo based on body class ===

        // default logo and path
        var path  = 'http://yourdomain.com/wp-content/uploads/',
            logo  = 'logo-1.png'; // this is the default


        // logo 2 conditional change var value
        if ( $( 'body' ).is( '.page-such-and-such' ) ) {
            logo = 'logo-2.png';
        }

        // logo 3 conditional change var value
        if ( $( 'body' ).is( '.post-such-and-thing' ) ) {
            logo = 'logo-3.png';
        }

        // return the logo src
        $( '.site-branding img' ).attr( 'src', path + logo );


        // end swapping logo


    } ); //* end ready


} )( this, jQuery );

Créez un document avec votre éditeur de code et nommez-le swapping-logo.js (ou autre) et mettez-le en file d'attente avec jQuery en tant que dep. Les instructions sur l’ajout de js à votre thème sont partout.

1
Christina

Ce n'est pas spécifique à WordPress, mais vous pouvez essayer de supprimer le crochet d'en-tête et de le rajouter avec une image d'un champ personnalisé ou la méta-boîte de l'image sélectionnée. Ensuite, utilisez votre en-tête university_hub_action_header pour afficher le code de sécurité child theme .

Ou

Vous pouvez filtrer le logo personnalisé en utilisant des champs personnalisés ou la vignette de la publication comme saisie.

0
Dev