X

Comment afficher tous les articles dans un menu déroulant

Extraits par IsItWP

Vous cherchez un moyen d'afficher la liste de tous vos articles dans un menu déroulant ? Bien qu'il existe probablement un plugin pour cela, nous avons créé un extrait de code rapide que vous pouvez utiliser pour afficher tous les articles dans un menu déroulant dans WordPress.

Vous pouvez ajuster le nombre d'articles affichés en modifiant la valeur -1 dans le tableau $args.

Instructions :

Tout ce que vous avez à faire est d'ajouter ce code au fichier index.php de votre thème :

<form action="<? bloginfo('url'); ?>" method="get">
<select name="page_id" id="page_id">
<?php
global $post;
$args = array( 'numberposts' => -1);
$posts = get_posts($args);
foreach( $posts as $post ) : setup_postdata($post); ?>
	<option value="<? echo $post->ID; ?>"><?php the_title(); ?></option>
<?php endforeach; ?>
</select>
<input type="submit" name="submit" value="view" />
</form>

Remarque : Si c'est la première fois que vous ajoutez des extraits de code dans WordPress, veuillez consulter notre guide sur la manière d'ajouter correctement des extraits de code dans WordPress, afin de ne pas endommager accidentellement votre site.

Si vous avez aimé cet extrait de code, n'hésitez pas à consulter nos autres articles sur le site tels que : 50+ meilleurs thèmes WooCommerce pour votre boutique en ligne et comment créer un formulaire de don WordPress.

