Construirea unui personalizat Căutați după categorie Plugin WordPress

Cu o cantitate din ce în ce mai mare de conținut pe site-ul dvs. Wordpress, utilizatorii dvs. vor trebui în mod inevitabil să caute site-ul dvs. pentru a găsi acel articol util din calea înapoi. Pentru a ajuta la restrângerea rezultatelor căutării, vă voi arăta cum să codificați un plugin care permite utilizatorului să caute în funcție de categorie.

Acest tutorial include un screencast disponibil pentru membrii Tuts + Premium.

Primul pas în dezvoltarea plugin-ului nostru este de a decide asupra setului de funcții pe care îl va avea, plus cantitatea de personalizare disponibilă. Vrem ca plugin-ul nostru să aibă următoarele caracteristici și să permită personalizarea completă a utilizatorului:

  1. Reconfigurați căutarea pe baza categoriei selectate
  2. Listă derulantă de categorii
  3. Abilitatea de a ascunde categoriile fără postări din listă
  4. Abilitatea de a exclude categoriile de copii din listă
  5. Opton pentru a dezactiva stilul nostru încorporat
  6. Abilitatea de a exclude anumite categorii din listă
  7. Abilitatea de a utiliza valoarea particularizată în caseta de căutare
  8. Abilitatea de a utiliza valoarea personalizată pentru selectarea "În toate categoriile"

Crearea scheletului pentru plugin

Înainte de a putea face ceva în plugin-ul nostru, trebuie să construim mai întâi scheletul pentru pluginul în care să lucrăm. Vom începe prin crearea unui nou director în directorul "plugins" (/ wp-content / plugins) din Wordpress și îl vom numi "Search-by-categorii" (prin convenție, toate dosarele plugin-urilor ar trebui să fie toate cu litere mici și să folosească liniuțe în locul spațiilor, astfel încât atunci când link-ul către fișierele din adresele URL ale folderului să fie ușor de citit de ochiul uman). Creați un nou fișier PHP în dosarul intitulat "Sbc.php", acest fișier va servi ca bază pentru întreaga noastră structură de plugin. Completați în continuare, în plugin-ul cu informațiile Wordpress necesare, astfel încât acesta să apară în panoul nostru WP-Admin.

 


Configurați pagina Opțiuni

Acum că Wordpress recunoaște plugin-ul nostru, putem începe dezvoltarea noastră. Primul lucru pe care trebuie să-l facem este să configurați o pagină de opțiuni astfel încât să putem lăsa utilizatorul să configureze pluginul în funcție de preferințele lor. Cum funcționează acest lucru este un proces în trei etape:

primul vom crea o clasă pentru toate configurațiile noastre pentru a funcționa în interior.

 dacă (! class_exists ('SBC_Admin')) clasa SBC_Admin 

Al doilea rulam o funcție pentru a crea pagina de configurare.

 // optiuni de pregatire pagina de inserare a functiilor add_config_page () if (function_exists ('add_submenu_page')) add_options_page ('Cauta dupa Categorie Optiuni', ' config_page ')); 

Configurarea personalizării

Acum, dacă avem pagina noastră de configurare, putem începe adăugarea în opțiunile noastre de configurare pentru ca noi să putem aplica ulterior în plugin. Pentru a afișa pagina noastră de configurare, va trebui să creați o nouă funcție numită "Config_page ()" pe care o vom umple cu restul codului secțiunii de admin. Mai întâi vom merge mai departe și vom scrie codul HTML pentru toate secțiunile noastre.

 

Căutați după opțiunile categoriei

/>
/>
/> * Stylingul nu se afișează corect în IE7 și mai devreme *

Veți observa că deja folosim PHP pentru a face referire la variabilele: $ text_căutare, $ focus, $ hide_empty, $ exclude_child, $ sbc_style, și $ raw_excluded_cats (în funcție "Wp_category_checklist"). Vom crea și extinde aceste variabile în pasul următor.



Full Screencast



Adăugarea opțiunilor noastre la baza de date

