Marketing treści

WordPress: Jak wyświetlić listę stron podrzędnych za pomocą krótkiego kodu

Dla kilku naszych witryn przebudowaliśmy hierarchię witryn WordPress klientów, a jedną z rzeczy, którą staramy się robić, jest efektywne organizowanie informacji. Aby to zrobić, często chcemy utworzyć stronę wzorcową i dołączyć menu, które automatycznie wyświetla listę stron znajdujących się pod nią. Lista stron podrzędnych lub podstron.

Niestety, WordPress nie ma wbudowanej funkcji ani opcji umożliwiającej wykonanie tej czynności, dlatego opracowaliśmy krótki kod, który można dodać do witryny klienta. Oto, jak możesz użyć krótkiego kodu ze wszystkimi jego zmiennymi wypełnionymi w poście lub stronie 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"]

Podział wykorzystania:

  • ifempty="No child pages found": ten tekst będzie wyświetlany, jeśli nie ma dostępnych stron podrzędnych.
  • order="ASC": sortuje listę stron podrzędnych w kolejności rosnącej.
  • orderby="title": porządkuje strony podrzędne według tytułu.
  • ulclass="custom-ul-class": Stosuje klasę CSS „custom-ul-class” do pliku <ul> element listy.
  • liclass="custom-li-class": Stosuje do każdego klasę CSS „custom-li-class”. <li> element na liście.
  • aclass="custom-a-class": Stosuje do każdego klasę CSS „custom-a-class”. <a> (link) element na liście.
  • displayimage="yes": obejmuje wyróżniony obraz każdej strony podrzędnej na liście.
  • align="aligncenter": Spowoduje to wyśrodkowanie wyróżnionych obrazów.

Wstaw ten krótki kod bezpośrednio do obszaru zawartości posta lub strony WordPress, na której ma się pojawić lista stron podrzędnych. Pamiętaj, aby dostosować wartości każdego atrybutu, aby pasowały do ​​​​projektu i struktury witryny WordPress.

Dodatkowo, jeśli chcesz mieć krótki fragment Opisując każdą stronę, wtyczka udostępnia fragmenty na stronach, dzięki czemu można edytować te treści w ustawieniach strony.

Lista krótkich kodów stron podrzędnych

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');

Funkcja add_shortcode_listchildpages dodaje niestandardowy krótki kod

No Records

, którego możesz używać w postach lub stronach WordPress, aby wyświetlić listę stron podrzędnych. Oto opis działania kodu:

  1. Globalna zmienna pocztowa: Funkcja rozpoczyna się od zadeklarowania zmiennej globalnej $post, który służy do uzyskiwania dostępu do informacji o bieżącym poście lub stronie w WordPress.
  2. Atrybuty shortcode: the shortcode_atts funkcja ustawia domyślne wartości atrybutów krótkiego kodu. Użytkownicy mogą je zastąpić, wstawiając krótki kod. Atrybuty obejmują:
    • ifempty: Komunikat wyświetlany, jeśli nie ma stron podrzędnych.
    • order: Kolejność stron podrzędnych (ASC lub DESC).
    • orderby: Kryteria porządkowania stron podrzędnych (np. data_publikowania).
    • ulclass: Klasa CSS dla <ul> elementem.
    • liclass: Klasa CSS dla <li> elementy.
    • aclass: Klasa CSS dla <a> elementy (kotwice).
    • displayimage: Określa, czy wyświetlać wyróżniony obraz stron podrzędnych.
    • align: Wyrównanie wyróżnionego obrazu.
  3. Argumenty zapytania: Funkcja konfiguruje a WP_Query aby pobrać wszystkie strony podrzędne bieżącej strony, posortowane według określonych atrybutów.
  4. Generowanie listy:
    • Jeśli zostaną znalezione strony podrzędne, funkcja tworzy nieuporządkowaną listę HTML (<ul>), przy czym każda strona podrzędna jest reprezentowana przez element listy (<li>).
    • W obrębie każdego elementu listy funkcja sprawdza, czy wyświetlić wyróżniony obraz na podstawie displayimage atrybutów.
    • Funkcja tworzy również łącze do każdej strony podrzędnej za pomocą <a> tag i, jeśli jest dostępny, dodaje fragment strony podrzędnej.
  5. Komunikat wyjściowy lub domyślny: Jeśli nie ma stron podrzędnych, funkcja wyświetla komunikat określony przez ifempty atrybutów.
  6. Zresetuj dane pocztowe: the wp_reset_postdata funkcja resetuje zapytanie WordPress, upewniając się, że global $post obiekt zostanie przywrócony do pierwotnego wpisu głównego zapytania.
  7. Rejestracja krótkiego kodu: Wreszcie add_shortcode rejestry funkcji listchildpages jako nowy krótki kod, łączący go z add_shortcode_listchildpages funkcję, udostępniając ją do wykorzystania w postach i stronach.

Ta funkcja jest przydatna do dynamicznego wyświetlania podstron na stronie nadrzędnej, usprawniając nawigację i organizację w witrynie WordPress. Polecam dodanie go do niestandardowej wtyczki, jeśli chcesz dodać ją do swojej witryny WordPress. Lub… możesz pobrać wtyczkę, którą opublikowałem.

Wyświetl wtyczkę krótkiego kodu stron podrzędnych

W końcu udało mi się wypchnąć kod do wtyczki, aby ułatwić instalację i wykorzystanie, a Wtyczka List Child Pages Shortcode został dzisiaj zatwierdzony przez WordPress! Proszę pobrać i zainstalować – jeśli Ci się podoba, napisz recenzję!

Wtyczka WordPress do wyświetlania stron podrzędnych

Douglas Karr

Douglas Karr jest dyrektorem ds. marketingu OtwórzWglądy i założycielem Martech Zone. Douglas pomógł dziesiątkom odnoszących sukcesy start-upów MarTech, pomagał w due diligence ponad 5 miliardów dolarów w przejęciach i inwestycjach Martech i nadal pomaga firmom we wdrażaniu i automatyzacji ich strategii sprzedaży i marketingu. Douglas to uznany na całym świecie ekspert ds. transformacji cyfrowej oraz MarTech i mówca. Douglas jest także autorem przewodnika dla manekinów i książki o przywództwie biznesowym.

Powiązane artykuły

Powrót do góry przycisk
Zamknij

Wykryto Adblock

Martech Zone jest w stanie udostępnić Ci te treści bez żadnych kosztów, ponieważ zarabiamy na naszej witrynie poprzez przychody z reklam, linki partnerskie i sponsoring. Będziemy wdzięczni za usunięcie blokady reklam podczas przeglądania naszej witryny.