Rozwój WordPress dla początkujących: pierwsze kroki

Interesuje Cię nauka PHP i budowanie własnych motywów i wtyczek do WordPress? Lub po prostu jest w stanie kodować własne dostosowania zabójca dla swoich stron internetowych?

Nauka tworzenia WordPress może wydawać się zniechęcającą rzeczą do zrobienia, ale wszystko sprowadza się do rozpoczęcia. Przygotowaliśmy więc tę darmową serię, aby pomóc ci rozpocząć nowy rok.

W ciągu pięciu tygodni nauczysz się PHP i zaczniesz kodować własne motywy i wtyczki od zera.

Jest to pierwszy post z naszej pięcioczęściowej serii dla początkujących, uczący Cię podstawowych pojęć rozwoju WordPress, abyś mógł przejść od majsterkowicza do programisty.

Uwaga: w przypadku tej serii ważne jest, aby mieć już dogłębną wiedzę na temat HTML i CSS, ponieważ oba te języki są niezbędnymi elementami konstrukcyjnymi podczas pracy z WordPress.

Zaczynajmy.

  • Jak Działa WordPress
  • Obszary rozwoju
    • Tematy
    • Wtyczki
    • REST API
    • Rdzeń
  • Rozwój WordPress: czego musisz się nauczyć
    • HTML i CSS
    • PHP
    • Javascript
    • MySQL
  • Zaawansowane Narzędzia
  • WordPress to lek bramy
  • Dalsze lektury i opracowania
  • Przegapiłeś Tutorial z naszej serii?

Jak Działa WordPress

Aby zrozumieć, co i jak możemy rozwijać dla WordPress, zaczniemy od szybkiego przyjrzenia się, jak działa WordPress.

Istnieją trzy główne komponenty: rdzeń, motywy i wtyczki.

Na rdzeń kod zawiera wszystkie domyślne funkcje, które składają się na system zarządzania treścią WordPress. Obejmuje to wszystko, od zaplecza administracyjnego po funkcje takie jak planowanie postów, sprawdzanie siły hasła, umożliwienie tworzenia użytkowników i tak dalej.

Podczas gdy rdzeń jest odpowiedzialny za backend strony internetowej i jej działanie, tematy są odpowiedzialni za front-end i wygląd stron internetowych. Używamy administratora WordPress do tworzenia postów, stron i innych treści witryny, ale dokładnie to, jak nasze posty i strony są wyświetlane odwiedzającym, zależy od tematu. Daje to znaczną władzę nad swoją stroną internetową. Możesz zainstalować i aktywować gotowe motywy lub całkowicie wyjąć z pudełka i przejść własną drogę z niestandardowymi projektami.

Najprostszy sposób na opisanie wtyczki jest to, że zapewniają one dodatkową funkcjonalność WordPress. Aby tak się stało, wtyczka może modyfikować zaplecze i / lub front-end witryny. Wtyczka, która dodaje przycisk Tweet na Twitterze jest dobrym przykładem. Prawdopodobnie utworzyłoby to nową stronę ustawień w menu administratora zaplecza, w którym można byłoby skonfigurować domyślne opcje tweeta użytkownika, a także dodałoby się do front-endu strony internetowej, najprawdopodobniej wyświetlając się pod postem.

Obszary rozwoju

Jeśli chodzi o rozwój WordPress, możesz opracować dowolny z trzech głównych komponentów powyżej oprócz samodzielnych aplikacji za pomocą nowego interfejsu API REST, ale o tym za chwilę.

Niezależnie od tego, co chcesz zrobić z WordPressem, polecam podążanie ustaloną ścieżką w swoich badaniach. Poniższa lista pomoże Ci zapoznać się z systemami, które musisz znać przed learning więcej o wybranym obszarze:

  1. Tematy
  2. Wtyczki
  3. REST API
  4. Rdzeń

Tematy

