Želite da kreirate a WordPress dodatak ? Ovaj vodič će vas naučiti kako to učiniti.
Dodaci doprinose popularnosti WordPress-a jer omogućavaju korisnicima bez znanja o kodiranju da kreiraju nevjerovatne web stranice.
Postoji preko 50 dodataka rWordPress direktorij dizajniran za razne svrhe. Naći ćete WordPress plugins sipati pretplata na newsletter , Sigurnost et e-trgovina . Samo ime.
Bez njih, WordPress web stranica je samo kolekcija statičnih slika i blokova teksta. Sa dodacima, sistem za upravljanje sadržajem može postići nevjerovatan nivo prilagođavanja.
Bilo da vam je potreban prilagođeni dodatak za vašu web stranicu ili želite kreirati a WordPress dodatak i unovčiti, idemo.
Pitanja fréquemment posées
Da li WordPress dodaci zarađuju novac?
Da. THE WordPress plugins doneti novac. Dodatak možete prodati na svojoj web stranici ili na tržištu treće strane.
CodeCanyon, ThemeForest i Mojo Marketplace su 3 najbolje web stranice za prodaju dodataka.
Također možete dodati besplatnu verziju svog dodatka u WordPress spremište i ponuditi premium verziju sa dodatnim funkcijama.
Da li je teško kreirati WordPress dodatke?
Stvaranje a WordPress dodatak je relativno lako i teško, ovisno o funkcijama koje želite.
Kreiranje dodatka je jednostavno ako ste već upoznati sa osnovama WordPress razvoja i PHP programiranja. Ako niste, može biti veoma teško. Najbolje je početi s jednostavnim dodatkom, kao što je prikazano u ovom vodiču.
Koliko zarađuju programeri dodataka?
Prema Zip Recruiter-u, prosječna satnica za programere WordPress plugins u Sjedinjenim Državama je 35 dolara po satu. Ovo radi na oko 72 dolara godišnje i 000 dolara mjesečno.
Ako prodate svoj dodatak, možete zaraditi do 5 USD mjesečno, ovisno o broju prodaja. Nudenjem usluga prilagođavanja dodataka možete zaraditi između 000 i 20 dolara po satu.
Šta će vam trebati da kreirate WordPress dodatak
Da biste kreirali dodatak, ne morate biti stručni WordPress programer. Potrebno vam je samo neko osnovno znanje kodiranja da biste započeli.
- Osnovno znanje PHP programiranja: WordPress dodaci su napisani u PHP-u, tako da biste trebali razumjeti jezik i njegovu sintaksu prije nego što počnete.
- Osnovni HTML i CSS: HTML i CSS vam omogućavaju da kontrolišete prikaz i izgled vaših dodataka. Stoga je ključno razumjeti njihove osnove za kreiranje WordPress dodatka.
- Poznavanje WordPress-a: korisno je upoznati se sa WordPress platformom i njenim glavnim funkcijama, kao i sa Codex WordPressa (online priručnik za razvoj WordPress-a).
- Razvojno okruženje: Da biste razvili i testirali svoj dodatak, potrebno je da instalirate WordPress na vaš lokalni računar ili na razvojnu stranicu. Ovo će vam omogućiti da testirate svoj dodatak bez utjecaja na web stranicu uživo. Pokazat ćemo vam kako to učiniti u sljedećem odjeljku.
- Uređivač teksta: Trebat će vam uređivač teksta za pisanje koda dodatka. Dostupne su mnoge opcije, poput Ssublime Text, atom et Visual Studio Code.
Kako napraviti WordPress dodatak u 7 koraka
Korak 1: Shvatite kako rade WordPress dodaci
Budući da je WordPress napisan u programskom jeziku, svako sa znanjem kodiranja može pristupiti i modificirati WordPress kod.
Upravo ovako rade dodaci. Oni vam omogućavaju da modifikujete i proširite funkcionalnost WordPress-a direktnom interakcijom sa vašim WordPress-om koristeći određene PHP funkcije.
Kreiranje vašeg WordPress dodatka i dodavanje koda učinit će nešto samo ako pozovete PHP funkciju pomoću kuke. Hooks je ono što omogućava vašem dodatku da komunicira sa WordPress-om bez potrebe za uređivanjem osnovnih fajlova.
Pogledajmo odnos između uglastih zagrada i funkcija kako bismo razumjeli osnove WordPress dodataka.
WordPress funkcije:
WordPress kod je izgrađen na funkcijama koje omogućavaju interakciju bilo kojeg koda treće strane s WordPress-om. Zato ćete naći mnoge funkcije u dodacima i temama. Svaka funkcija ima svoje ime, praćeno zagradama i kodom unutar zagrade.
Evo primera:
function sticky_header() {
?>
<script>
// Select the header element
var header = document.querySelector(‘header’);
// Get the offset position of the header
var sticky = header.offsetTop;
// Add the sticky class to the header when you reach its scroll position. Remove “sticky” when you leave the scroll position
function addSticky() {
if (window.pageYOffset > sticky) {
header.classList.add(“sticky”);
} else {
header.classList.remove(“sticky”);
}
}
// Add the sticky class to the header when you scroll the page
window.onscroll = function() {
addSticky();
};
</script>
<?php
}
add_action( ‘wp_footer’, ‘sticky_header’ );Ovu funkciju možete pozvati direktno u svom WordPress dodatku tako što ćete upisati sticky_header() gdje želite da se kod pokrene. Ali to je loša praksa jer možete naići na probleme. Evo još dva razloga zašto ne biste trebali pozivati funkcije direktno u svom kodu.
Prvo, direktni poziv radi samo za osnovne funkcije, kao što je dodavanje sadržaja u datoteku teme. Također, koristeći ovaj pristup, morat ćete pozvati funkcije više puta da biste ih koristili na više mjesta, što je dugotrajno i glomazno u datotekama koda.
Ručno pozivanje funkcije također može biti nezgodno ako ste novi u kodiranju. Kada kreirate dodatke, najbolja praksa je da ih pričvrstite na kuku. Ovo će vam uštedjeti potrebu da pozivate funkciju na više mjesta.
WordPress kuke:
Hook je specifična točka u WordPress kodu gdje možete izvoditi vlastite prilagođene funkcije. Postoje dvije vrste udica: akcijske kuke i kuke za filter.
Action Hooks
Action hooks vam omogućavaju da izvršite prilagođene funkcije u određeno vrijeme u ciklusu pokretanja WordPress-a. Ovako izgleda sintaksa akcione kuke.
add_action('hook_name', 'my_custom_function');Le hook_name je naziv akcione kuke koju želite koristiti.
Postoji nekoliko akcionih udica u WordPressu. Možete ih pronaći u codex WordPress.
my_custom_function je funkcija koja sadrži kod koji želite izvršiti. Ova funkcija mora biti definirana prije funkcije add_action.
Sintaksa će izgledati ovako za pričvršćivanje funkcije ljepljivog zaglavlja iznad na kuku.
add_action( 'wp_footer', 'sticky_header' );Ova funkcija izvršava funkciju sticky_header() kada se pozove kuka za akciju wp_footer. Funkciju također možete pričvrstiti na određenu zakačicu zamjenom wp_footer imenom kuke po vašem izboru.
Na primjer:
add_action( 'init', 'sticky_header' );Ovo će pokrenuti funkciju ljepljivog zaglavlja kada se pozove WordPress init akcija.
Kuke za filtere
Zakačice za filtere vam omogućavaju da modificirate podatke prije nego što se prikažu ili pohrane u bazu podataka. Evo primjera filtarske kuke koja mijenja naslov blog posta na velika slova.
add_filter( ‘the_title’, ‘uppercase_title’ );
function uppercase_title( $title ) {
return strtoupper( $title );
}Ova funkcija prihvata jedan argument, $title, što je originalni naslov blog posta.
Funkcija tada koristi funkciju strtoupper() za pretvaranje naslova u velika slova i vraća izmijenjenu vrijednost.
Razlika između Action i Filter Hooks
Action hooks vam omogućavaju da izvršite prilagođene funkcije u određeno vrijeme u ciklusu pokretanja WordPress-a. U gornjem primjeru, akciona kuka wp_footer se poziva neposredno prije oznake.
Zadice za filtere, s druge strane, omogućavaju vam da modifikujete podatke dok prolaze kroz bazu kodova WordPress-a.
Kao u gornjem primjeru, kuka za filter naslov omogućava vam da uredite naslov blog posta prije nego što se prikaže na web stranici.
Korak 2: Postavite testno okruženje
Drugi korak u kreiranju WordPress dodatka je postavljanje testnog ili razvojnog okruženja. Cilj je izbjeći eksperimentiranje na stvarnom mjestu.
Kreiranje dodatka ponekad zahtijeva naprijed-natrag. Također možete napraviti greške koje će oštetiti vašu web stranicu.
Možete koristiti svoj računar kao lokalni server za hostovanje testne WordPress stranice na kojoj možete kreirati i testirati svoj dodatak.
Ako je tvoj plansmještaj podržava kreiranje probne stranice, također je možete koristiti. Ovdje ćemo koristiti prvo rješenje.
Mi ćemo postaviti testno okruženje preuzimanje lokalno , razvojni alat za lokalno hostiranje WordPress web stranica.
Kada se preuzimanje završi, pokrenite softver na svom računaru i kliknite + ikona u donjem lijevom kutu za kreiranje nove lokalne stranice.
Odaberite iz Kreirajte novu lokaciju i kliknite na dugme Nastaviti.
Zatim slijedite upute na ekranu da dodate naziv vaše web stranice, postavite okruženje i kreirate detalje za prijavu na WordPress.
Kada završite. Kliknite na dugme Add Site. Nakon što dodate svoju web lokaciju, odaberite svoju web stranicu na lokalnoj kontrolnoj tabli i pokrenite svoju WordPress administratorsku kontrolnu ploču.
Kada se otvori stranica za prijavu administratora, koristite korisničko ime i WordPress lozinka koje ste kreirali iznad za pristup vašoj kontrolnoj tabli.
Gotovo je. Vaše testno okruženje je spremno. Počnimo kreirati vaš WordPress dodatak.
Korak 3: Kreirajte svoju mapu dodataka
Kada je vaše testno okruženje postavljeno, prva stvar koju treba da uradite je da kreirate datoteku dodatka u direktorijumu vašeg sajta. Prema zadanim postavkama, WordPress pohranjuje sve dodatke u direktorij wp-content/plugin.
Svaki dodatak instaliran na WordPress stranici imat će folder u ovom direktoriju. Za vaš dodatak, moraćete da kreirate fasciklu unutar ovog direktorijuma i date mu ime.
Za ovaj vodič ćemo se kretati do foldera wp-content/plugin u našem lokalnom imeniku stranica. Evo kako.
Napomena: Proces je isti ako koristite posredničku stranicu.
Na lokalnoj kontrolnoj tabli kliknite na Idite u mapu web lokacije . Bit ćete preusmjereni na vaš lokalni direktorij web-mjesta.
izabrati aplikacije u opcijama kliknite na javnost onda wp-sadržaja. Vidjet ćete različite mape u ovom direktoriju.
Otvorite folder plugins i novu podmapu s imenom vašeg dodatka. Koristićemo ovde Ljepljivo zaglavlje pošto je to naziv dodatka koji želimo da kreiramo.
Korak 4: Kreirajte glavni PHP fajl za svoj dodatak
Nakon kreiranja foldera dodataka, sljedeći korak je dodavanje PHP datoteke u ovu mapu. Ovdje će biti dostupni kodovi i funkcionalnost vašeg dodatka.
Za ovaj tutorijal potreban nam je samo jedan PHP fajl za jednostavan dodatak koji kreira lepljivo zaglavlje u WordPress-u.
Za složenije dodatke sa naprednom funkcionalnošću, mogu postojati različite vrste datoteka u folderu dodataka, kao što su CSS i javascript. U našem slučaju, jedan PHP fajl će biti dovoljan.
Da biste to učinili, kreirajte PHP datoteku u folderu dodataka, kao na slici ispod.
Kada je datoteka spremna, vrijeme je da dodate neke informacije u svoj dodatak.
Korak 5: Konfigurirajte informacije o dodatku
Također poznat kao zaglavlje datoteke dodatka, informacije o vašem dodatku su PHP blok komentara koji uključuje detalje o vašem dodatku kao što su naziv dodatka, verzija, URL, ime autora i njegova web stranica, licenca itd.
Ovo su informacije koje vidite na stranici WordPress dodatka nakon instaliranja dodatka.
Možete pronaći zaglavlje datoteke dodatka u WordPress kodeksu . To izgleda ovako.
Samo kopirajte i zalijepite ovaj kod u PHP datoteku vašeg dodatka, a zatim uredite detalje kako bi odgovarali vašem dodatku. U našem slučaju, čitač dodataka zaglavlja će izgledati ovako.
<?php
/*
Plugin Name: Sticky Header
Plugin URI: https://wordpress.org/plugins/sticky-header/
Description: Make your website header sticks to the top of every page on your website as users scroll.
Author: The Team
Author URI: https://blogpascher.com/sticky-header
Text Domain: Sticky Header
Domain Path: /languages
*/Kada sačuvate ovu datoteku, kreirali ste novi dodatak i možete ga pronaći na listi dodataka koji su već instalirani na vašoj web lokaciji.
Prijavite se na WordPress kontrolnu tablu svoje testne stranice i idite na Plugins>Plugins installés.
Vidjet ćete dodatak Sticky Header s detaljima. Evo ga.
Sada možete aktivirati dodatak, ali on neće učiniti ništa jer mu još nismo dodali nikakvu funkcionalnost. Pa hajde da nateramo naš dodatak da uradi nešto.
Korak 6: Dodajte kod u svoj dodatak
Da bismo to učinili, dodaćemo ljepljivi kod zaglavlja koji smo koristili prilikom učenja WordPress funkcija i kukica iznad. Evo kako.
Otvorite PHP datoteku vašeg dodatka. Ispod detalja zaglavlja kopirajte i zalijepite ove isječke koda u glavni PHP fajl vašeg dodatka i sačuvajte ga.
function sticky_header() {
?>
<script>
// Select the header element
var header = document.querySelector(‘header’);
// Get the offset position of the header
var sticky = header.offsetTop;
// Add the sticky class to the header when you reach its scroll position. Remove “sticky” when you leave the scroll position
function addSticky() {
if (window.pageYOffset > sticky) {
header.classList.add(“sticky”);
} else {
header.classList.remove(“sticky”);
}
}
// Add the sticky class to the header when you scroll the page
window.onscroll = function() {
addSticky();
};
</script>
<?php
}
add_action( ‘wp_footer’, ‘sticky_header’ );Ovaj kod radi dvije bitne stvari,
Funkcija sticky_header se aktivira kada korisnik skroluje stranicu i zaustavlja se kada prestane pomicanje.
Drugo, akcija add_action('wp_footer', 'sticky_header'); koristi adresu....
Sačuvajte kod i to je to. Uspješno ste kreirali WordPress dodatak koji čini zaglavlje vaše web stranice ljepljivim kada ga korisnici skroluju.
Korak 7: Aktivirajte dodatak. U akciji.
Vratite se na svoju stranicu i aktivirajte dodatak.
Kada se krećete kroz živu verziju web-mjesta, zaglavlje vaše stranice će ostati na vrhu stranice.
Nakon što vidite učinak novog dodatka na svojoj demo stranici, vrijeme je da ga isprobate na svojoj stvarnoj web lokaciji.
Prije toga provjerite jeste li dodatak testirali na greške i ranjivosti. Riješite ih, ako je primjenjivo. iz predostrožnosti, napravite rezervnu kopiju vaše WordPress stranice prije implementacije vašeg novog dodatka.
Ako ste zadovoljni performansama dodatka na vašoj web lokaciji, možete učitati svoj dodatak u spremište WordPress dodataka. Budući da ga vlasnici web stranica koriste besplatno, dobićete povratne informacije o tome šta da poboljšate i kako to učiniti.
A ako želite zaraditi novac sa svojim dodatkom, možete ga prodati na jednoj od web stranica koje smo gore naveli
zaključak
Ako ste do sada stigli, složićete se da je kreiranje WordPress dodatka relativno jednostavno. Prateći uputstva u ovom vodiču, moći ćete da kreirate osnovni WordPress dodatak. Možete eksperimentirati s koliko god funkcija želite i poboljšati funkcionalnost svog dodatka.
Kreiranje složenih dodataka slijedi isti metod. Više funkcionalnosti znači više funkcija u vašoj datoteci dodataka.
Da li ste ikada pokušali da kreirate WordPress dodatak? Hajde da razgovaramo o vašem iskustvu u odeljku za komentare ispod.
