Niestandardowe pola w WordPress: definicja, poradnik i przykłady użycia

Niestandardowe pola w WordPress (custom fields) umożliwiają dodawanie i wyświetlanie dodatkowych informacji w treści Twojej strony – poza tymi, które przewiduje domyślny edytor. Co więcej, dzięki nim Twoja strona może stać się bardziej dynamiczna i spersonalizowana.

Jeśli chcesz dowiedzieć się więcej o polach niestandardowych i sposobach ich użycia, ten artykuł zawiera wszystkie potrzebne informacje. Podamy również kilka przykładów ich zastosowania.

Zaczynajmy!

Czym są niestandardowe pola w WordPress?

Niestandardowe pola w WordPress to dodatkowe pola danych, pozwalające dodać do wpisów i stron informacje wykraczające poza domyślną treść. Dzięki nim zawartość Twojej strony może być bardziej dynamiczna i dostosowana do konkretnych potrzeb.

Przykładowe zastosowania pól niestandardowych to m.in. dodanie ceny produktu, czasu wykonania jakiejś czynności, daty wydarzenia czy oceny wpisu. Takie dodatkowe informacje uatrakcyjniają treść strony i czynią ją bardziej przydatną dla użytkowników.

Niestandardowe pola często wykorzystuje się w połączeniu z niestandardowymi typami wpisów oraz niestandardowymi szablonami wpisów, aby jeszcze bardziej rozbudować funkcjonalność strony.

Jeśli jeszcze nie znasz tych pojęć: niestandardowe typy wpisów pozwalają organizować treści według własnych kryteriów, niezależnie od domyślnej, blogowej struktury WordPress.

Z kolei niestandardowe szablony wpisów umożliwiają tworzenie unikalnych układów stron dopasowanych do rodzaju prezentowanej treści.

Dzięki tym trzem elementom (polom, typom wpisów i szablonom) możesz w pełni dostosować strukturę i wygląd swojej strony do własnej wizji.

Na przykład prowadząc stronę z ogłoszeniami nieruchomości, możesz utworzyć niestandardowy typ wpisu do prezentacji ofert, użyć niestandardowych szablonów do zdefiniowania ich układu oraz dodać niestandardowe pola na szczegóły każdej oferty (np. cena, metraż, lokalizacja itp.).

Jak włączyć niestandardowe pola we wpisach i stronach WordPress

Domyślnie funkcja pól niestandardowych jest w WordPress wyłączona – trzeba ją najpierw aktywować. Oto jak to zrobić:

1. Otwórz edytor dowolnego wpisu lub strony w WordPress.
2. Kliknij menu z opcjami (ikona trzech kropek) w prawym górnym rogu ekranu.
3. Wybierz Preferencje, a następnie w menu Ogólne rozwiń sekcję Zaawansowane.
4. Włącz opcję Niestandardowe pola.
5. Pojawi się przycisk Show & Reload Page (Pokaż i odśwież stronę). Kliknij go, aby odświeżyć edytor.

Po wykonaniu powyższych kroków panel Niestandardowe pola pojawi się na dole edytora treści.

Pola Name (Nazwa) i Value (Wartość) działają jak para klucz/wartość. Klucz to nazwa niestandardowego pola, a wartość to przypisana do niego informacja.

Dla przykładu utworzymy pole niestandardowe wyświetlające komunikat o wpisie sponsorowanym. Kliknij przycisk Enter new (Dodaj nowe), aby utworzyć nowe pole.

W naszym przykładzie nadaliśmy mu nazwę sponsored_post, a jako wartość wpisaliśmy następujący tekst:

To jest wpis sponsorowany. Mimo to zamieszczamy na stronie wyłącznie produkty i usługi, które uznajemy za wartościowe dla naszych czytelników.

Na koniec kliknij przycisk Add Custom Field (Dodaj pole niestandardowe).

Uwaga: WordPress przechowuje wartości pól niestandardowych tylko w panelu administratora. Aby wyświetlić dane takiego pola na stronie (front-endzie), musimy edytować pliki motywu.

