Spis treści
Na szczęście jest to jeszcze łatwiejsze, niż dodawanie własnych pól. Brzmi niewiarygodnie… chyba? Tak mi się zdawało, jak sam się tego uczyłem. W końcu sekcja, „naczynie” na pola a tu łatwiej? Jak to tak? Ano, łatwiej.
Do dodawania własnej sekcji służy funkcja add_settings_section. Przeanalizujmy sobie jej parametry:
|
1 2 3 4 5 6 |
add_settings_section( string $id, string $title, callable $callback, string $page ) |
$id to identyfikator naszej sekcji. Pamiętacie np. default, post_via_email czy avatars z poprzedniej części? To właśnie były identyfikatory sekcji.
$title to nic innego jak tytuł naszej sekcji
$callback a tutaj możemy wstawić choćby funkcję anonimową i wyświetlić opis sekcji, żeby pokazać użytkownikowi o co w ogóle z naszymi polami chodzi.
$page identyfikator strony do której dodamy naszą sekcję.
Jeszcze z uwag – do sekcji możemy w ogóle nie dodawać pól i od tego właśnie zaczniemy. Podczepimy się pod stronę „Pisanie”, bo tak, ale podczepić się możemy pod dowolną stronę z zastrzeżeniami, że np. „misc” czy „privacy” nie zadziała (pisałem o tym w notatce w poprzedniej części). I zaczniemy z „czystym kontem”, aby poprzednie ustawienia nie „wchodziły nam w drogę”.
Wyszło nam coś takiego:
|
1 2 3 4 5 |
add_action( 'admin_init', function () { add_settings_section( 'automatic_titles', 'Automatyczne dodatki do tytułów', function ( $args ) { echo '<p>W tej sekcji możesz użyć automatycznych dodatków do tytułów</p>'; }, 'writing' ); } ); |
A jak to wygląda w praktyce?
Oczywiście zamieszczanie takiej pustej sekcji mija się nieco z celem, prawda? Chyba, że chcemy rozbudować pomoc WordPress na którejś stronie… Dodajmy więc jakieś pola. Tym razem dodamy pola nieco inne niż dotychczas, aby pokazać, że też takie możemy budować.
No, to zaczynamy.
Własne pola w sekcji
Co postanowiłem Wam pokazać? Ano, postarałem się zrobić taki misz-masz, żeby każdy wybrał dla siebie coś ciekawego.
- Pierwszą opcją będzie „Do czego dodawać?”. To nam pozwoli pokazać dwie rzeczy. Pierwszą jest użycie przycisków typu „radio”. Drugą – dodanie dodatkowego opisu tak, żeby wyglądał jak na innych stronach z ustawieniami.
- Drugą opcją będzie „Gdzie dodawać?” co pozwoli na wybór (pola typu „checkbox”) czy dodajemy z przodu, czy z tyłu, czy z przodu i tyłu. Dodatkowo, gdy któraś z tych opcji będzie zaznaczona, pojawi się pole tekstowe, gdzie wpiszemy co dodawać z przodu a co z tyłu.
- Ostatnią opcją będzie wybór (pole typu „select”) do której kategorii dodawać nasze dodatki.
Za chwilę opiszę dokładnie co robię i dlaczego a póki co, działający kod źródłowy:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 |
<?php /* Plugin Name: Test opcje Plugin URI: https://wpkurs.pl/ Description: Wtyczka, która pokazuje jak stworzyć Ustawienia za pomocą WordPress API Author: Łukasz Nowicki Version: 0.1.1 Author URI: https://lukasznowicki.info/ Requires at least: 5.4 Tested up to: 5.4 Requires PHP: 7.4 */ add_action( 'admin_init', function () { add_settings_section( 'automatic_titles', 'Automatyczne dodatki do tytułów', function ( $args ) { echo '<p>W tej sekcji możesz użyć automatycznych dodatków do tytułów</p>'; }, 'writing' ); add_settings_field( 'at_where_add', 'Do czego dodawać?', function ( $args ) { ?> <p> <label for="at_where_add_nowhere"> <input id="at_where_add_nowhere" type="radio" name="<?php echo $args['id']; ?>" value="0" <?php checked( '0', get_option( $args['id'], '0' ) ); ?>> Nie dodawaj nigdzie</label> <br> <label for="at_where_add_posts"> <input id="at_where_add_posts" type="radio" name="<?php echo $args['id']; ?>" value="1" <?php checked( '1', get_option( $args['id'], '0' ) ); ?>> Do wpisów</label> <br> <label for="at_where_add_pages"> <input id="at_where_add_pages" type="radio" name="<?php echo $args['id']; ?>" value="2" <?php checked( '2', get_option( $args['id'], '0' ) ); ?>> Do stron</label> </p> <p class="description">Wybierz sobie opcję dodawania tekstów</p> <?php }, 'writing', 'automatic_titles', [ 'id' => 'at_where_add' ] ); register_setting( 'writing', 'at_where_add' ); add_settings_field( 'at_add_position', 'Gdzie dodawać?', function ( $args ) { add_action( 'admin_footer', function () { echo "<script> jQuery(function($) { $('.toggleIfChecked').change(function() { $( '#' + $(this).prop('id') + '_toggle' ).toggle(100); }); }); </script>"; } ); $at_add_position_begin = ( get_option( $args['id'], '0' )[0] ); $at_add_position_end = ( get_option( $args['id'], '0' )[1] ); ?> <p> <label for="at_add_position_begin"> <input id="at_add_position_begin" class="toggleIfChecked" type="checkbox" name="<?php echo $args['id']; ?>[0]" value="1" <?php checked( '1', $at_add_position_begin ) ?>> Na początku</label> </p> <p id="at_add_position_begin_toggle"<?php echo ( '1' !== $at_add_position_begin ) ? ' style="display:none;"' : '' ?>> <label for="at_add_begin_text"> <input id="at_add_begin_text" name="at_add_begin_text" type="text" value="<?php echo esc_attr( get_option( 'at_add_begin_text', '' ) ); ?>"></label> </p> <p> <label for="at_add_position_end"> <input id="at_add_position_end" class="toggleIfChecked" type="checkbox" name="<?php echo $args['id']; ?>[1]" value="1" <?php checked( '1', $at_add_position_end ) ?>> Na końcu</label> </p> <p id="at_add_position_end_toggle"<?php echo ( '1' !== $at_add_position_end ) ? ' style="display:none;"' : '' ?>> <label for="at_add_end_text"> <input id="at_add_end_text" name="at_add_end_text" type="text" value="<?php echo esc_attr( get_option( 'at_add_end_text', '' ) ); ?>"></label> </p> <?php }, 'writing', 'automatic_titles', [ 'id' => 'at_add_position' ] ); register_setting( 'writing', 'at_add_position' ); register_setting( 'writing', 'at_add_begin_text' ); register_setting( 'writing', 'at_add_end_text' ); add_settings_field( 'at_only_in_category', '<label for="at_only_in_category">Dodawaj tylko w tej kategorii</label>', function ( $args ) { $categories = get_categories( [ 'orderby' => 'name', 'order' => 'ASC', 'parent' => 0, 'hide_empty' => false, ] ); $selectedOption = (int) get_option( $args['id'], '0' ); ?> <p> <select id="<?php echo $args['id']; ?>" name="<?php echo $args['id']; ?>"> <?php $selected = ( ( 0 === $selectedOption ) ? ' selected="selected"' : '' ); ?> <option value="0"<?php echo $selected; ?>>— W każdej kategorii —</option> <?php foreach ( $categories as $category ) : $selected = ( $category->term_id === $selectedOption ) ? ' selected="selected"' : ''; ?> <option value="<?php echo $category->term_id; ?>"<?php echo $selected; ?>><?php echo $category->name; ?></option> <?php endforeach; ?> </select> </p> <?php }, 'writing', 'automatic_titles', [ 'id' => 'at_only_in_category' ] ); register_setting( 'writing', 'at_only_in_category' ); } ); |
Teraz, poglądowo, jak to wygląda w działaniu:
Skoro już wszystko wiecie, to teraz
Jak to działa?
Ano, jak widzicie, nie jest to takie trudne, świetnie wygląda w panelu WordPress, jakby sami twórcy to tam wsadzili. A pozwala nam na pełną kontrolę. Ale od początku:
W liniach 16-18 tworzymy swoją sekcję. Nadajemy jej ID automatic_titles i wyświetlamy opis. W zmiennej $args dostajemy parę informacji, np. tytuł sekcji, ale że jego generowaniem zajmuje się WordPress, nie musimy się tym przejmować.
W liniach 20-36 tworzymy sobie pierwszą opcję, którą są przyciski typu „radio”. Tutaj też nie ma nic niezwykłego, trochę HTMLu, sprawdzanie opcji i to w zasadzie wszystko. To samo co „text”, tylko nieco bardziej rozbudowane w strukturze. Kod sam się tłumaczy.
W liniach 38-72 dzieje się dużo więcej, sporo ciekawszych rzeczy. Po pierwsze, definiujemy sobie pole at_add_position. To pole to tablica – i to już jest pierwsza zmiana. Jak do tej tablicy przypisujemy wartości, widać w liniach 53 i 61, bo to tablica dwuelementowa. Dzięki zastosowaniu indeksu [0] i [1], konkretna wartość zawsze jest w konkretnym miejscu. I to by nie było nic niezwykłego, poza zaprezentowaniem tablicy, gdyby nie linie 55-58 i 63-66.
Zobaczymy tam, że obsługujemy INNE pola w funkcji, która w teorii odpowiada za pole at_add_position. We wspomnianych liniach obsługujemy at_add_begin_text oraz at_add_end_text co pokazuje nam, że możemy w funkcjach mieszać zmienne, bez żadnej szkody dla kodu.
Kolejna niezwykła rzecz to linie 71-72, gdzie rejestrujemy te dodatkowe pola. Zwróćcie proszę uwagę na to, że dla tych pól brakuje wywołania funkcji add_settings_field! To bardzo ważne, aby pamiętać, że ta funkcja wcale nie jest obowiązkowa. Ona daje nam miejsce, pozwala renderować pole, ale wcale nie musimy tego robić. Wystarczy, że pole właściwie zarejestrujemy, WordPress i tak je obsłuży!
Ostatnią „inną” rzeczą tutaj, są linie 39-47. W tych liniach dodajemy kod JavaScript (korzystając z jQuery, które jest ładowane na stronach z opcjami, nie musimy się o to martwić), który zapewnia nam mechanizm chowania/pokazywania pól tekstowych w zależności od stanu pól typu „checkbox”. Nie jest to skomplikowane, ale zaznaczam, że można tak zrobić.
W liniach 74-97 rejestrujemy ostatnie pole, tym razem listę rozwijaną (select). To też jest dosyć trywialne, pozostawiam to jako przykład, jak to zrobić.
Teraz już wiecie, jak dodawać swoje pola do istniejących sekcji, wiecie też, jak dodawać własne sekcje do istniejących stron. Mam nadzieję, że te siedem części… ale, ale, ale. Nie powinienem pisać podsumowania, bo przecież nie skończyliśmy!