Commentaires   Laisser une réponse

  1. Monsieur, j'utilise le type de publication avada portfolio et votre code fonctionne bien mais casse la mise en page normale de toutes les pages.

    J'ai ajouté « post_type » => « avada_portfolio »,

    Le menu déroulant fonctionne bien mais tout le contenu normal de la page a une miniature de portfolio.
    Comment puis-je résoudre ce problème ?
    S'il vous plaît, aidez-moi.

    <form action="” method=”get”>

    — Sélectionner un élément —

    -1,
    ‘post_type’ => ‘avada_portfolio’,
    );
    $posts = get_posts($args);
    foreach( $posts as $post ) : setup_postdata($post); ?>
    <option value="ID);?>” class=”ID; ?>”>

    1. L'exemple de code que vous avez inclus contient des erreurs de syntaxe. Par exemple, le PHP et le HTML ne sont pas correctement séparés.

  2. Salut, mais quand on clique sur une option sélectionnée, le lien ne fonctionne pas.
    Comment régler ça ?

    1. Si le bouton de soumission est cliqué, la console affiche-t-elle des messages d'erreur ?

  3. Bonjour,

    S'il vous plaît, je voulais savoir comment afficher ce menu déroulant sur une autre page que index.php ?

    1. Dans ce cas, vous devrez ajouter le code au fichier de modèle de thème correspondant.

  4. Je veux mettre un shortcode dans un widget de texte pour afficher un menu déroulant avec des liens vers tous mes articles. J'ai donc besoin d'un code PHP à mettre dans le plugin PHPCode Snppets. Pouvez-vous m'aider ?

  5. Kevin, votre code fonctionne bien pour moi. J'ai juste besoin de confirmer, pouvons-nous supprimer /?submit=view de l'URL une fois que vous cliquez sur le bouton view post à la fin de l'URL, il est ajouté automatiquement. Comment puis-je supprimer cela.

    1. Cela semble être ajouté par WordPress. Vous pourriez essayer de supprimer la chaîne de requête avec JavaScript après le chargement de la page, mais ce n'est pas recommandé.

  6. Bonjour, je travaille sur une application web classifiée sur WordPress. Avez-vous un extrait de code qui transforme la sélection déroulante (Catégorie) en vue liste. Comme le style de publication d'annonce d'Olx.in. Ainsi, l'utilisateur peut sélectionner facilement en voyant tout à la fois au lieu de faire défiler. J'espère que vous comprenez mon problème.

  7. J'ai ajouté le code ci-dessus à ma barre latérale dans un widget de texte, mais rien ne s'affiche dans la zone déroulante (c'est juste blanc). Une idée pourquoi ? Merci !

  8. Marta Mystkowska Johnsson October 30, 2014 at 8:21 am

    Salut, super tutoriel mais je me demande s'il est possible de faire deux listes déroulantes. La première choisit une catégorie et la seconde affiche tous les articles de cette catégorie, puis il y a un bouton (lien) qui permet d'aller à l'article choisi ? Pensez-vous que ce soit possible ? J'ai écrit du code qui prend des valeurs codées en dur et change la liste avec JavaScript, mais j'aimerais que ce soit dynamique, actuellement je dois ajouter chaque nouvel article à ma liste codée en dur dans la bonne catégorie, beaucoup de désordre.... Merci !

    1. Oui, quelque chose comme ceci pourrait être fait, cependant vous auriez besoin d'utiliser ajax pour récupérer tous les articles d'une catégorie spécifique lorsqu'elle est sélectionnée. Il ne s'agit pas simplement d'un changement dans le code ci-dessus.

  9. Salut Kevin, merci pour ton tutoriel. Comment créer une option sélectionnée ? J'utilise ton code pour afficher le titre de mon type de publication personnalisé, mais lorsque j'en sélectionne un et que j'appuie sur le bouton de soumission, il revient au premier (je veux dire rien n'est sélectionné).

    1. Cet extrait ne crée que le menu, il ne fait rien de plus. Cependant, vous pouvez utiliser le script suivant sur le site sœur de wpsnipp.com, jqsnipp.com, pour le côté jquery.

      http://jqsnipp.com/create-jquery-select-dropdown/

      Ensuite, dans l'extrait ci-dessus, changez

      <option value="ID; ?>”> en

      <option value="”>

      Cela ajoutera le permalien à la valeur et le javascript sur jqsnipp vous permettra de sauter à l'emplacement lorsque vous sélectionnez l'élément du menu.

      1. merci beaucoup

  10. Salut Kevin,
    Merci beaucoup d'avoir posté ceci. Je cherchais partout comment accomplir cela avec des types de publication personnalisés. Savez-vous comment je peux y parvenir pour que, lorsque l'élément est sélectionné dans le menu déroulant, il accède automatiquement à la page sans avoir besoin d'un bouton "soumettre" ?
    Merci !

    1. Salut Chris,

      Plutôt que juste $post->ID pour la valeur, vous pourriez ajouter

      get_permalink($post->ID) puis utilisez javascript pour voir quelle option a été sélectionnée.
      Si vous utilisez jQuery, j'ai un extrait sur mon autre site http://jqsnipp.com que vous pouvez
      utiliser pour ce genre de chose. http://jqsnipp.com/create-jquery-select-dropdown/

  11. Roberta Mahasti April 4, 2014 at 12:10 pm

    Salut, puis-je lister mes articles de portfolio ? J'essaie mais... 🙂

    1. Salut Roberta,

      Je suppose que vous voulez afficher un type de publication personnalisé ? Vous devez ajouter le type de publication au tableau $args. Si vous ajoutez 'post_type' => 'post', cela devrait fonctionner après avoir remplacé post par le nom de votre type de publication personnalisé.

      1. Roberta Mahasti April 4, 2014 at 8:16 pm

        Merci ^^

      2. Roberta Mahasti April 4, 2014 at 8:16 pm

        Merci ^^

  12. Bonjour, y a-t-il un moyen de changer la taille de la liste déroulante ou du champ déroulant ?

    Merci

    1. En CSS, ajoutez
      .dropbox {
      height: 30px; /* Changez selon vos préférences*/
      }

  13. Merci pour cet extrait. Désolé pour mon anglais, je ferai de mon mieux 🙂 J'ai besoin d'une "première ligne" comme "Veuillez choisir...". Pouvez-vous m'aider à insérer cette ligne dans votre code ? garfield853

  14. Ferry Verhoeve August 9, 2013 at 8:04 am

    Où est-ce que je place ça ??

    1. Salut Ferry, placez le code où vous souhaitez l'afficher dans votre thème.

      1. Ferry Verhoeve August 9, 2013 at 8:51 am

        merci

  15. Parfait !!!

  16. Qu'en est-il si vous vouliez le faire par catégorie ? Afficher tous les articles sous chaque catégorie ?

  17. Cela fonctionne-t-il aussi avec les types de publication personnalisés ?

    1. Salut Fin, oui vous pouvez ajouter le type de publication au tableau d'arguments, par exemple :

      array(
      ‘numberposts’ => -1,
      ‘post_type’=> ‘post’,
      );

      1. Cela fonctionne très bien et merci !

        Pouvez-vous me conseiller pour afficher tous les articles d'une certaine catégorie

        1. Ajoutez simplement cat et l'ID de la catégorie

          array(
          ‘numberposts’ => -1,
          ‘post_type’=> ‘post’,
          ‘cat’ => ‘2’,
          );

          1. Santé Kevin !

          2. Salut Kevin, merci d'avoir posté le code sur cette page. Cela m'a été très utile pour organiser la barre latérale à (lien supprimé). S'il vous plaît, dans la boîte « Églises de NY », j'aimerais que la boîte commence par « Sélectionner un article » - comment puis-je implémenter cette option ? De plus, comment puis-je faire en sorte que la sélection aille directement à l'article sans la boîte « voir » ? Merci.

Ajouter un commentaire

Nous sommes heureux que vous ayez choisi de laisser un commentaire. N'oubliez pas que tous les commentaires sont modérés conformément à notre politique de confidentialité, et tous les liens sont nofollow. N'utilisez PAS de mots-clés dans le champ nom. Ayons une conversation personnelle et significative.

Liste de contrôle de lancement WordPress

La checklist ultime pour lancer un WordPress

Nous avons compilé tous les éléments essentiels de la liste de contrôle pour le lancement de votre prochain site Web WordPress dans un ebook pratique.
Oui, envoyez-moi l'eBook gratuit !