Jak wyświetlić te pola na stronie

Przed przystąpieniem do dalszych kroków zalecamy utworzenie motywu potomnego. Dzięki temu możesz swobodnie eksperymentować z kodem, nie wpływając na główny motyw. Motyw potomny zapewni również zachowanie Twoich zmian nawet po aktualizacji motywu nadrzędnego.

W zależności od rodzaju motywu (klasyczny czy blokowy) kroki będą się różnić – omówimy oba przypadki osobno.

Klasyczne motywy

Przejdź do Wygląd -> Edytor plików motywu w panelu WordPress. Znajdź plik Single Post (single.php) – to w nim dodasz potrzebny kod.

Poniżej przedstawiamy prosty przykład kodu, który wyświetla wartość niestandardowego pola za pomocą funkcji get_post_meta():

<?php echo get_post_meta($post->ID, 'key', true); ?>

Pamiętaj, aby zamienić ‘key’ na nazwę utworzonego przez Ciebie pola.

Powyższy przykład pokazuje podstawowe zastosowanie funkcji WordPress do odczytywania niestandardowego pola. Bardziej zaawansowane przypadki użycia będą wymagały dodania dodatkowego kodu.

Teraz dodamy kod wyświetlający treść naszego pola sponsored_post (informacji o wpisie sponsorowanym):

$sponsored = get_post_meta(get_the_ID(), 'sponsored_post', true);

if (!empty($sponsored)) {

   echo '<p class="sponsored-disclaimer"><strong>Disclaimer:</strong> ' . esc_html($sponsored) . '</p>';

}

Aby wyświetlić ten komunikat na początku wpisu, umieść powyższy kod zaraz po linii while ( have_posts() ) : the_post();. Możesz też wkleić go w innym miejscu, jeśli chcesz wyświetlać informację w innej części wpisu.

Po dodaniu kodu kliknij Update File (Zaktualizuj plik), aby zapisać zmiany.

Kod, który stosujemy, nakazuje WordPress wyszukiwanie postów z niestandardowym polem sponsored_post i wyświetlanie ich wartości wraz z dodanym tekstem Informacja.

Motywy blokowe

Jeśli korzystasz z motywu blokowego, nie masz dostępu do pliku single.php. Zamiast tego będziemy musieli użyć shortcode (krótkiego kodu).

Posłużymy się tym samym przykładem, aby pokazać, jak wyświetlić pole niestandardowe w motywie blokowym Twenty Twenty-Five.

Przejdź do Narzędzia -> Edytor plików motywu i otwórz plik Theme Functions (functions.php). Przewiń na sam dół i dodaj poniższy kod:

function display_sponsored_disclaimer() {

   $sponsored = get_post_meta(get_the_ID(), 'sponsored_post', true);

   if (!empty($sponsored)) {

       return '<p class="sponsored-disclaimer"><strong>Informacja:</strong> ' . esc_html($sponsored) . '</p>';

   }

}

add_shortcode('sponsored_disclaimer', 'display_sponsored_disclaimer');

W razie potrzeby możesz zmodyfikować ten kod (np. zmienić treść komunikatu czy klasę CSS). Następnie kliknij Update File, aby zapisać zmiany.

Teraz otwórz edytor wpisu. Przejdź do miejsca, w którym chcesz wyświetlić to pole, i kliknij przycisk dodawania bloku ( + ).

Wybierz blok Shortcode, a w polu bloku wpisz utworzony shortcode.

W naszym przypadku będzie to [sponsored_disclaimer], zgodnie z nazwą ustawioną w pliku motywu. Zapisz wpis, aby zastosować zmianę.

Po zapisaniu zobaczysz, że na stronie front-end pojawiła się informacja o wpisie sponsorowanym.

Jak zarządzać polami niestandardowymi za pomocą wtyczki WordPress