Uczenie się, jak działają motywy i jak je rozwijać, pozwoli Ci tworzyć strony internetowe i tworzyć witryny jednostronicowe, dynamiczne strony o dużej zawartości i wszystko pomiędzy. Pozwoli to również uzyskać lepszą / większą pracę Klienta (jeśli to jest to, co jesteś zainteresowany realizacją), a nawet przejść do biznesu sprzedaży tematycznej.

Istnieje wiele udanych autorów tematów na rynkach, takich jak Themeforest oraz Mojo Marketplace, m.in.

W momencie pisania tego, najpopularniejszy motyw na Themeforest sprzedał 1,377 w zeszłym tygodniu-to ponad $81,000 w zaledwie tydzień! To dużo pieniędzy, jeśli możesz opracować idealny motyw.

Chociaż nie wszyscy twórcy motywów zarabiają dość dużo pieniędzy, a Ty możesz nie stać się multimilionerem z dnia na dzień, nadal możesz zarabiać na życie z motywów, jeśli zrobisz to dobrze.

Jeśli chcesz zobaczyć kilka świetnych przykładów motywów, spójrz na rynki, o których wspomniałem powyżej, lub sprawdź katalog motywów WordPress, w którym wszystko jest za darmo. Wielu twórców motywów po raz pierwszy również publikuje swoje prace w katalogu.

Wtyczki

W pewnym sensie wtyczki są siłą napędową WordPressa, przekształcając go w wszystko, od forum po sieć społecznościową, platformy e-commerce i wiele więcej za naciśnięciem przycisku. Wtyczki dają całkowitą kontrolę nad wszystkimi aspektami systemu WordPress, umożliwiając modyfikowanie wszystkiego, co chcesz. Może to być ogromna pomoc w tworzeniu białej etykiety WordPress dla klientów, dodając, że jedna mała funkcja, której zawsze potrzebujesz; tworzenie WordPress własnego.

Plugin marketplaces również istnieją i są zazwyczaj własnością niektórych z tych samych firm, które również prowadzą rynki tematyczne. CodeCanyon jest zdecydowanie największy z ponad 4000 wtyczek dostępnych do zakupu. Sprzedaż jest zwykle niższa niż w przypadku motywów, ale jeśli znajdziesz odpowiednią niszę, nadal może być bardzo opłacalna.

WordPress ma również bezpłatny katalog wtyczek z ponad wtyczkami 40,000. Jest to świetne źródło narzędzi, inspiracji i przykładów świetnego kodu (a także złego kodu, niestety).

REST API

Korzystanie z REST API nastąpi nieco później w twojej karierze, gdy opanujesz motywy i rozwój wtyczek, chociaż teoretycznie możesz być w stanie go wykorzystać, jeśli znasz całkiem dobrze inny język, taki jak Java lub Ruby.

REST API jest stosunkowo nowy i pozwala na tworzenie prawdziwych aplikacji opartych na WordPress. Obejmuje to aplikacje na iPhone ‘ a i Androida oraz wszelkiego rodzaju szalone rzeczy, takie jak aplikacje telewizyjne, nawet jeśli znasz inne języki programowania.

Najlepszym sposobem na wyjaśnienie tej funkcji jest porównanie jej z czymś takim jak Twitter lub Instagram. Bez wątpienia widziałeś czyjś kanał na Twitterze wyświetlany na ich stronie internetowej. Aby dodać tę funkcję do własnej witryny, nie musisz wiedzieć, jak działa rdzeń kodu Twittera, wystarczy trochę kodu, który mówi: proszę odzyskać moje ostatnie pięć tweetów. Twitter obsługuje rzeczywiste pobieranie, wypluwając dane z pięciu tweetów, o które prosiłeś. Następnie możesz użyć HTML i CSS do wyświetlenia tych danych.

To jest dokładnie to, co robi REST API dla WordPress. Możesz połączyć się z dowolną sieciąmiejscu i poproś o ostatnie pięć postów. Ale możesz zrobić o wiele więcej: możesz usuwać użytkowników, tworzyć użytkowników, edytować kategorie i nie tylko (co oczywiście musisz uwierzytelnić). Oznacza to, że możesz użyć WordPress jako repozytorium informacji i zbudować front-end i/lub backend przy użyciu zupełnie innego systemu.

