Dodano 2016-07-09 14:44:17 przez Daniel
Witam w pierwszej części mojego kursu z cyklu własna wtyczka. Jeśli zdecydowałeś się na WordPressa i chciałbyś nabyć umiejętność rozwijania jego funkcjonalności to ten kurs jest właśnie dla ciebie. Wtyczki pozwalają robić z WordPressem co tylko zechcesz, wystarczy trochę kreatywności a można stworzyć portal społecznościowy czy grę właśnie dzięki wtyczkom.
W tej części wprowadzę Cię w tematykę tworzenia wtyczek. Na początek kilka spraw organizacyjnych jak instalacja WordPressa, kilka słów o wtyczkach. Produktem tej części będzie nasza pierwsza wtyczka, która z założenia ma pokazać od czego zacząć. Co będzie robić nasza pierwsza wtyczka?
No to zaczynamy, na początek zainstalujemy sobie czystego CMS-a.
Standardowa instalacja WordPressa nie wymaga zbyt wiele omawiania:
Teraz kiedy mamy już zainstalowanego WordPressa, możemy spokojnie przejść do pisania pierwszej wtyczki. Może to być pojedynczy plik PHP jednakże tak nie robimy, ponieważ zdecydowana większość wtyczek jest umieszczona w swoich folderach. To taka kwestia porządkowa. Kolejną istotną kwestią jest nazwa wtyczki. Warto tutaj trochę się zastanowić ponieważ istnieje już bardzo wiele wtyczek, warto postarać się aby nazwa wtyczki była zarazem unikalna i celnie wskazywała na to czego dotyczy jej funkcjonalność.
Aby stworzyć wtyczkę należy wejść do katalogu wp-content/plugins i utworzyć katalog o takiej samej nazwie jak wtyczka. Najlepiej używać tutaj tylko liter i podkreślników. W naszym przykładzie nazwiemy plugin po prostu moja_pierwsza_wtyczka.
Kiedy mamy już katalog tworzymy w nim plik o takiej samej nazwie. Będzie to główny plik wtyczki. Teraz otwieramy plik w dowolnym edytorze kodu. Do programowania polecam NetBeans, który jest jednym z najlepszych darmowych programów do kodowania stron www, no chyba że bardziej profesjonalny i droższy PHPStorm.
Na początku określany naszą wtyczkę. WordPress pobiera te dane z komentarza na początku naszego głównego pliku wtyczki. W tym przypadku na samym początku pliku moja_pierwsza_wtyczka.php wstawiamy komentarz:
/**
Plugin Name: Moja pierwsza wtyczka
Description: Opis mojej pierwszej wtyczki wyświetlającej napis Hello World
Version: 0.1
Author: Daniel Kuczewski
Author URI: http://zaawansowanywordpress.pl
Plugin URI: http://zaawansowanywordpress.pl/1-dodawanie-wtyczki-witaj-swiecie/
License: GPL
*/Tutaj określamy kolejno:
Dzięki temu fragmentowi nasza wtyczka będzie już widoczna w panelu administratora wśród pozostałych wtyczek i wystarczy ją tylko aktywować.
Obrazek przedstawia naszą wtyczkę w panelu administratora, możemy włączyć, edytować lub usunąć. Jest tutaj także widoczny opis wtyczki wersja oraz podlinkowane informacje o autorze i witrynie wtyczki. Te informacje bardzo często przydają się użytkownikom szczególnie witryna wtyczki gdy jest ona bardziej zaawansowana.
Wprawdzie już mamy naszą pierwszą wtyczkę, ale zupełnie nic ona nie robi dlatego też kodujemy dalej.
Aby dodać menu w panelu administratora należy wykorzystać funkcję:
add_menu_page( string $page_title, string $menu_title, string $capability, string $menu_slug, callable $function = '', string $icon_url = '', int $position = null )
Dokumentację tej i każdej innej funkcji WordPressaa można znaleźć na oficjalnej stronie. Zachęcam do bardziej szczegółowego anglojęzycznego opisu Tutaj. A tak pokrótce co oznaczają poszczególne parametry:
Jeśli chcemy aby odnośnik do naszej wtyczki wyświetlał się na przykład pomiędzy mediami a stronami to pozycję określamy na 12.
Przy okazji skoro już jesteśmy przy menu, warto dodać kilka słów o podmenu. Można tutaj podpiąć kolejną opcję nie tylko pod menu naszej wtyczki ale także dowolne inne. Aby to zrobić wystarczy znać unikalną nazwę ($menu_slug). I tak wygląda nasza funkcja do tworzenia podmenu:
add_submenu_page( string $parent_slug, string $page_title, string $menu_title,string $capability, string $menu_slug, callable $function = '' )
Większość parametrów już znamy, z nowych występuje $parent_slug czyli $menu_slug menu nadrzędnego.
Teraz kiedy już poznaliśmy większość teorii dotyczącej dodawania menu przejdźmy do praktyki. Stworzymy sobie menu i podmenu. Nasza opcja główna będzie wyświetlała napis „Hello World” zaś po kliknięciu odnośnika w podmenu ukaże nam się napis „Hello World 2”.
Pod naszym nagłówkiem zawierającym informacje o wtyczce tworzymy funkcję, dzięki której dołączymy nasze menu wykorzystując zaczep.
function mpw_add_menu(){
add_menu_page( 'Strona główna wtyczki', 'Moja pierwsza wtyczka', 'administrator', 'moja-pierwsza-wtyczka', 'glowna_moja_pierwsza_wtyczka', '', 7 );
add_submenu_page( 'moja-pierwsza-wtyczka', 'Strona podmenu', 'Podmenu', 'administrator', 'moja-pierwsza-wtyczka-podmenu1', 'podstrona_moja_pierwsza_wtyczka' );
}
To co się dzieje w tej funkcji zostało już wytłumaczone. Można zauważyć że nazwa jest dość długa, tutaj jako prefiks użyłem pierwszych liter nazwy wtyczki. Warto zadbać o to by nazwy funkcji były jak najbardziej unikalne ponieważ jest wiele wtyczek i można natrafić na taką samą nazwę funkcji co z kolei może wywołać niepowołane konsekwencje.
Warto zauważyć że wprowadziliśmy tutaj już nazwy funkcji odpowiedzialnych za wyświetlenie treści glowna_moja_pierwsza_wtyczka oraz podstrona_moja_pierwsza_wtyczka. Teraz stworzymy te funkcje.
function glowna_moja_pierwsza_wtyczka(){
echo "Hello World";
}
function podstrona_moja_pierwsza_wtyczka(){
echo "Hello World 2";
}
Jak już wcześniej określiliśmy funkcje te wyświetlają napisy. Teraz nie pozostaje nic innego jak „zaczepić” nasze menu.
O co chodzi z zaczepem akcji? Pozwalają one na wywołanie funkcji w określonym momencie. Tak jak w naszym przypadku dodajemy nasz plugin do menu w momencie jego budowania. WordPress udostępnia wiele zaczepów akcji czyli takich momentów, w których możemy wykonać własną funkcję. Daje to całkiem spore możliwości. Możemy „zaczepić” naszą funkcję tak aby wykonała się na przykład w momencie logowania do panelu lub w momencie dodawania wpisu. Jest to temat dość obszerny na oddzielną lekcję ponieważ możemy tworzyć i wykorzystywać własne zaczepy, na ten moment wystarczy nam wiedza że zaczep to jest właśnie taki moment wywołujący nasza funkcję. Aby zaczepić naszą funkcję wykorzystujemy funkcję systemową:
add_action( $tag, $function, $priority, $accepted_args);
Funkcja ta pobiera cztery parametry:
Pozostałe parametry oraz ogólnie zaczepy omawiam w części 5
Teraz skoro już znamy teorię zaczepiamy nasze menu.
add_action( 'admin_menu', 'mpw_add_menu' );
I to już cała nasza wtyczka. Poniżej znajduje się pełny kod wtyczki.
<?php
/**
Plugin Name: Moja pierwsza wtyczka
Version: 0.1
Description: Opis mojej pierwszej wtyczki wyświetlającej napis Hello World
Author: Daniel Kuczewski
Author URI: http://zaawansowanywordpress.pl
Plugin URI: http://zaawansowanywordpress.pl/1-dodawanie-wtyczki-witaj-swiecie/
*/
function mpw_add_menu(){
add_menu_page( 'Strona główna wtyczki', 'Moja pierwsza wtyczka', 'administrator', 'moja-pierwsza-wtyczka', 'glowna_moja_pierwsza_wtyczka', '', 7 );
add_submenu_page( 'moja-pierwsza-wtyczka', 'Strona podmenu', 'Podmenu', 'administrator', 'moja-pierwsza-wtyczka-podmenu1', 'podstrona_moja_pierwsza_wtyczka' );
}
function glowna_moja_pierwsza_wtyczka(){
echo "Hello World";
}
function podstrona_moja_pierwsza_wtyczka(){
echo "Hello World 2";
}
add_action( 'admin_menu', 'mpw_add_menu' );
A oto zrzut ekranu naszego dzieła.
Jak widać mamy menu i nasz napis się wyświetla, czyli plan został wykonany.
Wtyczkę można pobrać tutaj -> moja_pierwsza_wtyczka