Pravljenje interfejsa

Da bi napravili novi wordpress custom meta box potrebne su dve custom funkcije. Prva funkcije je glavna, ona pravi novi meta box (definiše naziv i label-u) i poziva drugu koja služi da prikaže unutrašnjost meta box-a.

Okvir meta box-a

U prethodnom primeru za aktiviranje meta box-a je napravljena custom funkcija wpp_add_meta_box() a unutar nje se koristi wordpress-ova funkcija add_meta_box():

add_meta_box()

Gde su parametri:

  • $id
    (string) (obavezno) HTML ‘id’ atribut
  • $title
    (string) (obavezno) Naziv vidljiv krajnjem korisniku
  • $callback
    (callback) (Obavezno) Funkcija koja ispisuje HTML na ekran. Prihvata max dva argumenta:
    1.) $post objekat za post ili stranicu koja se trenutno gleda
    2.) $metabox (niz)
  • $screen
    (string) (opciono) Tip na kome će se pojaviti meta box (Može biti: ‘post’,’page’,’dashboard’,’link’,’attachment’,’custom_post_type’,’comment’ where custom_post_type is the custom post type slug)
  • $context
    (string) (opciono) Deo ekrane gde se prikazuje odeljak “edit” (‘normal’, ‘advanced’, or ‘side’).
  • $priority
    (string) (Opciono) Prioritet koji odredjuje mesto gde će se prikazati (‘high’, ‘core’, ‘default’ or ‘low’)
  • $callback_args
    (array) (Opciono) Argumenti koji se prosledjuju callback funkciji. Callback funkcija će primiti $post objekat sa prosledjenim argumentima.

Unutrašnjosti Meta box-a

Ova druga funkcija tzv. callback function pravi unutrašnju formu meta box-a i poziva se iz prve funkcije koja pravi meta box okvir. Srž unutrašnjosti je najčešće HTML forma koja dozvoljava unos podataka.

Radi sigurnosti je neophodno koristiti zaštitu od malicioznog unosa pa ćemo unutar funkcije napraviti nonce, koji će kasnije pre snimanja podataka u bazu biti verifikovan.

Ukoliko je unešena vrednost polja i sačuvana u bazu neophodno je da to bude vidljivo u interfejsu tj. da ne nestane vrednost iz polja nakon akcije SAVE. Iz tog razloga je potrebno dodati deo koda koji vraća u polje vrednost polja.

Primer br.1

Kada se sve prethodno navedeno uzme u obzir funkcija bi ovako izgledala:

Primer br.2

Ukoliko se unutar meta box-a koristi input polje preko koga se unosi datum onda bi zbog dobrog “user experience” bilo dobro koristiti date picker. Date picker u sledećem primeru ćemo koristiti iz jQuery UI biblioteke.

Čuvanje podataka custom filds-a

We need to verify this came from our screen and with proper authorization, because the save_post action can be triggered at other times.

Meta box generator

Online generator

Odličan wordpres generator koda možete pogledati na stranici
http://jeremyhixon.com/tool/wordpress-meta-box-generator-v2-beta/

Evo generisanog koda za jedan label i jedan check box:

ACF plugin

ACF je plugin koji pravi meta box-ove i unutar njih prilagodjene custom filds-e.

Podelite:

Ostavite komentar