Rdzeń

WordPress jest rozwijany przez społeczność tysięcy wolontariuszy na całym świecie. W sumie 471 osób pracowało nad WordPress 4.4, a wiele innych osób pracuje nad innymi aspektami WordPress, od tłumaczeń i aplikacji mobilnych po dostępność i wsparcie.

W zasadzie, możesz się zaangażować już teraz. Chociaż musisz mieć sporo doświadczenia, aby wnieść kod do rdzenia WordPress, możesz zacząć identyfikowanie błędów, weryfikowanie ich i przesyłanie pomysłów w dowolnym momencie za pomocą Trac WordPress, miejsca do naśladowania wraz z rozwojem kodu rdzenia WordPress.

Jeśli znalazłeś błąd, możesz dołączyć kod, który go usunie. Po sporej ilości przeglądu i weryfikacji, Twój kod zostanie użyty, jeśli wszystko się sprawdzi. Jest to najlepszy sposób, aby zaangażować się w przyczynianie się do rozwoju podstawowego.

ThemeForest is by far the most popular WordPress theme marketplace with more than 6000 themes for sale.
ThemeForest jest zdecydowanie najpopularniejszym rynkiem motywów WordPress z ponad motywami 6000 na sprzedaż.

Rozwój WordPress: czego musisz się nauczyć

Istnieje dobrze zdefiniowany zestaw narzędzi, z którymi musisz się zapoznać, aby rozpocząć tworzenie WordPress i projektowanie stron internetowych WordPress.

Dla każdego dobrego programisty proces uczenia się nigdy się nie kończy. Przygotuję dla Ciebie pakiet startowy tutaj, a także omówię niektóre z bardziej zaawansowanych narzędzi, na które możesz wpaść, gdy dowiesz się więcej.

Absolutne minimum, z którym musisz się czuć komfortowo, to HTML, CSS i PHP. Oprócz tych języków, w końcu będziesz chciał nauczyć się JavaScript i MySQL w pewnym momencie. Kiedy dobrze znasz te języki, możesz przejść do rzeczy takich jak LESS/SASS, Coffeescript, XML, JSON i tak dalej. Żaden z tych języków nie jest niezbędny do rozwoju WordPress, ale ich znajomość poszerzy twoje horyzonty i/lub znacznie ułatwi Ci życie jako programista.

HTML i CSS

Pierwsze dwa języki, których powinieneś się nauczyć to HTML i CSS. Bez względu na to, jaki kod piszesz, bez względu na język, którego używasz, wszystko ostatecznie sprowadza się do HTML podczas wysyłania stron internetowych do użytkownika, i bardzo prawdopodobne, że niektóre CSS stylizowały tę stronę.

HTML odpowiada za nadawanie struktury witrynom. Na poziomie podstawowym oznacza to, że będziesz decydować, jaki tekst powinien być nagłówkiem, jaki powinien być listą, co znajduje się na pasku bocznym, a co w nagłówku i stopce. Na głębszym poziomie faktycznie podejmujesz ważne decyzje SEO i optymalizacyjne. Na razie nie martw się tym, ponieważ opanowanie składni jest najważniejsze.

CSS służy do stosowania stylów do struktury HTML. Zdefiniujesz kolor tekstu, linki, odstęp między akapitami, wyrównanie obrazu, kolory obramowania, właściwości float, Grubość obramowania i inne elementy wykorzystujące kod CSS. CSS jest niezwykle łatwy do nauczenia, ale bardzo trudny do opanowania.

Strona web developer W3Schools zapewnia fantastyczne samouczki na temat korzystania z HTML i CSS.

PHP

PHP jest niezwykle popularnym językiem skryptowym po stronie serwera i, zgodnie z usługą web technology survey w3techs, jest używany w 81,6% wszystkich stron internetowych, na których język jest znany. PHP jest językiem WordPress (i większość innych systemów zarządzania treścią) są zbudowane na i, jako takie, gruntowna znajomość PHP jest niezbędna do rozwoju WordPress.

