Återanvända anpassade Meta Boxes Del 3 Extra Fields

I del 1 och del 2 i vår anpassade meta box template-handledningsserie lärde vi oss hur man skapar en fältmatris för att slingra igenom och skapa en anpassad metakassa med dina standardfält. Låt oss nu kasta in lite JavaScript för några snygga men mycket användbara fält.

Datumväljare

Alla fält som vi täcker i den här handledningen kräver jQuery och jQuery UI. Tack och lov, WordPress gör det super lätt att använda dessa med wp_enqueue_script, och från och med 3.3, är alla jQuery UI-interaktioner och widgets buntade med WordPress.

Eftersom vi arbetar på en sida som redan kalkylerar jQuery kan vi hoppa över det, men vi måste få jQuery UI Datepicker. Vi måste också skapa vårt eget stilark eftersom den nödvändiga CSS inte kommer med i WordPress ännu, även om de jobbar ut det.

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

Vi behöver bara ladda dessa i admin, och inte på den främre änden av webbplatsen, så sätta in funktionerna i en villkorlig. Den första funktionen kallar datumpicker och laddar även jQuery UI Core. Den andra funktionen kommer att ringa vårt jquery-ui-custom.css stilark från temas css-mapp. Exemplet stilark som ingår i hämtningen i början av denna handledning kräver inte bilder. Du kan också skapa ditt eget tema för jQuery UI.

Låt oss nu titta på det arrayobjekt vi behöver lägga till i vårt $ custom_meta_fields array vi började i del 1.

 array ('label' => 'Date', 'desc' => 'En beskrivning för fältet.', 'id' => $ prefix.'date ',' type '=>' date ')

Denna array är nästan identisk med vårt textobjekt. Den har en huvudetikett, en beskrivning, ett unikt id och datatypen definieras. Vi ska bara gå med en grundläggande implementering av datumväljaren i vårt exempel här, men om du behöver krydda din användning av datumväljaren, kan du också lägga till annan information i arrayen, t.ex. det föredragna formatet, lokalisering , och datumintervall för att nämna några. Då kan du använda den informationen i följande skriptsökare som vi behöver lägga till i sidans huvud:

 add_action ( 'admin_head', 'add_custom_scripts'); funktion add_custom_scripts () global $ custom_meta_fields, $ post; $ output = ''