Thème sydney: compréhension/modification header (Créer un compte)

  • WordPress :5.4
  • Statut : non résolu
7 sujets de 1 à 7 (sur un total de 7)
  • Auteur
    Messages
  • #2347544
    pasglop
    Participant
    Initié WordPress
    4 contributions

    Bonjour,

    Ma configuration WP actuelle

    • Version de PHP/MySQL : PHP 7.4.7 / MYSQL 5.7.30
    • Thème utilisé : Sydney
    • Extensions en place : Elementor
    • Nom de l’hébergeur : Local
    • Adresse du site :  https://wptest.fr

    Problème(s) rencontré(s) :

    Bonjour,

     

    Nouveau dans l’utilisation de WordPress, j’ai installé le thème sydney, puis commencé à créer un thème enfant afin de modifier le parent. Mais voilà, je bute sur la chose suivante: comment remplacer le paramétrage du header, je m’explique:

    lorsque j’examine le code source, la définition html du header est la suivante:

    <header id="masthead" class="site-header" role="banner">

    et dans l’inpecteur d’élément:

    <header id="masthead" class="site-header fixed float-header" role="banner">

    Or, nulle trace de l’id=”masthead” dans les css.

    Et ce que je souhaite savoir, c’est comment est-il possible de changer la ‘bannière’ de cette partie du header qui reste fixe lorsue l’on scroll, par une image ?

     

    Merci de vos réponses

     

    Pasglop

    #2347545
    PhiLyon
    Modérateur
    Maître WordPress
    25879 contributions

    Bonjour.

    Dans Apparence/Personnaliser/Zone d’en-tête tu peux changer le type d’image.

    🙂

    #2347549
    pasglop
    Participant
    Initié WordPress
    4 contributions

    Alors, oui, ça j’ai testé, pas de problème pour avoir une quelconque image via la zone d’en-tête, mais ce n’est pas cette partie de header que je souhaite modifier. Dans ce thème, il y a une zone du header,  (qui d’ailleurs va couvrir l’image que je définis), et dont tu peux changer la couleur (Apparence/Personnalisation/Couleur/En-tête/arrière-plan du menu). Elle apparaît véritablement lorsque tu scrolles vers le bas, est en position fixed, avec un float et un z-index de 1000.

    Mais qu’est-ce qui la gère ? est-ce un JS ?

    Et est-il possible de la remplacer par une image ?

     

    Pasglop

    #2347550
    PhiLyon
    Modérateur
    Maître WordPress
    25879 contributions

    Essaie ce code en mettant l’url de ton image

    .site-header.float-header {
    	background-color: rgba(0,0,0,0) !important;
    	background-image: url('http://tests-forum-wpfr.local/wp-content/uploads/2019/11/1024px-Dülmen_Wildpark_-_2014_-_3808_color_balanced.jpg')
    }

    🙂

    #2347551
    pasglop
    Participant
    Initié WordPress
    4 contributions

    Bon, c’était simple, l’image apparaît bien au scroll (du moins celle que je lui ai indiqué, car ton lien ne fonctionne pas).

     

    En tout cas merci beaucoup.

     

    Pasglop

     

    #2347552
    PhiLyon
    Modérateur
    Maître WordPress
    25879 contributions

    du moins celle que je lui ai indiqué, car ton lien ne fonctionne pas

    Essaie ce code en mettant l’url de ton image

    Mon lien ne peut fonctionner, c’est un site en local.

    🙂

    #2347553
    pasglop
    Participant
    Initié WordPress
    4 contributions

    Ca y est, j’ai trouvé non pas la réponse, mais la véritable question de départ. En effet, j’ai mélangé deux choses: l’image en background du header qui en fait se situe dans

    <div class="header-image">

    et la ‘couverture’, que l’on modifie dans Apparence/Personnaliser/Zone d’en-tête/activer ou désactiver la couverture. Celle-ci, lorsqu’activée, permet de conserver ‘apparent’ titre, slogan et menu du site (ceux définis par défaut) lorsque l’on scrolle bas.

    Mais je m’aperçois qu’il y a deux états css, avant et après scroll. Avant, le css du header est défini ainsi:

    <header id="masthead" class="site-header fixed" role="banner">

    Et après scroll bas, il est défini comme suit:

    <header id="masthead" class="site-header fixed float-header" role="banner">

    Qu’est-ce qui permet l’ajout de “float-header” et où (css ou js)  ?

     

    Pasglop

7 sujets de 1 à 7 (sur un total de 7)
  • Vous devez être connecté pour répondre à ce sujet.