Share
Astăzi aș vrea să vă arăt cum să adăugați cu ușurință barele personalizate personalizate pentru a le utiliza în cadrul postărilor și paginilor dvs. Ar putea fi util să afișați widget-uri diferite în funcție de subiectul paginii sau postului dvs..
Vom vedea cum să utilizați casetele meta WordPress pentru a stoca și a prelua o bara laterală aleasă pentru un anumit post. Panourile personalizate personalizate vor fi adăugate în secțiunea opțiuni tematice.
M-am ocupat de plug-in-ul logic mare widget pentru a afișa widget-uri diferite pe pagini diferite, dar pagina widget-uri a devenit foarte fuzzy și greu de întreținut. Deci, de ce nu folosiți mai multe bare laterale și alegeți care dintre ele să fie afișate pe un anumit post? Asta voi acoperi în acest tutorial.
În acest tutorial, voi folosi marea temă WordPress Twenty Eleven pentru a demonstra cum să folosiți barele personalizate în tema dvs..
În primul rând, vom adăuga un nou set în Aspect -> Opțiuni tematice. Puteți să consultați acest tutorial minunat pentru a vedea cum să adăugați setări.
Deschide temă-options.php fișier, situat în twentyeleven / inc și adăugați acest cod la sfârșitul secțiunii twentyeleven_theme_options_init () funcţie:
Accentsconagua
add_settings_field ('custom_sidebar', __ ('Bară laterală personalizată', 'twentyeleven'), 'twentyeleven_settings_field_custom_sidebar', 'theme_options', 'general'); Apoi adăugați o valoare implicită (o matrice goală) la valorile implicite ale opțiunilor tematice, la sfârșitul secțiunii twentyeleven_get_default_theme_options () funcţie:
$ default_theme_options = array ('color_scheme' => 'light', 'link_color' => twentyeleven_get_default_link_color ('light'), 'theme_layout' => 'content-sidebar', 'custom_sidebar' => array (); Acum vom crea funcția de apel invers care gestionează afișarea setării.
Să adăugăm niște jQuery pentru a gestiona interacțiunile cum ar fi adăugarea și eliminarea barelor laterale, care sunt în esență câteva elemente de listă care conțin o intrare ascunsă. De asemenea, vom genera acele elemente din lista de laterale salvate deja salvate.
function twentyeleven_settings_field_custom_sidebar () // Preluare opțiuni temă $ opts = twentyeleven_get_theme_options (); // Un pic de jQuery pentru a trata interacțiunile (adăugați / eliminați barele laterale) $ output = ""$ output. =""$ output. =""; echo $ output;"$ output. ="
"// Afișează fiecare bara laterală personalizată dacă ($ opts ['custom_sidebar'])) $ i = 0; foreach ($ opts ['custom_sidebar'] ca $ sidebar) $ output.
"$ output. ="- "$ Bara laterală." ".__ (" șterge ", numele numelui $)."
"$ i ++; $ output. ="
În cele din urmă, adăugați acest cod în twentyeleven_theme_options_validate () funcția de dezinfectare și validare a formularului:
dacă isset ($ input ['custom_sidebar'])) $ ieșire ['custom_sidebar'] = $ input ['custom_sidebar'];
În acest moment, ar trebui să puteți gestiona și salva barele personalizate personalizate în cadrul temei. De exemplu, să creați o nouă bara laterală personalizată numită "Bara mea personalizată". Pagina cu opțiuni tematice ar trebui să arate astfel:
Acum suntem capabili să adăugăm bare laterale personalizate, trebuie să le facem Inregistreaza-te astfel încât să poată apărea în pagina de administrare a widgeturilor.
În tema Twenty Eleven, acest lucru se face în cadrul twentyeleven_widgets_init () funcţie. Deci, la sfârșitul acestei funcții, adăugați aceasta:
$ opțiuni = twentyeleven_get_theme_options (); dacă is_set ($ opțiuni ['custom_sidebar']) && sizeof ($ opțiuni ['custom_sidebar'])> 0) foreach ($ options ['custom_sidebar'] ca $ sidebar) register_sidebar (array __ ($ sidebar, 'twentyeleven'), 'id' => generateSlug ($ sidebar, 45), 'before_widget' =>"," anterior_title "=> '',' după_title '=>'
',));
Obținem opțiuni tematice, verificăm dacă există cel puțin o bară laterală personalizată și o înregistrează. Noi folosim o funcție rapidă a genera un cioc din numele bara laterală pentru a fi utilizat ca ID bara laterală.
funcția generateSlug ($ phrase, $ maxLength) $ result = strtolower ($ phrase); $ result = preg_replace ("/ [^ a-z0-9 \ s -] /", "", $ rezultat); $ result = trim (preg_replace ("/ [\ s -] + /", "", $ rezultat)); $ result = trim (substr ($ rezultat, 0, $ maxLength)); $ result = preg_replace ("/ \ s /", "-", $ rezultat); returneaza rezultatul $; Acum, du-te la Aspect -> Widgeturi și ar trebui să vedeți noua noastră bara laterală personalizată.
Acum sunt disponibile barele laterale personalizate, vom adăuga o casetă meta pentru a afișa o listă cu toate barele laterale disponibile în cadrul formularului de editare post.
Dacă nu sunteți familiarizați cu căsuțele meta, puteți să consultați aceste linkuri:
add_meta_box pe codul WordPressAcum să săpăm codul.
Mai întâi, vom adăuga pur și simplu casetele noastre de meta. Trebuie să declarăm două casete meta, una pentru posturi și una pentru pagini. Trebuie, de asemenea, să înregistrăm două cârlige, una pentru a adăuga casete meta și cealaltă pentru a le salva.
Deschide-te functions.php fișier și adăugați aceasta:
/ * Definiți caseta personalizată * / add_action ('add_meta_boxes', 'add_sidebar_metabox'); add_action ('save_post', 'save_sidebar_postdata'); / * Adaugă o casetă în coloana laterală în ecranele de editare post și pagină * / funcția add_sidebar_metabox () add_meta_box ('custom_sidebar', __ ('Custom Sidebar', 'twentyeleven'), 'custom_sidebar_callback' latură' ); add_meta_box ('custom_sidebar', __ ('Custom Sidebar', 'twentyeleven'), 'custom_sidebar_callback', 'page', 'side'); Acum, să creăm custom_sidebar_callback , care va imprima marcajul meta-casetelor.
Există mai mulți pași cheie în această funcție:
$ wp_registered_sidebars variabil./ * Imprimă conținutul cutiei * / funcția custom_sidebar_callback ($ post) global $ wp_registered_sidebars; $ custom = get_post_custom ($ post-> ID); dacă (isset ($ custom ['custom_sidebar'])) $ val = $ personalizat ['custom_sidebar'] [0]; altfel $ val = "implicit"; // Utilizați nonce pentru verificare wp_nonce_field (plugin_basename (__FILE__), 'custom_sidebar_nonce'); // Câmpurile reale pentru introducerea datelor $ output = '„; $ output. = ""; echo $ output;
Acum să salvăm postul nostru meta. Din nou, câțiva pași aici:
/ * Când postul este salvat, salvează datele personalizate * / funcția save_sidebar_postdata ($ post_id) // verificați dacă aceasta este o rutină de salvare automată. // Dacă formularul nostru nu a fost trimis, nu vrem să facem nimic dacă (definit ('DOING_AUTOSAVE') && DOING_AUTOSAVE) se întoarce; // verificați dacă aceasta a venit de pe ecranul nostru și cu o autorizație corespunzătoare, // deoarece save_post poate fi declanșată în alte momente dacă (! wp_verify_nonce ($ _POST ['custom_sidebar_nonce'], plugin_basename (__FILE__))) retur; dacă (! current_user_can ('edit_page', $ post_id)) retur; $ date = $ _POST ['custom_sidebar']; update_post_meta ($ post_id, "custom_sidebar", $ date); Acum ar trebui să vedeți această casetă în pagina de editare post, în coloana din dreapta. Dacă nu, verificați dacă caseta bara laterală personalizată este afișată în panoul cu opțiuni de ecran de sus.
Acum, totul este setat corect, ceea ce rămâne să facem este să actualizăm fișierele noastre de template pentru a le putea afișa barele personalizate personalizate.
Să creați o pagină nouă bazată pe bara laterală șablon (disponibil în caseta atributelor paginii). Acest șablon se bazează pe Sidebar-page.php fişier. Editați acest fișier și adăugați aceste linii în partea de sus (sub antetul comentat al șablonului):
$ opțiuni = get_post_custom (get_the_ID ()); dacă (isset ($ opțiuni ['custom_sidebar'])) $ sidebar_choice = $ opțiuni ['custom_sidebar'] [0]; altceva $ sidebar_choice = "implicit";
Obținem meta date postale actuale pentru a obține bara laterală aleasă.
La intrerupator între bara laterală particularizată și cea implicită, schimbați get_sidebar () apelați în partea de jos a aceluiași fișier la:
dacă ($ sidebar_choice && $ sidebar_choice! = "implicit") get_sidebar ("personalizat"); altceva get_sidebar (); get_sidebar ($ slug) solicită Sidebar-slug.php. Deci, ceea ce trebuie să facem este să creați un fișier numit Sidebar-custom.php și adăugați acest lucru în interior:
$ opțiuni = get_post_custom ($ post-> ID); $ sidebar_choice = $ opțiuni ['custom_sidebar'] [0]; ?>
Acum, pagina dvs. ar trebui să afișeze bara laterală pe care ați ales-o. De exemplu, am adăugat două widgeturi în bara mea personalizată:
Nu voi acoperi cum să aplicați acest lucru postărilor, deoarece este exact același comportament, trebuie doar să îl actualizați Conținutul-single.php fișier pentru a gestiona barele personalizate personalizate.
Toate astea! Acum poți folosi bare laterale nelimitate pentru paginile și postările dvs. Aceasta este doar o soluție printre altele, dar este a rapid și ușor modalitatea de a implementa barele personalizate, deci nu ezitați să lăsați un comentariu, să vă împărtășiți ideile și să oferiți feedback!