Acum, că pagina de administrare este în curs de funcționare, putem începe să o folosim pentru a adăuga opțiuni la baza de date. Pentru a face acest lucru, pur și simplu vom crea o variabilă înainte de "dacă (! class_exists ('SBC_Admin')) " și apoi utilizați funcția Wordpress "add_option ( 'intrare-titlu', 'valoare')"să o inserați în wp_options tabel al PB. Iată lista variabilelor pe care le vom folosi în pluginul nostru:

  • $ focus - Textul implicit pe care îl afișează vizualizatorul în meniul derulant de selectare
  • $ hide_empty - true sau false, elimină categoriile cu 0 postări din meniul derulant
  • $ excluded_cats - o matrice separată prin virgulă a categoriilor excluse
  • $ raw_excluded_cats - dintre categoriile excluse
  • $ text_căutare - Textul implicit în caseta de căutare a formularului
  • $ exclude_child - true sau false, elimină categoriile de copii din meniul derulant
  • $ sbc_style - true sau false, utilizați foaia de stil SBC personalizată
 // Unele setări implicite $ focus = 'În toate categoriile'; $ hide_empty = '1'; // 1 înseamnă adevărat $ excluded_cats = array (); $ search_text = 'Căutați ...'; $ exclude_child = '0'; // 0 înseamnă falsă $ raw_excluded_cats = array (); $ sbc_style = '1'; // Introduceți setările implicite în tabela "wp-options" add_option ("sbc-focus", focus $); add_option ("sbc-hide-empty", $ hide_empty); add_option ("sbc-exclus-cats", $ exclus_cats); add_option ("sbc-căutare-text", $ search_text); add_option ("sbc-select-excluded", $ raw_excluded_cats); add_option ("sbc-exclude-copil", $ exclude_child); add_option ("stil sbc", $ sbc_style);

Acum, când setările implicite sunt setate și adăugate la baza de date, putem folosi Wordpress "get_option ( 'intrare-titlu')"funcția noastră config_page astfel încât valorile noastre să se reflecte în interiorul formelor.

 funcția config_page () $ focus = get_option ("sbc-focus"); $ hide_empty = get_option ("sbc-ascunde-gol"); $ search_text = get_option ("sbc-căutare-text"); $ excluded_cats = get_option ("sbc-exclude-pisici"); $ exclude_child = get_option ("sbc-exclude-copil"); $ raw_excluded_cats = get_option ("sbc-select-excluded"); // Pentru lista de verificare $ sbc_style = get_option ("stil sbc");

Acum că pagina Opțiuni utilizează datele din baza de date, să setăm procesul de actualizare. În primul rând, vom începe o nouă declarație if verificând dacă butonul nostru de trimitere este setat. Îl vom compara pe noi wpnonce pentru a verifica dacă utilizatorul a vizitat pagina înainte de a încerca să actualizeze opțiunile. Apoi vom rula o altă declarație if pentru a verifica și asigurați-vă că curentul este permis să schimbe setările prin rularea funcției WP "current_user_can ( 'manage_options')"dacă nu pot, atunci vom ucide scenariul.

 dacă isset ($ _ POST ['submit'])) $ nonce = $ _REQUEST ['_wpnonce']; dacă (! wp_verify_nonce ($ nonce, 'sbc-updatesettings')) ("Verificarea de securitate a eșuat"); dacă (! current_user_can ('manage_options')) mor (__ ('Nu puteți edita opțiunile de căutare după categorie')); check_admin_referer ( 'SBC-updatesettings'); 

