Crearea de evenimente viitoare Plugin în WordPress Introducere

WordPress nu mai este doar o platformă de blogging, ci poate fi folosită pentru a dezvolta aplicații web complexe pentru mai multe scopuri. WordPress oferă o varietate de API-uri, permițându-ne să ne dezvoltăm mai departe pe baza sa.

Putem extinde WordPress pentru a satisface nevoile noastre folosind API-ul Plugins. Cu acest puternic API putem dezvolta soluții care să răspundă nevoilor noastre pentru scenarii aproape nesfârșite; prin urmare, pentru a deveni un maestru al WordPress, o dată trebuie să-și stăpânească API-urile.

În această serie, vom analiza API-ul WordPress Plugins, precum și Widget API și cum le putem folosi pentru a dezvolta soluții specifice nevoilor noastre.

Ce facem

În cursul acestei serii de trei părți, vom construi un plugin WordPress de la început. Acest plugin va afișa o listă de evenimente viitoare de pe front-end pentru a permite utilizatorilor să știe ce urmează. Administratorul va putea să publice informații despre evenimente noi și va putea să le editeze sau să le șterge.

Există o zicală:

Dacă nu planificați, intenționează să eșueze.

Vom planifica fiecare detaliu și aspect al plugin-ului nostru înainte de a începe să scriem cod. În acest fel, vom clarifica ce noi o să facem și Cum o vom face. De asemenea, ne vom asigura că avem toate bunurile necesare pe care le vom folosi ulterior înainte de a începe să ne scriem codul.

Vom începe prin înregistrarea unui tip de post personalizat pentru evenimentele noastre. Acest lucru va face mai ușor pentru noi să gestionăm lucrurile în mod eficient. Acest tip de post personalizat va include:

• un câmp de titlu
• un câmp de descriere
• pentru imaginea recomandată

În plus față de aceste câmpuri standard, vom include și trei câmpuri meta personalizate pentru:

• data de începere a evenimentului
• data de încheiere a evenimentului
• loc de întâlnire

Pentru data de începere a evenimentului și data de încheiere a evenimentului, vom include selectorul de date jQuery UI în tabloul de bord al postului nostru.

Cele trei câmpuri personalizate de mai sus își vor salva valorile în post meta și vom interoga evenimentele noastre din front-end pe baza acestor câmpuri personalizate utilizând interogarea meta.

Când vine vorba de tipuri personalizate de posturi, WordPress prezintă numai coloane pentru titlul, autorul și data publicării postului pe ecranul post-editare, dar nu ne limităm la asta. Vom adăuga coloane personalizate pentru data de începere a evenimentului, data de încheiere și locul evenimentului pentru o mai bună accesibilitate a utilizatorului.

În cele din urmă, în ceea ce privește front-end-ul, este potrivit să faceți un widget care afișează o listă a tuturor evenimentelor programate în viitorul apropiat. Cu ajutorul API-ului Widget puternic, vom codifica widget-ul personalizat pe care îl vom putea adăuga în bara noastră laterală sau subsol.

Organizarea Fundației

Să începem prin crearea structurii director / fișierului de bază. Navigați lawp-content / plugins și creați un nou director numit evenimente viitoare. Înăuntru, creați mai multe directoare pentru:

• css
• js
• img

De asemenea, creați următoarele fișiere PHP:

• index.php
• viitoare-events.php

Așa cum probabil ați observat că am creat un supliment viitoare-events.php fișier în afară de standard index.php fişier. Vom scrie tot codul nostru în interiorul viitoare-events.php fişier. Este o practică bună să renunțați index.php fișier în directoarele dvs. de active, precum și va bloca pe oricine încearcă să afle conținutul directorului în browser.

Vom crea style.css și script.js fișiere în interiorul css și js foldere, respectiv.

În interiorul index.php fișier, adăugați următorul cod:

 
Aici, plasăm doar un text de tip "placeholder" în interiorul index.php.
 
În interiorul viitoare-events.php fișier, adăugați următoarea declarație plugin:
 
 
După ce terminăm cu structura de bază a fișierelor, vom trece la colectarea necesarului de elemente necesare în pluginul nostru. Unul dintre aceste active este foaia de stil pentru jQuery UI datepicker. Implicit, WordPress utilizează jQuery și jQuery UI core pe toate paginile sale din tabloul de bord. Trebuie doar să includeți stilurile pentru widget-ul datepicker.
 
Pentru a face acest lucru, navigați browser-ul dvs. la http://jqueryui.com și:
 
 
Click pe Descărcare personalizată butonul din dreapta
 
În pagina următoare, debifați Toggle All în caseta de selectare Componente titlu. Aceasta va debifa toate casetele de selectare
 
Derulați în jos până la Widget-uri și verificați DatePicker Caseta de bifat
 
În partea de jos a paginii, selectați tema de culoare aleasă de dvs. din tematică secțiune. Vom folosi implicit UI Lightness temă pentru tutorialul nostru
 
Faceți clic pe butonul de descărcare pentru a descărca pachetul personalizat
 
 
Extrageți pachetul descărcat și copiați conținutul acestuia css / luminozitate-ui la viitoare evenimente / css director.
 
Ce este în continuare?
 
E vorba de planificare. În următoarea tranșă a seriei, vom începe să scriem codul nostru.
 
Noi vom:
 
 
înregistrați tipul postului personalizat pentru eveniment
 
adăugați casete meta la ecranul de editare a evenimentelor
 
adăugați stilurile și scripturile necesare administratorului nostru
 
încorporați selectorul de date jQuery UI pentru a introduce datele evenimentului
 
adăugați coloane personalizate de administrare în ecranul "Toate evenimentele"
 
 
Rămâi acordat pentru următorul articol din serie.



		
			
	   
	




Cod