Po prostu znając PHP, zyskasz więcej niż tylko wiedzę do kodowania dla WordPress. Nauka dowolnego języka po stronie serwera da ci wgląd w to, jak działa programowanie i da ci specjalny rodzaj logiki, którego możesz użyć do rozwiązywania wszelkiego rodzaju problemów w trybie offline i offline.

Język po stronie serwera różni się od języka po stronie klienta-takiego jak HTML – tym, że jest najpierw przetwarzany na serwerze. W HTML możesz napisać kod dla Dzień Dobry. a ten HTML zostanie wysłany do przeglądarki tak, jak jest, gdzie odwiedzający zobaczyliby” Dzień dobry”.

W języku po stronie serwera można napisać kod dla czegoś takiego jak good [time_of_day]. a zanim to polecenie zostanie wysłane do użytkownika, serwer przetworzy je i wykombinuje, co umieścić w miejsce [time_of_day]. W zależności od pory dnia, w której uzyskujesz dostęp do witryny, możesz zobaczyć “Dzień dobry” lub “Dobry wieczór”. Zauważ, że dane, które twoja przeglądarka otrzymuje, są nadal w zwykłym starym kodzie HTML, ale zostały wcześniej przetworzone na serwerze. Zauważ również, że powyższy kod nie jest rzeczywistym kodem PHP, jest to tylko przykład pokazujący logikę.

W3Schools zapewnia również fantastyczny samouczek PHP. Przyjrzymy się podstawom programowania w PHP w drugim samouczku z tej serii, ale warto odświeżyć swoje umiejętności, aby stać się biegłym.

Podobnie jak w przypadku wszystkich języków programowania, jest to praktyka, która sprawi, że wszystko zatonie i pomoże Ci się poprawić. Możesz nauczyć się prawie całego PHP w ciągu kilku dni, ale nadal nie masz pojęcia, co robisz-musisz wypróbować rzeczy, zepsuć, nie zrozumieć, co się dzieje. Ogólnie rzecz biorąc, trzymaj się tego! Jak mówią, praktyka czyni mistrza.

JavaScript

Rola JavaScript w Internecie stale rośnie, zwłaszcza gdy pojawiają się narzędzia oparte na JavaScript, takie jak Node i Angular.

JavaScript jest zwykle używany do dodawania dynamicznych funkcjonalności do stron internetowych i do asynchronicznego ładowania.

Podam wam przykład obu.

Jeśli chcesz, aby formularz był całkowicie ukryty, ale zanikał wewnątrz lightboxa, gdy użytkownik kliknie przycisk, możesz użyć JavaScript, ponieważ może obsługiwać animację i być może inne funkcje, takie jak sprawdzanie, czy formularz jest wypełniony poprawnie przed wysłaniem.

Asynchroniczne ładowanie odbywa się za pomocą mechanizmu zwanego AJAX. AJAX może być używany do pobierania informacji z serwera, a następnie wyświetlania ich bez przeładowywania strony. Dobrym przykładem jest niekończące się przewijanie, w którym ładuje się pierwsze 10 postów, a gdy zbliżysz się do dołu strony, pobiera się następne 10 postów i dołącza do bieżącego zestawu.

W listopadzie Automattic uruchomił Calypso, aplikację komputerową, która pozwala użytkownikom zarządzać WordPress.com i strony internetowe z Jetpack. Napisane czysto w języku JavaScript i wykorzystującym biblioteki takie jak Node i React, Calypso sygnalizuje potencjalne odejście od polegania WordPress na PHP. Jako taki, współzałożyciel WordPress zachęcił programistów do ” głębokiej nauki JavaScript.”

Dobrym miejscem do rozpoczęcia nauki JavaScript jest, ponownie, W3Schools. Nie będziemy eksplorować Javascript w tej serii dla początkujących, ale warto się uczyć, ponieważ znajomość tego języka stanie się niezbędna dla programistów WordPress w nadchodzących latach.

