[Résolu] Menu déroulant (Créer un compte)

  • WordPress :6.4
  • Statut : résolu
14 sujets de 1 à 14 (sur un total de 14)
  • Auteur
    Messages
  • #2467454
    ahwordpress
    Participant
    Initié WordPress
    5 contributions

    Bonjour,

    Ma configuration WP actuelle

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

    Bonjour,

    Je souhaite enlever l’automatisation du menu ouvert sur sur la 1 ere offre d’emploi .
    Est-il possible de m’aider afin que je puisse avoir toutes les offres fermées ? Mais ouverte quand je clique sur le bouton pour les ouvrir.

    Merci d’avance.

    #2467498
    ferman
    Participant
    Maître WordPress
    6999 contributions

    Bonjour,

    Téléchargez cette extension puis dans les settings  copiez/collez ce code dans le cadre « Scripts in footer » (voir pièce jointe)

    <script>
    $=jQuery;
    $('.collapse.show').css({"display":"none"});
    $('.nav-link').click(function(){$('.collapse.show').css({"display":"block"})});
    </script>

    Si ça ne fonctionne pas, il suffit d’enlever de code.

    Fichiers joints :
    Vous devez être connecté pour voir les fichiers joints.
    #2467516
    ferman
    Participant
    Maître WordPress
    6999 contributions

    Encore plus simple:

    <script>
    $=jQuery;
    $('.collapse.show').hide();
    $('.nav-link').click(function(){$('.collapse.show').show()});
    </script>

    • Cette réponse a été modifiée le il y a 4 mois et 1 semaine par ferman.
    #2467628
    ahwordpress
    Participant
    Initié WordPress
    5 contributions

    Bonsoir,

    Merci beaucoup pour votre aide Ferman.

    J’ai ajouté le sricpt dans le footer mais il marche que sur  » Andrezieux Bouthéon », il faudrait que cela se fasse également sur les autres mais aussi que lorsque l’on revient sur une autre ville, celui-ci soit toujours fermé.

    Est-ce possible ?

    Merci d’avance.

     

     

    #2467632
    ferman
    Participant
    Maître WordPress
    6999 contributions

    Bonjour,

    Je ne suis pas sûr de comprendre.

    Avant d’avoir mis le code quand vous arriviez sur la page recrutements c’était toujours le menu « Andrézieux-Boutheon » qui était ouvert, jamais un autre.

    Avec le code, en arrivant sur la page, ce menu (ainsi que tous les autres) est fermé et il faut cliquer pour ouvrir un menu. Quand vous quittez la page, elle est réinitialisée et en y revenant vous retrouverez tous les menus fermés. La seule exception est quand vous revenez avec la flèche « page précédente » dans la barre du navigateur mais là je pense qu’on ne peut rien y faire. Pourriez-vous me re-préciser ce que vous souhaitez?

    #2467699
    ahwordpress
    Participant
    Initié WordPress
    5 contributions

    Bonsoir,

    J’ai correctement intégré le code que vous avez fourni. Maintenant, lorsque l’on accède à la page « recrutement », le menu apparaît bien comme étant fermé, ce qui est le résultat attendu.

    Cependant, je rencontre un souci avec les autres menus, tels que « Chambon-Feugerolles », « Dunkerque » ou « Saint Avold ». Contrairement à ce que nous souhaitons, ces menus s’affichent ouverts.

    Je souhaiterais que ces menus restent fermés dès l’instant où je sélectionne l’un d’entre eux, afin de garder une cohérence avec le comportement du menu « recrutement ».

    Est-ce plus claire pour vous ?

    Merci d’avance.

     

    #2467732
    ferman
    Participant
    Maître WordPress
    6999 contributions

    Bonjour,

    Je souhaiterais que ces menus restent fermés dès l’instant où je sélectionne l’un d’entre eux,

    C’est possible mais pouvez-vous temporairement désactiver le code que je vous avais donné pour que je puisse tester sans qu’il interfère?

    #2467871
    ahwordpress
    Participant
    Initié WordPress
    5 contributions

    Bonsoir,

    Oui, j’ai bien supprimé le code.

    Je vous remercie.

    #2467945
    ferman
    Participant
    Maître WordPress
    6999 contributions

    Bonjour,

    Voici une solution possible. On peut faire des ajustements mineurs en CSS (couleurs, taille des caractères…)  mais pas changer fondamentalement le comportement du tableau d’offres d’emploi.

    Il y a deux codes:

    • Un code jQuery à mettre en place de manière analogue au précédent
    • Un code CSS à mettre dans les CSS personnalisées du thème.
    <script>
    $=jQuery;
    $('.collapse.show').show();
    $('.collapse.show,.collapsed').addClass('details');
    $('[id*="collapse_header_0"]').css({"pointer-events":"none"});
    $('.card-body').hide();
    $('.collapse.show').click(function(){$('.card-body').show();
    $('.collapse.show,.collapsed').removeClass('details');
    $('[id*="collapse_header_0"]').css({"pointer-events":"auto"});
    });
    </script>
    Code jQuery

    .details:after{
    font-size:14px;
    content:"Double cliquez ici pour voir le détail des offres";
    color:red;
    border:solid red;
    padding:5px;
    position:relative;
    top:-7em;
    }
    .collapsing{display:none;
    }
    .collapsed.details{pointer-events:none;
    }
    @media only screen and (max-width: 800px) {
    .details:after{
    top:-6em;
    }
    }

    Il est possible de regrouper ces deux fonctions en une seule fonction PHP

    A l’ouverture de la page on voit ce qui est en pj. On peut naviguer entre les villes et parcourir les titres des offres mais on ne peut pas les ouvrir. Si une/plusieurs offres sont intéressantes, Il est possible d’en voir le détail en double-cliquant sur un champ , ce qui a pour effet de rendre possible l’ouverture de toutes les offres.

    On peut éventuellement faire des ajustements « cosmétiques »en CSS (couleurs, taille des caractères…)  mais pas changer fondamentalement le comportement du tableau d’offres d’emploi.

    Enfin, il y aurait peut être une solution beaucoup plus simple mais je ne peux pas la tester (mais vous pouvez) qui serait de mettre en premier (à la place de « Electricien maintenance H/F « ) un champ vide. Je ne sais pas si c’est possible  (je pense que oui) et dans ce cas vous n’auriez besoin d’aucun code.

    Tenez moi au courant.

    • Cette réponse a été modifiée le il y a 4 mois par ferman.
    Fichiers joints :
    Vous devez être connecté pour voir les fichiers joints.
    #2468182
    hawp
    Participant
    Initié WordPress
    10 contributions

    Bonjour,

    J’ai mis en place le code, mais les offres d’emploi ne s’ouvrent plus, même avec le CSS personnalisé, le double clic ne fonctionne pas. J’ai donc enlevé le code que vous m’avez donné.

    J’ai aussi tenté d’ajouter une autre offre d’emploi en ne mettant aucun texte, et ça fonctionne mais je trouve pas ça super jolie .. mais s’ils n’y a pas le choix je laisserai comme ça.

    Merci beaucoup pour votre aide.

     

    #2468203
    ferman
    Participant
    Maître WordPress
    6999 contributions

    Bonjour,

    Bonjour,

    C’est bizarre.  Je viens de re-essayer et ça marche sauf que j’ai fait une petite erreur dans le code jQuery que je vous ai donné: le double click était une   amélioration de dernière minute (pour bien différencier des autres champs cliquables) mais j’ai oublié de modifier dans le code que je vous ai transmis (il faut simplement remplacer (‘.collapse.show’).click(function()… par (‘.collapse.show’).dblclick(function()…). Donc chez moi ça marche mais il suffit de cliquer une fois.

    D’un autre côté, puisque vous êtes parti sur autre chose et que la méthode avec un champ vide fonctionne, c’est plus simple. Vous dites que ce n’est pas joli mais en CSS on peut faire beaucoup de choses. Et je pense que vous pouvez facilement ajouter un texte dans le html (ou en CSS) Ex en pj. On peut regarder ça si vous voulez .

     

    Fichiers joints :
    Vous devez être connecté pour voir les fichiers joints.
    #2468211
    ferman
    Participant
    Maître WordPress
    6999 contributions

    Vous pouvez même simplement masquer le champ vide.

    [aria-labelledby *="collapse_header_0"],[id *="collapse_header_0"]{display:none;}

    #2468248
    ahwordpress
    Participant
    Initié WordPress
    5 contributions

    Merci infiniment pour votre aide,  je vais le laisser comme ça finalement. Ca me convient 🙂

    Merci encore.

    #2468249
    ferman
    Participant
    Maître WordPress
    6999 contributions

    Merci infiniment pour votre aide

    Je vous en prie 🙂 . Pouvez-vous passer le sujet en résolu pour clore le chapitre? Merci.

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