W artykule:
Niedawno jeden z naszych czytelników zapytał nas, jak wyświetlić strony potomne strony WordPress?
Jeśli organizujesz swoją witrynę WordPress ze stronami nadrzędnymi i podrzędnymi, możesz wyświetlić strony podrzędne lub podstrony na głównej stronie nadrzędnej. Możesz również pokazać stronę główną na każdej podstronie, aby ułatwić przeglądanie.
W tym artykule pokażemy, jak łatwo wyświetlić listę stron potomnych dla strony nadrzędnej w WordPress.
Kiedy trzeba pokazać listę stron potomnych?
WordPress zawiera dwa domyślne typy postów o nazwie posty i strony. Posty są treścią bloga i są zwykle zorganizowane za pomocą kategorii i tagów.
Strony to jednorazowe lub samodzielne treści, które są wiecznie zielone, takie jak Strona „O nas” lub Strona „skontaktuj się z nami”.
W WordPress strony mogą być hierarchiczne, co oznacza, że można je organizować ze stronami nadrzędnymi i podrzędnymi.
Na przykład możesz utworzyć stronę produktu ze stronami podrzędnymi dla funkcji, cen i pomocy technicznej.
Aby utworzyć stronę potomną, postępuj zgodnie z naszym przewodnikiem, jak utworzyć stronę potomną w WordPress.
Po utworzeniu stron nadrzędnych i podrzędnych możesz wyświetlić listę stron podrzędnych na głównej stronie nadrzędnej.
Teraz łatwym sposobem na to jest ręczna edycja strony nadrzędnej i dodanie listy linków indywidualnie.
Musisz jednak ręcznie edytować Stronę nadrzędną za każdym razem, gdy dodajesz lub usuwasz stronę podrzędną. Czy nie byłoby przyjemniej, gdybyś mógł po prostu utworzyć stronę potomną i automatycznie pojawiałaby się jako link na stronie nadrzędnej?
Mając to na uwadze, przyjrzyjmy się innym dynamicznym sposobom szybkiego wyświetlania listy stron potomnych na stronie nadrzędnej w WordPress.
Metoda 1. Wyświetlanie stron potomnych na stronie nadrzędnej za pomocą wtyczki
Ta metoda jest łatwiejsza i zalecana dla wszystkich użytkowników.
Najpierw musisz zainstalować i aktywować wtyczkę Page-list. Aby uzyskać więcej informacji, zobacz nasz przewodnik krok po kroku, jak zainstalować wtyczkę WordPress.
Po aktywacji musisz edytować Stronę nadrzędną i po prostu dodać następujący krótki kod, w którym chcesz wyświetlić listę stron podrzędnych.
[podstrony]
Możesz teraz zapisać swoją stronę i wyświetlić jej podgląd w nowej karcie przeglądarki. Zauważysz, że wyświetla prostą wypunktowaną listę wszystkich stron potomnych.
Jeśli chcesz, możesz dodać niestandardowy CSS, aby zmienić wygląd listy. Oto przykładowy CSS, którego możesz użyć jako punktu wyjścia.
ul.spis stron.podstrony-page-list {
styl listy: brak;
list-style-type: brak;
background-color: # eee;
border: 1px solid # CCC;
padding: 20px;
}
Po zastosowaniu niestandardowego CSS możesz wyświetlić podgląd strony nadrzędnej. Tak to wyglądało na naszej stronie testowej WordPress.
Wtyczka zapewnia kilka parametrów skrótu, które pozwalają ustawić głębokość, wykluczyć strony,liczbę elementów i wiele innych. Szczegółowe informacje można znaleźć na stronie wtyczki w celu uzyskania szczegółowej dokumentacji.
Metoda 2. Wyświetlanie stron potomnych dla strony nadrzędnej za pomocą kodu
Ta metoda jest nieco zaawansowana i wymaga dodania kodu do witryny WordPress. Jeśli nie robiłeś tego wcześniej, zapoznaj się z naszym przewodnikiem, jak skopiować i wkleić kod w WordPress.
Aby wyświetlić strony potomne na stronie nadrzędnej, należy dodać następujący kod we wtyczce dla witryny lub w funkcjach szablonu.plik php:
function wpb_list_child_pages () {
global $post;
if (is_page () & & $post - >post_parent )
$childpages = wp_list_pages ('sort_column=menu_order&title_li=&child_of=' . $post - > post_parent . '&echo=0');
else
$childpages = wp_list_pages ('sort_column=menu_order&title_li=&child_of=' . $post->ID . '&echo=0');
if ($childpages) {
$string = '<ul class="wpb_page_list">' . $childpages . "</ul>";
}
return $ string;
}
add_shortcode ('wpb_childpages', 'wpb_list_child_pages');
Powyższy kod najpierw sprawdza, czy strona ma rodzica, czy sama strona jest rodzicem.
Jeśli jest to Strona nadrzędna, to wyświetla powiązane z nią strony podrzędne. Jeżeli jest to strona potomna, wtedy wyświetla wszystkie inne strony potomne swojej strony nadrzędnej.
Na koniec, jeśli jest to tylko strona Bez strony podrzędnej lub nadrzędnej, kod po prostu nic nie zrobi. W ostatnim wierszu kodu dodaliśmy shortcode, dzięki czemu można łatwo wyświetlać strony potomne bez modyfikowania szablonów stron.
Aby wyświetlić strony potomne, po prostu dodaj następujący krótki kod w widżecie strony lub tekstu na pasku bocznym:
[wpb_childpages]
Nie zapomnij zapisać zmian i wyświetlić ich podgląd na karcie przeglądarki. Tak to wygląda na naszej stronie testowej.
Możesz teraz stylizować tę listę stron za pomocą niestandardowego CSS. Oto przykładowy kod CSS, którego możesz użyć jako punktu wyjścia.
ul.wpb_page_list {
styl listy: brak;
list-style-type: brak;
background-color: # eee;
border: 1px solid # CCC;
padding: 20px;
}
Metoda 3. Dynamiczne Wyświetlanie Stron Potomnych Bez Żadnych Skrótów
Używanie skrótów jest wygodne, ale problem z nimi polega na tym, że będziesz musiał dodać skróty we wszystkich stronach, które mają strony nadrzędne lub podrzędne.
Możesz skończyć z krótkimi kodami na wielu stronach, a czasami nawet zapomnisz go dodać.
Lepszym podejściem byłoby edytowanie pliku szablonu strony w motywie, aby mógł on automatycznie wyświetlać strony potomne.
Aby to zrobić, musisz edytować główny strona.php szablon lub Utwórz niestandardowy szablon strony w swoim szablonie.
Możesz edytować swój główny motyw, ale te zmiany znikną, jeśli zmienisz lub zaktualizujesz swój motyw. Dlatego lepiej byłoby utworzyć motyw potomny, a następnie wprowadzić zmiany w motywie potomnym.
W pliku szablonu strony musisz dodać ten wiersz kodu, w którym chcesz wyświetlić strony potomne.
<?php wpb_list_child_pages ();?>
To wszystko. Twój motyw automatycznie wykryje strony podrzędne i wyświetli je na zwykłej liście.
Możesz dostosować style za pomocą CSS i formatowania. Oto przykład jak strona OptinMonster pokazuje Stronę nadrzędną i podstrony:
Mamy nadzieję, że ten artykuł pomógł Ci wyświetlić strony potomne dla strony nadrzędnej w WordPress. Możesz również zobaczyć nasz przewodnik po najważniejszych stronach do utworzenia na nowej stronie WordPress oraz nasze porównanie najlepszych kreatorów stron typu przeciągnij i upuść WordPress, aby tworzyć niestandardowe układy bez żadnego kodu.
Jeśli podoba Ci się ten artykuł, zasubskrybuj nasz kanał YouTube dla samouczków wideo WordPress. Znajdziesz nas również na Twitterze i Facebooku.