Wielu programistów najpierw uczy się JavaScript poprzez niezwykle popularny framework jQuery. Jest szeroko stosowany w WordPress i w milionach projektów w Internecie. Chociaż jest to w porządku, należy pamiętać, że JavaScript to coś więcej niż tylko jQuery, a samodzielna nauka języka JavaScript jest również dobrym pomysłem.

MySQL

MySQL jest językiem używanym do dostępu i pracy z danymi w bazie danych. WordPress używa go mocno, aby odzyskać wszystkie swoje dane, ale jako programiści nie będziesz go zbytnio potrzebował, ponieważ WordPress ma własny zestaw funkcji pomocniczych. W niektórych szczególnych przypadkach może być konieczne napisanie własnego zapytania do bazy danych lub może chcesz zoptymalizować coś dla własnej witryny, więc posiadanie podstawowej wiedzy o MySQL jest pomocne.

Praca z bazami danych jest dość prosta. Tabela w bazie danych jest bardzo podobna do arkusza kalkulacyjnego Microsoft Excel. Każda kolumna ma nagłówek, a dane są przechowywane w wierszach. MySQL służy do dodawania, usuwania, modyfikowania i pobierania danych. Możesz napisać zapytanie MySQL, które zwraca wszystkie posty, które mają słowo “awesome” w nich i mają więcej niż osiem komentarzy. Możesz również znaleźć wszystkich użytkowników, którzy mają na imię ” Daniel.”Możesz również użyć MySQL, aby obliczyć sumę wszystkich wyświetleń reklam lub znaleźć najpopularniejszą reklamę w sieci, na przykład.

Ponownie, pisanie surowego kodu MySQL w WordPress jest rzadkie, ale tak się dzieje, a zrozumienie, jak działa język, pomoże Ci napisać lepszy kod w ogóle. Udaj się do W3Schools, aby uzyskać tutorial SQL.

W3Schools is an excellent free resources for learning HTML, CSS and MySQL.
W3Schools to doskonałe darmowe zasoby do nauki HTML, CSS i MySQL.

Zaawansowane Narzędzia

Po zapoznaniu się z co najmniej trzema podstawowymi językami-HTML, CSS i PHP – możesz zacząć odkrywać różne narzędzia pomocnicze. Jedną z pierwszych rzeczy, których ludzie się uczą, jest LESS i / lub SASS. Oba są supersetami CSS, co oznacza, że wszystkie poprawne kody CSS są poprawne LESS i Sass code. Oba języki dodają możliwość używania zmiennych, funkcji i innych konstrukcji w CSS, co nie jest domyślnie możliwe.

Narzędzia do budowania są czymś, co będziesz chciał zbadać w pewnym momencie, jak również. Najlepsze to łyk i chrząkanie. Mogą one monitorować pliki zmian i uruchamiać różne zadania, gdy wymagania są spełnione. Na przykład za każdym razem, gdy zmienisz plik SASS, możesz automatycznie skompilować go do CSS i zapisać do określonego pliku. Obrazy mogą być optymalizowane, pliki konkatenowane, pobrane pakiety zewnętrzne i wszelkiego rodzaju inne przydatne zadania mogą być wykonane za pomocą tych narzędzi.

Na ng > wiersz poleceń lub terminal, jest czymś, na co powinieneś również spojrzeć. Tak, korzystanie z linii poleceń może wyglądać przerażająco, ale tak naprawdę nie jest – wystarczy wpisać kilka poleceń, aby zaoszczędzić tyle czasu. Prosty skrypt i narzędzie o nazwie WP-CLI może zainstalować WordPress w ciągu kilku sekund, w tym instalację motywów, wtyczek i treści testowych, podczas gdy robienie tego ręcznie zajmuje znacznie dłużej i wymaga znacznie więcej wysiłku.

