Gjenbrukbare tilpassede meta bokser Del 3 Ekstra felter

I del 1 og del 2 i vår tilpassede meta-boks mal-opplæringsserie lærte vi hvordan du lager et feltfelt for å løse gjennom og lage en tilpasset meta-boks med standardfeltene dine. La oss nå kaste inn litt JavaScript for noen fancy, men svært nyttige felt.

Datovelger

Hvert av feltene vi dekker i denne opplæringen vil kreve jQuery og jQuery UI. Heldigvis gjør WordPress det super enkelt å bruke disse med wp_enqueue_script, og fra og med 3.3, er alle jQuery UI-interaksjonene og widgene buntet med WordPress.

Siden vi jobber på en side som allerede erkjenner jQuery, kan vi hoppe over det, men vi må få jQuery UI Datepicker. Vi må også lage vårt eget stilark siden det nødvendige CSS ikke kommer med i WordPress enda, selv om de jobber det ut.

 hvis (is_admin ()) wp_enqueue_script ('jquery-ui-datepicker'); wp_enqueue_style ('jquery-ui-custom', get_template_directory_uri (). '/ css / jquery-ui-custom.css'); 

Vi trenger bare å laste disse inn i administrasjonen, og ikke på forsiden av nettstedet, så pakk funksjonene på en betinget måte. Den første funksjonen kaller datepicker og vil også laste jQuery UI Core. Den andre funksjonen vil ringe vår jquery-ui-custom.css stilark fra temaets css-mappe. Eksempler stilarket inkludert i nedlastingen i begynnelsen av denne opplæringen krever ikke bilder. Du kan også lage ditt eget jQuery UI-tema.

La oss nå se på elementet som vi må legge til i vår $ custom_meta_fields array vi startet i del 1.

 array ('label' => 'Date', 'desc' => 'En beskrivelse for feltet.', 'id' => $ prefix.'date ',' type '=>' date ')

Dette arrayet er nesten identisk med vårt tekstelement. Den har en hovedetikett, en beskrivelse, et unikt id, og datatypen er definert. Vi skal bare gå med en grunnleggende implementering av datovelgeren i vårt eksempel her, men hvis du trenger å spice opp bruken av dataplukkeren, kan du også legge til annen informasjon i arrayet, for eksempel det foretrukne formatet, lokalisering , og datoperiode for å nevne noen få. Deretter kan du bruke denne informasjonen i følgende skriptoppringer vi må legge til i hodet på siden:

 ADD_ACTION ( 'admin_head', 'add_custom_scripts'); funksjon add_custom_scripts () global $ custom_meta_fields, $ post; $ output = ''