XAMPP jako środowisko lokalne i instalacja WordPress

Instalacja środowiska lokalnego XAMPP i WordPressa Odcinek o numerze 02

To jest pierwszy odcinek z serii WordPress – własny motyw od podstaw, w którym zorganizujemy sobie nasze lokalne środowisko pracy i zainstalujemy CMS WordPress.

Lokalne środowisko pracy

Środowisko lokalne znajduje się na naszym komputerze. Różnice między zdalnym a lokalnym środowiskiem pokazuję w tabeli niżej:

Lokalny serwer Zdalny serwer
Serwer na naszym komputerze (np. XAMPP) Wykupione usługi hostingowe – do publikacji plików, można je wtedy zobaczyć w sieci
Wystarczy zapisać zmodyfikowany plik i odświeżyć stronę w przeglądarce, żeby zobaczyć zmiany Po każdej modyfikacji trzeba wysłać pliki na serwer, żeby przetestować nową poprawkę
Strona jest prywatna (moga ją też wyświetlać inne urządzenia znajdujące się w sieci lokalnej) Strona jest publiczna (o ile nie zostało to wcześniej skonfigurowane w .htaccess)

Instalacja XAMPP

Program XAMPP (można go pobrać stąd) jest pakietem narzędzi, który pozwala na stawianie stron lokalnie – ma w sobie m.in. oprogramowanie Apache, phpMyAdmin, bazę danych MySQL, PHP  – wszystko w jednym programie. Ja korzystam z Windowsa, więc po wejściu na stronę klikam w kafelkę „Xampp for Windows” i rozpoczynam pobieranie instalatora (omawiam tylko wersję dla Windows).

  1. Uruchamiamy instalator – w moim przypadku po uruchomieniu pojawił się komunikat, że mam aktywną kontrolę konta użytkowika (UAC). W takim wypadku można: wyłączyć UAC lub zignorować komunikat i zainstalować Xampp’a bezpośrednio na systemowym dysku C. Ja klikam „OK” i na razie ignoruję ten komunikat.
  2. Po kliknięciu „next” w oknie powitalnym instalatora, wyświetla się lista komponentów, które będą instalowane – nam, na potrzeby tego tutoriala, wystarczy Apache, PHP, MySQL i phpMyAdmin.
  3. Następnie wybieramy folder, w którym zainstalowany zostanie XAMPP – w moim przypadu, żeby uniknąć błędów, instaluję go poza folderem Program Files, czyli bezpośrednio na dysku C.
  4. Odznaczam pole „Learn about Bitnami” i przechodzę do procesu instalacyjnego.

Po zainstalowaniu, jesteśmy pytani czy chcemy uruchomić w tej chwili panel kontrolny – zaznaczam checkbox potwierdzający tą decyzję i klikam „Finish„. Następnie wybieram wersję językową programu i przechodzę do panelu kontrolnego – obok usług Apache i MySQL klikam w „Start„. Ostatecznie po rozpoczęciu, okno powinno wyglądać tak:

Żeby upewnić się, że program działa dobrze, otwieramy przeglądarkę i w pasku adresowym wpisuję localhost. Jeśli wszystko jest OK, to powinna nam się pojawić taka strona:

Najczęstsze problemy z instalacją XAMPP

Inny program działa na tym samym porcie (:80) co XAMPP.

W takim wypadku możemy:

  • zmienić numer portu w ustawieniach xamppa lub
  • zamknąć program, który działa na porcie :80
    w konsoli systemowej wpisujemy: netstat -ano
    w kolumnie Local Addresses szukamy programu, który ma nr portu :80 – zapamiętujemy PID tego programu
    otwieramy menager zadań – zakładka „procesy” – menu: view > select columns > zaznaczam PID
    teraz pojawia się w zakładce „procesy” kolumna PID, szukamy nr powiązanego z programem działającym na porcie :80 i kończymy jego proces działania
  • jeśli to Skype przeszkadza w uruchomieniu XAMPP’a, to w ustawieniach Skype’a można zmienić nr portu