Kontrola wersji jest kolejnym z tych niezwykle przydatnych narzędzi, o których nie wiesz, że potrzebujesz, dopóki nie spróbujesz. Pierwotnie został opracowany do pracy nad tym samym kodem w zespołach, ale może być używany jako rozwiązanie do zarządzania projektami, błędami i tworzenia kopii zapasowych w tym samym czasie. Najpopularniejszymi rywalami są SVN i Git. Git wygrywa tę rundę ze mną dzięki nieco lepszemu przepływowi pracy i Githubowi, który zapewnia internetową usługę hostingu repozytorium Git.

WordPress to lek bramy

Wspaniałą rzeczą w WordPress jest to, że może być bramą do nauki innych umiejętności tworzenia stron internetowych i języków.

Osobiście miałem to doświadczenie, najpierw ucząc się obiektowego PHP, a następnie wchodząc do Laravel, odległych obszarów, takich jak narzędzia do budowania, LESS/SASS, narzędzia wiersza poleceń i takie. Odważyłem się również na natywne terytorium aplikacji z C# i innymi językami.

Kiedy już wszystko działa, uczysz się coraz więcej, tworząc nowe i większe projekty, a wszystko staje się łatwiejsze. Po obiektowym PHP, nauka C# nie była wielkim wysiłkiem, ponieważ twój mózg przyzwyczaja się do jego logiki. Jest to podobne do nauki gry na ukulele po gitarze lub nauki jazdy ciężarówką po ćwiczeniu jazdy samochodem. Istnieje wiele różnic, ale gdy już opanujesz podstawy, poruszanie się do przodu nie jest tak dużym skokiem.

Dalsze lektury i opracowania

Teraz, gdy wiesz, co jest potrzebne, aby rozpocząć tworzenie WordPress, możesz czuć się przytłoczony, ale nie martw się, tak wszyscy się czują w tym momencie!

Nie mogę wystarczająco podkreślić, jak ważne jest, aby się nie zniechęcać. Wszyscy programiści muszą od czegoś zacząć. Większość z nich jest okropna w kodowaniu, gdy zaczynają, zmagają się ze zrozumieniem pojęć i popadają w frustrację. Ale to ci, którzy przebijają się i nie poddają się, i zawsze naciskają, aby dowiedzieć się, kto odnosi sukces – w tej determinacji, która oddziela dobrych programistów od złych.

Przegapiłeś Tutorial z naszej serii?

Możesz nadrobić wszystkie pięć postów WordPress dla początkujących tutaj:

  • Rozwój WordPress dla początkujących: pierwsze kroki
  • Rozwój WordPress dla początkujących: Nauka PHP
  • Rozwój WordPress dla początkujących: tworzenie motywów
  • Rozwój WordPress dla początkujących: widżety i menu
  • Rozwój WordPress dla początkujących: budowanie wtyczek
Changes to WordPress' core code is tracked at Make WordPress Core.
Zmiany w kodzie rdzenia WordPress są śledzone na Make WordPress Core.

W międzyczasie oto, co musisz zrobić przed uruchomieniem WordPress Development dla początkujących: Nauka PHP:

  • Odśwież swoją wiedzę HTML i CSS. Jak wspomniałem powyżej, W3Schools jest fantastycznym źródłem do nauki HTML i CSS. Jeśli chcesz bardziej praktycznego podejścia, Codecademy ma świetny Kurs HTML i CSS dla początkujących, który zawiera wiele praktycznych przykładów.
  • Skonfiguruj środowisko localhost na swoim komputerze. Praca z WordPress na localhost install jest nie tylko szybsza, ale także bezpieczniejsza i bezpieczniejsza. Jeśli nie wiesz, jak skonfigurować WordPress na swoim komputerze, sprawdź nasz post, Jak skonfigurować go w systemie Windows, a także Jak skonfigurować go na komputerze Mac.
  • Pobierz dobry edytor tekstu. Używam Atoma, który ma świetny zestaw funkcji. Będę go używał przez całą serię, ale tak naprawdę nie ma znaczenia, czego używasz, o ile wygodnie Ci z niego korzystać.