Acum vom actualiza variabilele definite mai sus cu valoarea de intrare din formular. Deoarece folosim casetele de selectare pentru lista de categorii excluse, cea mai bună modalitate de a obține returnarea dorită este de a declara o altă declarație if și de a verifica dacă este setată "post_category" (idul dat în listă de funcția WP). Dacă este prezent, atunci vom lua forma sa bruta și vom reveni "raw_excluded_cats $" variabilă de la început, astfel încât casetele de selectare să rămână verificate. De asemenea, vom folosi aceleași valori returnate pentru a crea o matrice separată cu virgulă "destul de" pentru o utilizare ulterioară prin adăugarea unei valori suplimentare la începutul matricei (Aceasta este o remediere pentru o eroare mai târziu într-o altă funcție) și apoi implodează matricea.

 // Obțineți noile valori ale opțiunii $ focus = $ _POST ['focus']; $ hide_empty = $ _POST ['ascunde-gol']; $ search_text = $ _POST ['căutare-text']; $ exclude_child = $ _POST ['exclude-copil']; $ sbc_style = $ _POST ['sbc-style']; dacă (isset ($ _ POST ['post_category']))) $ raw_excluded_cats = $ _POST ['post_category']; // Fixați valorile returnate ale categoriilor excluse $ fix = $ raw_excluded_cats; array_unshift ($ fix, "1"); $ excl ._cats = implode (',', $ fix); 

Datorită naturii câmpurilor de selectare, ele au o valoare de returnare numai dacă sunt verificate, așa că trebuie să scriem o captură atunci când nu sunt verificate. Pentru a face acest lucru, vom folosi o simplă declarație if, care verifică dacă variabilele noastre sunt goale (deoarece nu există nici o valoare de returnare din formular pentru ao completa), dacă este goală, vom seta valoarea "0" (fals).

 // Asigurați-vă că "$ hide_empty" și "$ exclude_child" sunt setate corect dacă (gol ($ hide_empty)) $ hide_empty = '0'; // 0 înseamnă fals dacă (gol ($ exclude_child)) $ exclude_child = '0'; // 0 înseamnă fals dacă (gol ($ sbc_style)) $ sbc_style = '0'; // 0 înseamnă falsă

Acum ultimul nostru pas este actualizarea bazei de date cu noile noastre valori folosind funcția Wordpress "update_option ( 'intrare-titlu', 'nou-valoare')"De asemenea, vom înfășura valorile introduse în DB cu această funcție mysql_real_escape_string () pentru a preveni orice injecție SQL.

 // Actualizați DB cu noile valori ale opțiunilor update_option ("sbc-focus", mysql_real_escape_string ($ focus)); update_option ("sbc-hide-empty", mysql_real_escape_string ($ hide_empty)); update_option ("sbc-select-excluded", mysql_real_escape_string ($ raw_excluded_cats)); update_option ("sbc-exclus-cats", mysql_real_escape_string ($ exclus_cats)); update_option ("sbc-search-text", mysql_real_escape_string ($ search_text)); update_option ("sbc-exclude-child", mysql_real_escape_string ($ exclude_child)); update_option ("stil sbc", mysql_real_escape_string ($ sbc_style));

Codul nostru Până în prezent:

  

Căutați după opțiunile categoriei

/>
/>
/> * Stylingul nu se afișează corect în IE7 și mai devreme *


Crearea Formularului

Acum că ne-am finalizat totul și este pregătit să se instaleze, este timpul să începem să scriem formularul front-end pe care toți vizitatorii îl vor vedea și utiliza. Pentru ca utilizatorul nostru să poată plasa formularul nostru oriunde pe site-ul pe care îl dorește, vom încasa formularul nostru într-o nouă funcție intitulată "sbc ()"plasate în afara declarației noastre de clasă. Primii octeți de cod pe care trebuie să adăugăm sunt declararea unui articol global $ wp_query și $, astfel încât să putem avea acces la aceste funcții dacă dorim mai târziu, dar pentru scopurile noastre nu vom avea nevoie Următorul pas este să re-procurați valorile variabilelor din baza de date.

 // funcția de bază a funcției sbc () $ focus = get_option ("sbc-focus"); $ hide_empty = get_option ("sbc-ascunde-gol"); $ excluded_cats = get_option ("sbc-exclude-pisici"); $ search_text = get_option ("sbc-căutare-text"); $ exclude_child = get_option ("sbc-exclude-copil"); 

