Fermer

mars 12, 2024

WordPress : Comment répertorier les pages enfants à l’aide d’un shortcode

WordPress : Comment répertorier les pages enfants à l’aide d’un shortcode


Nous avons reconstruit la hiérarchie des sites pour plusieurs de nos WordPress clients, et l’une des choses que nous essayons de faire est d’organiser l’information de manière efficace. Pour ce faire, nous souhaitons souvent créer une page maître et inclure un menu qui répertorie automatiquement les pages en dessous. Une liste de pages enfants ou de sous-pages.

Malheureusement, il n’existe aucune fonction ou fonctionnalité inhérente permettant de faire cela dans WordPress, nous avons donc développé un shortcode à ajouter au site du client. Voici comment utiliser le shortcode avec toutes ses variables renseignées dans une publication ou une page WordPress :

[listchildpages ifempty="No child pages found" order="ASC" orderby="title" ulclass="custom-ul-class" liclass="custom-li-class" aclass="custom-a-class" displayimage="yes" align="aligncenter"]

Répartition de l’utilisation :

  • ifempty="No child pages found": Ce texte sera affiché si aucune page enfant n’est disponible.
  • order="ASC": Ceci trie la liste des pages enfants par ordre croissant.
  • orderby="title": Ceci classe les pages enfants par leur titre.
  • ulclass="custom-ul-class": Applique la classe CSS « ​​custom-ul-class » au <ul> élément de la liste.
  • liclass="custom-li-class": Applique la classe CSS « ​​custom-li-class » à chacun <li> élément dans la liste.
  • aclass="custom-a-class": Applique la classe CSS « ​​custom-a-class » à chacun <a> (lien) élément dans la liste.
  • displayimage="yes": Cela inclut l’image sélectionnée de chaque page enfant de la liste.
  • align="aligncenter": Cela aligne les images présentées au centre.

Insérez ce shortcode directement dans la zone de contenu d’une publication ou d’une page WordPress où vous souhaitez que la liste des pages enfants apparaisse. N’oubliez pas de personnaliser les valeurs de chaque attribut pour les adapter à la conception et à la structure de votre site WordPress.

De plus, si vous souhaitez un court extrait décrivant chaque page, le plugin active des extraits sur les pages afin que vous puissiez modifier ce contenu dans les paramètres de la page.

Liste des codes courts des pages enfants

function add_shortcode_listchildpages($atts, $content = "") { 
    global $post; 
    $string = '';

    $atts = shortcode_atts(array(
        'ifempty' => '<p>No Records</p>',
        'order' => 'DESC',
        'orderby' => 'publish_date',
        'ulclass' => '',
        'liclass' => '',
        'aclass' => '',
        'displayimage' => 'no',
        'align' => 'alignleft'
    ), $atts, 'listchildpages');

    $args = array(
        'post_type' => 'page',
        'posts_per_page' => -1,
        'post_parent' => $post->ID,
        'orderby' => $atts['orderby'],
        'order' => $atts['order']
    );

    $parent = new WP_Query($args);

    if ($parent->have_posts()) {
        $string .= $content.'<ul class="'.$atts['ulclass'].'">';
        while ($parent->have_posts()) : $parent->the_post();
            $string .= '<li class="'.$atts['liclass'].'">';
            $true = array("y", "yes", "t", "true");
            $showimage = strtolower($atts['displayimage']);
            if (in_array($showimage, $true)) {
                if (has_post_thumbnail($post->ID)) {
                    $image_attributes = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), 'thumbnail'); 
                    $string .= '<a class="'.$atts['aclass'].'" href="'.get_permalink().'" title="'.get_the_title().'">';
                    $string .= '<img src="'.$image_attributes[0].'" width="'.$image_attributes[1].'" height="'.$image_attributes[2].'" alt="'.get_the_title().'" class="'.$atts['align'].'" /></a>';
                }
            }
            $string .= '<a class="'.$atts['aclass'].'" href="'.get_permalink().'" title="'.get_the_title().'">'.get_the_title().'</a>';
            if (has_excerpt($post->ID)) {
                $string .= ' - '.get_the_excerpt();
            }
            $string .= '</li>';
        endwhile;
        $string .= '</ul>';
    } else {
        $string = $atts['ifempty'];
    }

    wp_reset_postdata();

    return $string;
}
add_shortcode('listchildpages', 'add_shortcode_listchildpages');

La fonction add_shortcode_listchildpages ajoute un shortcode personnalisé

No Records

, que vous pouvez utiliser dans les articles ou pages WordPress pour afficher une liste de pages enfants. Voici un aperçu du fonctionnement du code :

  1. Variable de poste globale: La fonction commence par déclarer la variable globale $postqui est utilisé pour accéder aux informations sur la publication ou la page actuelle dans WordPress.
  2. Attributs du code court: Le shortcode_atts La fonction définit les valeurs par défaut pour les attributs du shortcode. Les utilisateurs peuvent les remplacer lorsqu’ils insèrent le shortcode. Les attributs incluent :
    • ifempty: Message à afficher s’il n’y a pas de pages enfants.
    • order: Ordre des pages enfants (ASC ou DESC).
    • orderby: Critères de classement des pages enfants (par exemple, publi_date).
    • ulclass: classe CSS pour le <ul> élément.
    • liclass: classe CSS pour le <li> éléments.
    • aclass: classe CSS pour le <a> éléments (d’ancrage).
    • displayimage: s’il faut afficher l’image sélectionnée des pages enfants.
    • align: Alignement de l’image sélectionnée.
  3. Arguments de requête: La fonction configure un WP_Query pour récupérer toutes les pages enfants de la page actuelle, triées selon les attributs spécifiés.
  4. Générer la liste:
    • Si des pages enfants sont trouvées, la fonction construit une liste HTML non ordonnée (<ul>), chaque page enfant étant représentée par un élément de liste (<li>).
    • Dans chaque élément de la liste, la fonction vérifie s’il faut afficher l’image sélectionnée en fonction de la displayimage attribut.
    • La fonction crée également un lien vers chaque page enfant à l’aide du <a> balise, et si disponible, ajoute l’extrait de la page enfant.
  5. Sortie ou message par défaut: S’il n’y a pas de pages enfants, la fonction génère le message spécifié par le ifempty attribut.
  6. Réinitialiser les données de publication: Le wp_reset_postdata La fonction réinitialise la requête WordPress, garantissant que la requête globale $post L’objet est restauré dans la publication de la requête principale d’origine.
  7. Enregistrement du code court: Finalement, le add_shortcode registres de fonctions listchildpages comme nouveau shortcode, le liant au add_shortcode_listchildpages fonction, le rendant disponible pour une utilisation dans les articles et les pages.

Cette fonction est utile pour répertorier dynamiquement les sous-pages sur une page parent, améliorant ainsi la navigation et l’organisation au sein d’un site WordPress. Je vous recommande de l’ajouter à un plugin personnalisé si vous souhaitez l’ajouter à votre site WordPress. Ou… vous pouvez télécharger le plugin que j’ai publié.

Plugin de shortcode de liste des pages enfants

J’ai finalement réussi à insérer le code dans un plugin pour le rendre plus facile à installer et à utiliser, et le Plugin Lister les pages enfants Shortcode a été approuvé par WordPress aujourd’hui ! Veuillez le télécharger et l’installer – si vous l’aimez, donnez votre avis !

Plugin WordPress pour lister les pages enfants




Source link