Ręczne dodawanie pól niestandardowych wymaga edycji plików motywu, ale proces ten można uprościć za pomocą wtyczek. Do najlepszych wtyczek do obsługi pól niestandardowych należą m.in. Secure Custom Fields, Meta Field Block, Pods, Custom Field Suite i Carbon Fields.

Na przykładzie komunikatu o wpisie sponsorowanym pokażemy, jak wyświetlić pole niestandardowe bez programowania. Posłużymy się wtyczkami Secure Custom Fields (SCF) oraz Meta Field Block.

Najpierw zainstaluj i aktywuj obie wtyczki na swojej stronie WordPress. Następnie wykonaj poniższe kroki, aby dodać pole niestandardowe:

1. Przejdź do menu Secure Custom Fields (SCF) w kokpicie WordPress.
2. Kliknij przycisk Add Field w interfejsie edytora grupy pól (Field Group Editor).

3. Nadaj Grupie pól (Field Group) nazwę – najlepiej taką, która odzwierciedla jej przeznaczenie.
4. Wybierz typ pola Text – w tym przykładzie chcemy wyświetlać zwykły tekst.
5. Wypełnij pole Field Label (Etykieta pola), wpisując opisową nazwę dla pola.
6. Pole Field Name (Nazwa pola) zostanie automatycznie uzupełnione na podstawie etykiety, ale możesz je edytować w razie potrzeby.
7. Ustaw domyślną wartość (Default Value), która ma się pojawiać w polu. Możesz też zostawić to pole puste, jeśli chcesz wpisywać różne wartości dla różnych wpisów.

8. Przewiń w dół do sekcji Settings (Ustawienia), aby zmienić konfigurację pola.
9. Tym razem ustawimy tylko Location Rules (Reguły wyświetlania), określające, gdzie pole ma się pojawiać. W naszym przykładzie chcemy, aby było widoczne we wszystkich wpisach.

10. Kliknij Save Changes (Zapisz zmiany) w prawym górnym rogu.

Przy powyższych ustawieniach sekcja niestandardowego pola pojawi się w edytorze każdego wpisu WordPress.

Zauważ, że wygląd tej sekcji zależy od konfiguracji pola. Na przykład pole typu tekstowego będzie puste, jeśli nie ustawisz dla niego wartości domyślnej.

Na tym etapie pole i wpisana w nim wartość są widoczne tylko w panelu administratora. Standardowo, aby pokazać te dane odwiedzającym stronę, należałoby dodać odpowiedni kod do plików motywu.

Korzystając z wtyczki Meta Field Block, możesz jednak wyświetlić wartość pola na stronie bez kodowania. Wykonaj następujące kroki:

1. Otwórz edytor wpisu lub strony, na której chcesz pokazać pole niestandardowe.
2. Wybierz miejsce w treści, gdzie ma się pojawić informacja z tego pola, i kliknij przycisk dodawania bloku.
3. Dodaj blok Meta Field Block – w panelu ustawień po prawej stronie pojawią się opcje meta pola.
4. Z listy FIELD TYPE wybierz ACF – Advanced Custom Fields.
5. Wpisz nazwę pola (Field Name) ustawioną wcześniej. W naszym przypadku będzie to sponsored_post.

6. Zapisz wpis, aby zaimplementować zmiany.

W rezultacie tekst z niestandardowego pola pojawi się w opublikowanym wpisie.

Zalety pól niestandardowych WordPress

Głównym zadaniem pól niestandardowych jest przechowywanie i wyświetlanie dodatkowych danych, których nie można dodać za pomocą domyślnego edytora treści WordPress. Dzięki temu pomagają one w:

