Problème de mise en page d’un menu avec séparateur | (Créer un compte)

  • Statut : non résolu
14 sujets de 1 à 14 (sur un total de 14)
  • Auteur
    Messages
  • #485841
    zetony
    Participant
    Initié WordPress
    21 contributions

    Bonjour,

    Ma configuration WP actuelle
    – Version de WordPress : 3.0
    – Version de PHP/MySQL : Serveur Apache / Mysql de base sous XAMPP
    – Thème utilisé : Mini Buzz
    – Extensions en place : cforms
    – Nom de l’hebergeur : Xampp …
    – Adresse du site : Offline

    Problème(s) rencontré(s) : Avant de toucher au thème j’avais effectuer une intégration HTML/CSS du rendu souhaité et pour mettre en forme mon menu j’avais utilisé les balises UL / LI de la manière suivante :

    <ul>
    <li><a href="#" title="Plan du site">Plan du site</a></li> |
    <li><a href="#" title="Ou nous trouver">Ou nous trouver</a></li> |
    <li><a href="#" title="Notre zone d'intervention">Notre zone d’intervention</a></li> |
    <li><a href="#" title="Contactez-nous">Contactez-nous</a></li>
    </ul>

    Le caractère | est utilisé pour séparer mes différents liens.

    J’ai opté pour l’utilisation des menus wordpress pour qu’ils puissent être « dynamiques » et modifiables depuis l’interface d’administration, j’ai rentré le code suivant proposé par le codex pour la génération d’un des menus :

    <?php wp_nav_menu(  array( 'theme_location' => ‘footer1’ ));  ?>

    Ce code m’offre la possibilité d’utiliser la fonction « menu » de wordpress 3 mais je n’arrive pas à ajouter le caractère | pour obtenir le même rendu que sur mon intégration HTML. J’ai essayé de l’ajouter avec la fonction afterlink (je crois) mais le problème cela posé 2 autres problèmes : le caractère était réactif au roll-over et il ne respectait pas le margin que j’ai ajouter entre les différents

  • . Au passage, c’est la même chose pour mon menu principal généré par le code suivant :
    <ul>
    <li class="home<?php if (is_front_page() || is_home()) echo ' current_page_item'; ?>« >
    <a href="<?php echo get_option('home'); ?>/ »>Accueil</a>
    </li>
    <?php wp_list_pages( 'title_li=0&depth=3&sort_column=menu_order&exclude=' . $menu ); ?>
    </ul>

    Si quelqu’un a une idée pour ajouter ce caractère dans ces 2 boucles qui génèrent mes menus, je suis vraiment preneur !

    Bonne journée et merci par avance à celui qui passera par là avec une solution 🙂

#738133
zetony
Participant
Initié WordPress
21 contributions

Personne pour me filer un pti coup de main ? :D

#738134
zetony
Participant
Initié WordPress
21 contributions

un nouveau « up » en guise d’espoir !
Quelqu’un a eu une réponse à me donner ? Un piste, un conseil, … quelque chose ?
Merci d’avance !

#738135
Environnement-France
Participant
Maître WordPress
1114 contributions

tu as essayé avec $after plutôt que $link_after ?

#738136
zetony
Participant
Initié WordPress
21 contributions

Bonjour et merci de pour votre retour.
Je viens d’essayer mais cela ne fonctionne pas.

Lorsque je rentre le code suivant, j’ai bien ma séparation qui s’affiche :

Mais lorsque je teste avec after ou $after (de même que pour before ou $before, ça ne fonctionne pas :


ou

Quelqu’un a une idée ? 🙂

#738137
Environnement-France
Participant
Maître WordPress
1114 contributions

Je parlais pour la fonction wp_nav_menu :
http://codex.wordpress.org/Function_Reference/wp_nav_menu

#738138
zetony
Participant
Initié WordPress
21 contributions

Bonjour,

Effectivement ça fonctionne mieux avec la fonction wp_nav_menu !
J’ai une 2ème question maintenant : Comment est-il possible d’utiliser $after mais qu’il ne soit pas effectif sur le dernier élément de la liste

  • ? Je m’explique, pour le moment et avec l’utilisation du $after, j’obtiens quelque chose similaire à ceci :

    Plan du site | Nous contacter | Mentions légales |

    La dernière « | » n’étant pas utile, je souhaite qu’elle ne s’affiche pas.
    Avez-vous une idée pour éviter que ce caractère s’affiche en fin de boucle?

    Merci par avance.

  • #738139
    Environnement-France
    Participant
    Maître WordPress
    1114 contributions

    pas possible je pense,
    sinon tu peux utiliser $before mais tu auras | Plan du site | Nous contacter | Mentions légales

    #738140
    zetony
    Participant
    Initié WordPress
    21 contributions

    arf … je vais continuer à chercher comment faire, je reviendrai sur ce post pour donner ma solution si jamais je ne désespère pas avant 🙂
    Merci pour votre aide !

    #738141
    mfrerebeau
    Membre
    Initié WordPress
    12 contributions

    En dehors de surcharger la fonction de création du menu, avez-vous trouvé une solution pour afficher des séparateurs uniquement entre les menus (ie: ni avant le 1er item ni après le dernier item) ?

    Merci de votre réponse (même négative 😉 )

    #738142
    zetony
    Participant
    Initié WordPress
    21 contributions

    Bonjour,
    J’ai finalement laissé tomber !
    Je pense que tu peux ajouter le lien de la page d’accueil (à la main) dans le code et utiliser le plugin « exclude page » pour qu’il ne soit pas afficher dans la liste des liens.
    Ensuite, tu devrais pouvoir mettre le séparateur en début de liste en faisant en sorte que ta liste de liens soit à la suite du lien « Accueil ».
    Ce n’est pas très claire mais je me comprends !
    Bonne chance 🙂

    #738143
    mfrerebeau
    Membre
    Initié WordPress
    12 contributions

    Merci pour ton retour.

    Si c’est très clair pour moi aussi.
    C’est une astuce à défaut d’une fonction qui gèrerait les séparateurs de menus 😉 Aussi je trouve que c’est une bonne idée 😉
    Faudra que je surcharge si je veux quelque chose de plus générique pour tous les menus possibles.

    #738144
    ManuelB
    Membre
    Initié WordPress
    2 contributions

    Pour le séparateur j’ai une solution. Bon ça servira peut être à d’autres.

    Donc …

    Aller dans la gestion de votre menu dans le back de wordpress.

    Pour les éléments qui ont besoin d’un séparateur mettez une class css (par exemple separateur)

    Ensuite ajouter ce style dans votre fichier css préféré, par exemple :

    .separateur {
    background: transparent url(‘images/navigation/separateur.png’) no-repeat 0 0.7em;
    padding-left: 20px;
    }

    Il faut ajouter la classe sur tout les éléments de menu concernés mais ça permet un control plus fin.

    Et voili 🙂

    #738145
    mfrerebeau
    Membre
    Initié WordPress
    12 contributions

    C’est un peu lourd mais ça a l’avantage de ne pas faire de bidouille dans le modèle… Intéressant 😉

    14 sujets de 1 à 14 (sur un total de 14)
    • Le forum ‘Utilisation spécifique de WordPress’ est fermé à de nouveaux sujets et réponses.