Odată ce am făcut acest lucru, putem crea o altă variabilă numită "lista $"cu valoarea sa fiind funcția WP wp_dropdown_categories (setări $) (citiți mai multe despre această funcție aici). Această variabilă "setări $"este locul unde se aplică cea mai mare parte a personalizării noastre.

 $ set = array ('show_option_all' => $ focus, 'show_option_node' => ',' orderby '=>' name ',' order '=>' ASC ',' show_last_update ' 0 ',' hide_empty '=> $ hide_empty,' child_of '=> 0,' exclude '=> => 1, 'name' => 'cat', 'class' => 'postform', 'depth' => $ exclude_child); $ list = wp_dropdown_categories (setări $);

Acum, când pachetul de formular este configurat, putem crea o altă variabilă, "forma $"care va păstra formularul nostru HTML printr-un preprocesor de hipertext, apoi vom econa noua variabila de formular $.

 $ blog_url = get_bloginfo ("url"); $ form = <<< EOH 
List $
EOH; echo $ form;

Adăugarea în Styling personalizat

Anterior am oferit utilizatorului posibilitatea de a folosi stilul personalizat pentru formular. Dacă au lăsat această opțiune activată în meniul de setări, trebuie să adăugăm foaia de stil în antet. Cea mai ușoară modalitate de a face acest lucru este de a crea o nouă declarație if verificarea variabilei noastre "$ sbc_style"pentru a fi adevărat (în codul nostru: 1) În interiorul acestui control, vom adăuga o nouă funcție"style_insert ()"care redă URL-ul în foaia de stil. De asemenea, în cazul if (dar în afara funcției), vom scrie o nouă acțiune pentru "Wp_head" pentru a adăuga în funcția noastră "style_insert ()".

 dacă ($ sbc_style == '1') // Adăugați funcția de styling stil_insert () $ current_path = get_option ('siteurl'). '/ wp-content / plugins /'. basename (dirname (__ FILE__)); ?>   

În ceea ce privește stilul nostru, creați un nou fișier numit style.css SBC- completați-l cu:

 formularul # sbc-search clear: ambele; formularul # sbc-search * margin: 0px; formularul # sbc-search input # s background: # f5f5f5; frontieră: 1px solid #bbbbbb; padding: 4px 10px; lățime: 80%; margin-bottom: 10px; formular # sbc-search selectați # cat display: block; fundal: #fbfbfb; înălțime: 30px; lățime: 63%; frontieră: 1px solid #bbbbbb; plutește la stânga; padding: 4px 20px; frontieră-dreapta: nici una; -khtml-aspect: nici unul; / * repara stilul implicit pentru safari * / border-radius: 15px 0px 0px 15px; -webkit-border-bottom-left-radius: 15px; -webkit-border-top-left-radius: 15px; -moz-border-radius: 15px 0px 0px 15px; formularul # sbc-search selectați opțiunea # cat padding: 2px 4px; formularul # sbc-search input # sbc-submit display: block; înălțime: 30px; lățime: 37%; frontieră: 1px solid #bbbbbb; f loat: dreapta; raza de graniță: 0px 15px 15px 0px; -webkit-border-bottom-right-radius: 15px; -webkit-border-top-right-radius: 15px; -moz-border-radius: 0px 15px 15px 0px;