• Lepszej organizacji treści – niestandardowe pola umożliwiają lepszą strukturyzację danych poprzez dodanie do wpisu specyficznych informacji powiązanych z jego treścią.
• Większej personalizacji strony – pozwalają wyjść poza domyślne metadane WordPress, dając Ci większą swobodę w dostosowaniu strony dokładnie do swoich potrzeb.
• Dodawaniu danych bez użycia dodatkowych wtyczek – owszem, wiele wtyczek oferuje własne pola, ale korzystanie z natywnej funkcji pól niestandardowych pozwala utrzymać stronę „lżejszą” i szybszą.
• Ułatwieniu zarządzania dynamicznymi danymi – strony z ustrukturyzowaną treścią (katalogi, portfolio czy sklepy internetowe) mogą za pomocą pól niestandardowych sprawnie przechowywać i pobierać np. specyfikacje produktów, opinie klientów czy informacje o rezerwacjach.
• Poprawie SEO i doświadczenia użytkownika – niestandardowe pola mogą zawierać dane strukturalne (znaczniki schema), które zwiększają widoczność strony w wynikach wyszukiwania. Ponadto ułatwiają użytkownikom szybkie skanowanie treści na stronie i interakcję z nią.

Popularne zastosowania pól niestandardowych WordPress

Istnieje wiele sposobów na ulepszenie swojej strony WordPress za pomocą pól niestandardowych. Oto kilka realnych przykładów:

Ogłoszenia nieruchomości

Wykorzystaj niestandardowe pola do przechowywania informacji o ofertach nieruchomości, takich jak cena, lokalizacja, powierzchnia, liczba pokoi/łazienek czy status dostępności. Pozwala to stworzyć uporządkowane i filtrowalne listy ofert, znacznie poprawiając wygodę przeglądania strony z ogłoszeniami.

Produkty e-commerce

W przypadku sklepu internetowego niestandardowe pola świetnie sprawdzą się do dodania bardziej szczegółowych danych o produktach, takich jak numery SKU, wysokość rabatu, stan magazynowy, informacje o producencie czy wymiary produktu.

Wydarzenia

Na stronach poświęconych wydarzeniom możesz dodać niestandardowe pola dla daty, godziny, miejsca, ceny biletów, listy wykonawców czy linków do rejestracji (RSVP). Zapewnienie takich informacji w uporządkowany sposób poprawi doświadczenie użytkowników, którzy znajdą wszystkie szczegóły wydarzenia w jednym miejscu.

Strony z przepisami

Dodaj do wpisów z przepisami kulinarnymi niestandardowe pola zawierające takie dane jak czas przygotowania, czas gotowania, liczba porcji, lista składników, wartość kaloryczna czy informacje o diecie. Tak ustrukturyzowane przepisy są czytelniejsze i ułatwiają użytkownikom podążanie za instrukcjami.

Recenzje książek

Na blogu z recenzjami książek możesz za pomocą pól niestandardowych wyświetlać dodatkowe informacje o książce: autora, gatunek literacki, rok wydania, liczbę stron, średnią ocen czy własną ocenę recenzenta. Dzięki temu czytelnicy zyskają szybki podgląd kluczowych danych o książce jeszcze przed przeczytaniem pełnej recenzji.

Strony portfolio

Jeśli jesteś freelancerem lub prowadzisz agencję, rozważ użycie pól niestandardowych do prezentacji swoich projektów. Możesz dodać takie elementy jak nazwa klienta, opis projektu, wykorzystane technologie, data ukończenia prac czy link do gotowej realizacji – wszystko to w formie dodatkowych pól na stronie portfolio.

Podsumowanie

Niestandardowe pola w WordPress pozwalają dodać do treści dodatkowe informacje, sprawiając, że Twoja strona staje się bardziej dynamiczna i spersonalizowana.

W tym poradniku przedstawiliśmy, jak krok po kroku tworzyć i używać niestandardowe pola w WordPress – zarówno ręcznie (poprzez kod), jak i za pomocą dedykowanych wtyczek. Pokazaliśmy również przykłady, jak najlepiej je wykorzystać w różnych scenariuszach.

Mamy nadzieję, że ten poradnik ułatwi Ci pracę z polami niestandardowymi na Twojej stronie WordPress. Zacznij eksperymentować i daj nam znać w komentarzu, jak Ci poszło!

Niestandardowe pola WordPress – FAQ