Share
Începând cu versiunea 4.0, în WordPress există 18 API-uri integrate. Acestea sunt extrem de importante pentru diferite aspecte ale WordPress și împreună acestea ajută WordPress să fie cel mai flexibil sistem de management al conținutului din lume.
Unul dintre aceste API-uri este API-ul Quicktags, care permite dezvoltatorilor de plugin-uri și temă să adauge noi butoane în modul Text (numit de obicei modul HTML) al editorului WordPress. În acest tutorial, vom afla ce este API-ul Quicktags și cum să utilizați API-ul pentru a crea noi butoane pentru editorul HTML.
Chiar dacă este mai mult decât atât, WordPress este folosit în mod obișnuit ca un "sistem de management al conținutului" și WordPress trebuie să permită utilizatorilor administra conţinut ușor și eficient. De aceea, WordPress vine cu TinyMCE, unul dintre cei mai buni editori WYSIWYG ("Ceea ce vezi este ceea ce primești") de toate timpurile și, fără îndoială, cel mai potrivit editor de conținut pentru WordPress. TinyMCE oferă utilizatorilor o experiență de editare necomplicată a conținutului, care afișează simultan conținutul aproape ca o previzualizare exactă a ceea ce urmează să publice.
Dar unii utilizatori nu le place să vadă asta. De fapt, unii utilizatori ar prefera să vadă codul sursă al conținutului, astfel încât aceștia să aibă control total asupra a ceea ce vor publica. Sau poate că utilizatorul ar fi în "editorul vizual" și dorește să verifice și să verifice codul sursă. Aici intră în joc "editorul HTML". Modul HTML al editorului WordPress afișează codul sursă al conținutului și nimic mai mult.
Există butoane pe partea de sus a editorului HTML, numite "Butoane Quicktag", care ne permit să editați conținutul fără a reveni la editorul Visual. Utilizând API-ul Quicktags, putem crea noi butoane împreună cu cele existente.
Utilizarea API-ului Quicktags este foarte ușoară deoarece în timp ce nucleul quicktags.js fișierul are mult mai mult, vom folosi (și ar trebui) o singură funcție: QTags.addButton ().
Dacă doriți să treceți scriptul ca fișier separat (care este utilizarea recomandată), trebuie să utilizați fragmentul de cod de mai jos:
Dar dacă nu aveți altă posibilitate decât să imprimați scriptul în linie, puteți să o faceți cu următorul fragment de cod:
Destul de ușor, nu? Rețineți că am folosit admin_print_footer_scripts acțiune de data aceasta.
Accentsconagua
QTags.addButton () QTags.addButton () funcția are opt parametri:
QTags.addButton (id, afișare, arg1, arg2, access_key, titlu, prioritate, instanță);
id (șir, necesar): Un ID unic care va fi HTML ID-ul pentru butonul Quicktag. (Rețineți că valoarea ID pentru fiecare buton va fi prefixată automat cu șirul 'Qt_content_'.)afişa (șir, necesar): Text pentru a fi afișat pe buton.ARG1 (șir sau funcție) O etichetă de start care trebuie inserată sau numele unei funcții de apel invers.arg2 (șir, opțional): Eticheta de încheiere va fi inserată dacă este necesar.cheie de acces (șir, opțional): Tasta de acces pentru buton.titlu (șir, opțional): HTML-ul titlu pentru butonul.prioritate (întreg, opțional): Locul în care va fi afișat butonul dvs. - de la 1 la 9 pentru primul loc, de la 11 la 19 pentru al doilea loc, de la 21 la 29 pentru locul trei și așa mai departe.instanță (șir, opțional): O instanță Quicktags specifică pentru a afișa butonul numai acolo, dacă există mai multe instanțe Quicktags pe pagină. (Dacă acest lucru nu este setat, butonul va fi adăugat la toate instanțele.)API-ul Quicktags poate părea înfricoșător și complicat la început (mai ales dacă cunoștințele dvs. JavaScript sunt slabe ca mine), dar după cum veți vedea acum, nu este nimic de îngrijorat cu privire la scrierea de mici biți de cod pentru a crea butoane Quicktag.
Să începem cu ceva simplu: Să presupunem că veți adăuga două butoane de coduri scurte - primul care va include scurtcircuitul, și un scurtcod de auto-închis după aceea. Iată ce faceți:
QTags.addButton ("caseta de informații", "caseta de informații", "[infobox]", "[/ infobox]"); Vedeți cât de ușor este asta? Tot ce trebuie să faceți este să setați un ID, un nume de buton și șirurile de imprimat când se face clic pe buton. Poti de asemenea nu setați al doilea argument (al patrulea parametru) și tipăriți un cod scurt de auto-închidere:
QTags.addButton ("semnătură", "semnătură", "[semnătură]"); Asta e tot ce trebuie să știți despre utilizarea de bază a butoanelor Quicktag!
Desigur, nu toate butoanele Quicktag sunt create în mod egal. Puteți crea cu ușurință butoane simple de închidere și auto-închise Quicktag, dar este posibil să fie nevoie să creați un buton care să necesite puțin mai multă muncă. Aici funcționează funcțiile JavaScript.
Vom prezenta exemple simple, dar depinde de imaginatia ta de a crea butoane Quicktag complicate cu functii JavaScript.
Acum, să facem două exemple rapide. Primul este clasicul alerta buton:
QTags.addButton ("alertă", "alertă", my_alert); funcția my_alert () alert ('Hello Quicktag!'); După cum puteți ghici, apare un "Hello Quicktag!" mesaj. Acum, hai să facem ceva cu un prompt:
QTags.addButton ('my_prompt', 'alert', my_prompt); funcția my_prompt () var my_class = prompt ('Introduceți un nume de clasă:', '); if (my_class) QTags.insertContent ('„); Acesta este un pic mai complicat: vă cere să introduceți un nume de clasă și tipăriți un div cu clasa pe care ați specificat-o.
După cum am spus mai devreme, API pare puțin intimidant. Dar după cum puteți vedea, utilizarea acestuia este destul de simplă - chiar și atunci când îl folosiți pentru a declanșa funcții de apel invers. Modul HTML are alți utilizatori foarte dedicați și ei ar aprecia cu adevărat dacă puneți un buton sau două atunci când dezvoltați o temă sau un plugin.
Care-i treaba ta cu API-ul Quicktags? V-ați gândit să o utilizați sau aveți altceva de adăugat în acest tutorial? Spuneți-ne ce credeți, comentând mai jos. Și dacă ți-a plăcut articolul, nu uita să îl împarți cu prietenii tăi!