WordPress w środowisku lokalnym

Założenie nowej bazy danych

Instalacja WP wymaga nowej bazy danych, w której będą zapisywane wszystkie informacje – posty, komentarze, kategorie, ustawienia itd. Bazę danych zakłada się w panelu phpMyAdmin, do kórego dostajemy się wpisując w pasku adresowym w naszej przeglądarce: localhost/phpmyadmin.

  1. W panelu klikamy w zakładkę Databases (Bazy danych).
  2. Tworzymy nową bazę danych:
    • wpisujemy nazwę bazy danych – ja nazywam ją dbcloudy
    • obok wybieramy metodę porównywania napisów – utf8_general_ci
  3. Następnie tworzę nowego użytkownika dla bazy dbcloudy – klikam w zakładkę Priviliges (Uprawnienia) – poniżej tabeli z listą użytkowników, którzy mają dostęp do naszej bazy, jest sekcja „New” a w niej link „Add user account” – klikam w niego i wypisuję dane nowego użytkownika:
    • user name: dbcloudy_user
    • host name: localhost
    • password: [hasło naszego użytkownika]
  4. W sekcji „global priviliges” zaznaczam checkbox „Check All” i na samym dole strony klikam w „Go„.

Zakładanie nowej bazy danych w phpMyAdmin

Gdy pracujemy na zdalnym serwerze, dbamy o bezpieczeństwo: nazwa użytkownika bazy danych powinna być unikalna i inna niż nazwa bazy danych a hasło użytkownika – silne.

#Wskazówka! #CCdr

Pobranie najnowszej wersji WordPress

WordPress pobieramy z oficjalnej strony – tam znajdziemy ostatnią opublikowaną wersję WordPress’a (w moim przypadku jest to wersja 4.9.8). Po pobraniu, wypakowywuję WordPressa z archiwum.

Umieszczenie WP na lokalnym serwerze

Wszystkie pliki, które będziemy chcieli umieścić na lokalnym serwerze, wrzucane są do katalogu htdocs (c:\xampp\htdocs). Po zainstalowaniu XAMPP’a usuwam całą zawartość folderu htdocs i tworzę w tym miejscu nowy folder o nazwie cloudy. W tym folderze bezpośrednio umieszczam wypakowane wcześniej pliki WordPress’a.

Finalnie, folder htdocs ma strukturę:

htdocs
|-- cloudy
|    |-- wp-admin
|    |-- wp-content
|    |-- ...

Teraz, kiedy pliki niezbędne do instalacji WP są już na lokalnym serwerze, otwieram przeglądarkę i w pasku adresowym wpisuję: localhost/cloudy.

Instalacja WordPress’a

W oknie instalacyjnym wybieram polską wersję językową. W kolejnym kroku trzeba skonfigurować połączenie z bazą danych:

Gdy pracujemy na zdalnym serwerze: ze względów bezpieczeństwa warto zmienić prefiks tabel z wp_ na jakiś inny.

#Wskazówka! #CCdr

Wordpress - konfiguracja połączenia z bazą danych

W kolejnym kroku uzupełniamy informacje o naszej nowej stronie:

Wordpress - uzupełnienie informacji o stronie

Gdy pracujemy na zdalnym serwerze, ze względów bezpieczeństwa warto, żeby użytkownik miał unikalną nazwę ( oklepane „admin” odpada) i mocne hasło – np. wygenerowane generatorem.

#Wskazówka! #CCdr

Przechodzimy przez proces instalacyjny, po którym możemy się zalogować do panelu administratora wpisanymi wcześniej danymi. Po przejściu na stronę główną widzimy domyślnie zainstalowany motyw Twenty Seventeen, który w kolejnych odcinkach zastąpię nowym motywem Cloudy Blog.

To by było na tyle w temacie przygotowywania się do pracy z WordPressem w środowisku lokalnym – jeśli coś jest niejasne lub spotkałeś/aś po drodze jakieś problemy – napisz w komentarzu, chętnie pomogę. 🙂