În Safari veți observa că triunghiul descendent standard lipsește din cutia noastră de dropdown, pentru că am folosit -khtml-aspect: nici unul pe dropdown pentru a opri safari de a forța tema "zăpadă" pe ea. o modalitate de a rezolva acest lucru este de a folosi un caracter HTML pentru a simula triunghiul și se întâmplă să fie unul foarte asemănător numit "∇ Nabla". Vom utiliza o combinație de spații, spații fără spargere și acest nabla în setările dropdown pentru a remedia această problemă.

 $ set = array ('show_option_all' => $ focus ';', 'show_option_none' => show_count '=> 0,' hide_empty '=> $ hide_empty,' child_of '=> 0,' exclude '=> " , 'hierarchical' => 1, 'name' => 'cat', 'class' => 'postform', 'depth' => $ exclude_child);


Revenirea la rezultatele căutării

Odată ce am luat forma noastră și mergem, putem începe în sfârșit să obținem rezultatele căutării pe care căutăm să le oferim vizitatorilor noștri. Pentru a ne porni, vom crea o nouă funcție numită return_only_selected_category (), în care vom crea o nouă declarație if verificând setarea butonului nostru de căutare. În interiorul nostru trebuie să creăm un nou $ wp_query globale. Apoi vom lua returul categoriei selectate și îl vom plasa într-o variabilă numită $ desired_cat. În cazul în care utilizatorul a selectat opțiunea pentru toate categoriile, trebuie să executați o verificare a valorii "*" și să o resetați la "".

 // Obțineți rezultate numai din funcția selectată categorie return_only_selected_category () if (isset ($ _ POST ['sbc-submit'])) global $ wp_query; $ dorit_cat = $ _POST ['cat']; dacă ($ desired_cat == '*') $ dorit_cat = ";

Acum trebuie să creăm o altă variabilă, $ exclus, a căror valoare este funcția WP get_categories (). Vom adăuga 2 argumente la această funcție. Mai întâi este "hide_empty = false", astfel încât toate categoriile să fie aduse în listă, iar al doilea este "exclude = $ dorit_cat", astfel încât orice categorii în care categoria pe care utilizatorul dorește să o vizualizeze să fie eliminată din listă.

 $ excl. = get_categories ('hide_empty = false & exclude = $ desired_cat');

Odată ce această variabilă este setată, putem să o facem în final, astfel încât numai rezultatele din categoria selectată să apară în rezultate. În acest sens, vom modifica Query Vars astfel încât Wordpress să înlăture postările din fiecare categorie pe care o listăm (și tocmai se întâmplă să avem o variabilă plină de categorii pentru a exclude).

 $ wp_query-> query_vars ['cat'] = '-'. excluse $;

Prin adăugarea unei liniuțe în fața listei de categorii, le spunem Wordpress că le elimină pe cele din interogare. O metodă foarte eficientă pentru noi. Acum, singurul lucru de făcut este să adăugați un nou filtru WP pentru "pre_get_posts" adăugând în noua noastră funcție.

 // Highjack căutare add_filter ('pre_get_posts', 'return_only_selected_category');

Cum introducem formularul nostru

 ... codul standard al formularului dvs. aici ... 

Codul nostru finit

  

Căutați după opțiunile categoriei

/>
/>
/> * Stylingul nu se afișează corect în IE7 și mai devreme *

$ Se concentreze.“ , 'Show_option_node' => ',' orderby '=>' name ',' order '=>' ASC ',' show_last_update '=> 0,' show_count '=> 0,' hide_empty ' '' '', 'echo' => 0, 'selected' => 0, 'hierarchical' => 1, 'name' => ($ set = $ $ $ $ = $ $ $ = $ $ $ = $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ = <<< EOH
List $
EOH; echo $ form; // Obțineți rezultate numai din funcția selectată categorie return_only_selected_category () if (isset ($ _ POST ['sbc-submit'])) global $ wp_query; $ dorit_cat = $ _POST ['cat']; dacă $ desired_cat == '*') $ dorit_cat = "; $ excl. = get_categories ('hide_empty = false & exclude = $ desired_cat') $ wp_query-> query_vars ['cat'] = '- dacă ($ sbc_style == '1') // Adăugați funcția de styling stil_insert () $ current_path = get_option ('siteurl') ./ wp-content / plugins / basename (dirname (__FILE__)) ; echo '„; // introduceți foaia de stil personalizată add_action ('wp_head', 'style_insert'); // Highjack căutarea add_filter ('pre_get_posts', 'return_only_selected_category'); // introduceți în panoul de administrare add_action ('admin_menu', array ('SBC_Admin', 'add_config_page')); ?>
Cod