Jak zamieścić moją stronę w Internecie

Transkrypt

1 Jak zamieścić moją stronę w Internecie Nota Materiał powstał w ramach realizacji projektu e-kompetencje bez barier dofinansowanego z Programu Operacyjnego Polska Cyfrowa działanie 3.1 Działania szkoleniowe na rzecz rozwoju kompetencji cyfrowych oś priorytetowa III. Cyfrowe kompetencje społeczeństwa

2 [1/31]? Jak zamieścić? To pytanie, które zadaje sobie wiele osób. I nie jest to taka prosta sprawa, jak to się wydaje. Przede wszystkim potrzebujemy dwóch rzeczy. Hostingu czyli udostępniania przez dostawcę usług internetowych zasobów serwerowni i domeny internetowej czyli nazwy strony zakończonej odpowiednim rozszerzeniem np..pl. Przed wybraniem hostingu warto zapoznać się z kilkoma ofertami różnych dostawców, ponieważ zazwyczaj hosting kupujemy na dłuższy okres i dobrze jest porównać parametry i koszt utrzymania hostingu nie tylko przez pierwszy rok, ale i w kolejnych latach. Oczywiście w każdej chwili możemy przenieść dane z jednego hostingu na drugi, ale wiąże się to już z pewnymi działaniami dla bardziej zaawansowanych osób. Wybór domeny jest również bardzo ważny. Warto zastanowić się nad dwiema kwestiami. Pierwsza to nazwa domeny i wybór rozszerzenia. To ją wpisujemy w pasku adresu przeglądarki i wskazane jest, żeby nazwa była intuicyjna, nie była zbyt długa, a rozszerzenie kojarzyło nam się z danym regionem lub krajem. A druga kwestia to wybór rejestratora domen. Podobnie jak w przypadku hostingu warto zapoznać się z kilkoma ofertami różnych dostawców, aby dowiedzieć się jaki będzie koszt odnowienia usługi. Dla osób mniej doświadczonych polecam wybór hostingu i domeny od jednego usługodawcy. Wtedy konfiguracja będzie mniej skomplikowana. Na potrzeby opracowania materiału zdecydowałem się na darmowy hosting prv.pl i darmową domenę od tego samego usługodawcy. Poniżej lista kilku usługodawców hostingu i rejestratorów domen:

3 [2/31] Aby wejść na stronę należy w pasku adresu przeglądarki wpisać (1). Rysunek 1. Strona główna Następnie wybieramy darmowy hosting i klikamy przycisk Załóż (2). Wybór nazwy domeny Rysunek 2. Wybór nazwy domeny Od serwisu otrzymujemy bezpłatną domenę nazwa_strony.prv.pl, gdzie nazwa_strony to podana przez nas nazwa w formularzu (1). W moim przypadku

4 [3/31] będzie to ekompetencje.prv.pl. Oczywiście jeśli posiadamy już domenę lub chcemy wykupić domenę z inną nazwą u innego usługodawcy to możemy to zrobić i przekierować ją na nasz serwer. Zakładanie konta Rysunek 3. Zakładanie konta na prv.pl krok 1 W celu założenia konta w serwisie prv.pl klikamy przycisk Przejdź do rejestracji, a następnie przechodzimy do wypełnienia formularza rejestracyjnego.

5 [4/31] Rysunek 4. Zakładanie konta na prv.pl krok 2 Uzupełniamy wszystkie pola, zaznaczamy pole, że nie jesteśmy robotem, i po zapoznaniu się akceptujemy regulamin serwisu (1). Następnie klikamy przycisk Zarejestruj (2).

6 [5/31] Komunikat powitalny Rysunek 5. Zakładanie konta na prv.pl krok 3 Po założeniu konta otrzymujemy komunikat, w którym zostajemy poinformowani o tym, że na naszą skrzynkę ową została wysłana wiadomość z linkiem aktywującym konto. W tym celu należy zalogować się na pocztę i sprawdzić czy otrzymaliśmy już takiego a. Aktywacja konta w PRV Rysunek 6. Aktywacja konta w PRV krok 1 Aby aktywować konto należy kliknąć w link znajdujący się w wiadomości . Następnie zostaniemy przekierowani na stronę prv.pl, gdzie otrzymamy komunikat Twoje konto zostało właśnie aktywowane.

7 [6/31] Rysunek 7. Aktywacja konta w PRV krok 2 Teraz możemy przejść do panelu logowania. W tym celu klikamy przycisk Zaloguj się. Panel logowania Rysunek 8. Panel logowania Uzupełniamy i hasło, zaznaczamy pole, że nie jesteśmy robotem (1) i klikamy przycisk Zaloguj (2).

8 [7/31] Panel administracyjny Rysunek 9. Panel administracyjny wybór zakładki hostingi Jesteśmy w panelu administracyjnym. Zaczynamy od założenia hostingu. Wybieramy zakładkę Twoje strony i klikamy w Hostingi (1), a następnie naciskamy w przycisk Dodaj nową (2). Dodanie strony Rysunek 10. Panel administracyjny dodanie strony Uzupełniamy pola w formularzu (1). W polu adres strony podajemy nazwę strony, którą wybraliśmy podczas zakładania domeny. Następnie określamy typ strony (2). Dużo firm świadczących usługi hostingowe pozwala w łatwy sposób zainstalować

9 [8/31] skrypt WordPress a czy Joomla. Jeśli chcemy skorzystać z takiej metody instalacji wybieramy w typie strony opcję Gotowa strona, natomiast jeśli chcemy samodzielnie zainstalować Wordpressa a na serwerze, czy chcemy stworzyć stronę w oparciu o inne technologie to wybieramy opcję Hosting z dostępem FTP. Następnie po zapoznaniu się z zasadami korzystania z hostingu zaznaczamy potwierdzenie (3) i klikamy przycisk Zapisz (4). Poniżej przedstawię dwa sposoby instalacji WordPress a na serwerze. 1. Wybór opcji Gotowa strona Instalacja skryptu Rysunek 11. Panel administracyjny instalacja skryptu Wybieramy skrypt z listy. W naszym przypadku jest to Wordpress (1) i klikamy przycisk Zainstaluj (2).

10 [9/31] Przejście do panelu logowania WordPress a Rysunek 12. Panel administracyjny przejście do panelu logowania WordPress a Po zainstalowaniu skryptu otrzymaliśmy komunikat o zainstalowaniu skryptu. Po kliknięciu w przycisk Przejdź przechodzimy do panelu logowania do systemu WordPress. Warto sobie zapisać w notatniku lub gdzieś na komputerze login i hasło do panelu administracyjnego WordPress a. 2. Wybór opcji Hosting z dostępem FTP Konfiguracja połączenia FTP Rysunek 13. Konfiguracja połączenia FTP krok 1 Przy konfiguracji połączenia FTP otrzymujemy dane za pomocą których będziemy mogli się połączyć z naszą stroną: nazwę hosta, użytkownika (1) oraz hasło. Jeśli nie ustawiliśmy hasła należy je ustawić, a następnie klikamy przycisk Zapisz (2).

11 [10/31] Serwer FTP służy do wymiany plików między komputerem a serwerem. Większość usługodawców hostingu ma możliwość zarządzania plikami poprzez panel administracyjny w przeglądarce, ale wygodniejszą formą jest skorzystanie z programów tj. FileZilla czy Total Commander. Rysunek 14. Konfiguracja połączenia FTP krok 2 W kolejnym kroku otrzymujemy komunikat, że hosting został dodany, a hasło zostało zapisane. Teraz możemy powrócić do zakładki twoje strony. W tym celu klikamy krzyżyk w prawym górnym rogu okna.

12 [11/31] Panel administracyjny Rysunek 15. Panel administracyjny wybór zakładki MySQL Jesteśmy w panelu administracyjnym. Przechodzimy do założenia bazy danych. Wybieramy zakładkę Bazy danych i klikamy w MySQL (1), a następnie naciskamy w przycisk Dodaj nową (2). Dodanie bazy danych Rysunek 16. Panel administracyjny dodanie bazy danych krok 1 Przechodzimy weryfikację poprzez zaznaczenie opcji Nie jestem robotem (1), a następnie klikamy w przycisk Dodaj nową bazę MySQL (2).

13 [12/31] Rysunek 17. Panel administracyjny dodanie bazy danych krok 2 Otrzymaliśmy komunikat Dodano nową bazę MySQL. Zamykamy okno klikając krzyżyk w prawym górnym rogu okna. Dane dostępowe bazy danych Rysunek 18. Panel administracyjny dane dostępowe krok 1 Po założeniu bazy danych klikamy w Dane dostępowe. Znajdziemy tam informacje, dzięki którym będziemy mogli się połączyć z bazą danych. W naszym przypadku będziemy musieli je podać podczas konfiguracji WordPress a.

14 [13/31] Rysunek 19. Panel administracyjny dane dostępowe krok 2 Aby zobaczyć hasło klikamy w przycisk Pokaż aktualne hasło (1). Warto zapisać sobie gdzieś w notatniku nazwę bazy danych, użytkownika, host i hasło (2), a następnie zamykamy okno klikając w krzyżyk (3). Pobranie WordPress a Teraz musimy pobrać WordPress a ze strony producenta. W tym celu należy w pasku adresu przeglądarki wpisać (1). Rysunek 20. Strona główna Następnie klikamy przycisk Pobierz WP PL lub nowszą wersję jeśli się pojawi (2).

15 [14/31] Rysunek 21. Pobranie WordPress a krok 1 Wybieramy Zapisz plik i naciskamy przycisk OK. Rozpakowanie WordPress a Rysunek 22. Rozpakowanie WordPress a krok 1 Program został pobrany. Teraz musimy przejść do folderu w którym został zapisany. Jeśli nie zmienialiśmy w ustawieniach przeglądarki domyślnego folderu w którym zapisują się pobrane pliki to nasz program powinien być w folderze Pobrane (1). Wybieramy pobrany plik z folderu Pobrane (2). Jest on skompresowany w związku z tym musimy go rozpakować. W tym celu klikamy prawy przycisk myszy i naciskamy Wyodrębnij wszystkie (3).

16 [15/31] Rysunek 23. Rozpakowanie WordPress a krok 2 W kolejnym kroku musimy określić w którym miejscu na naszym dysku zostanie rozpakowany WordPress. Możemy zostawić domyślną ścieżkę, albo dokonać zmiany klikając przycisk Przeglądaj (1). Po wybraniu ścieżki klikamy przycisk Wyodrębnij (2). Rysunek 24. Rozpakowanie WordPress a krok 3 Po rozpakowaniu pliku zamykamy okno klikając w prawym górnym rogu na krzyżyk.

17 [16/31] Pobranie programu FileZilla za pomocą którego połączymy się z naszym serwerem FTP, aby przesyłać pliki z naszego komputera na nasz serwer. Rysunek 25. Strona główna - pobranie programu część 1 Otwieramy nową kartę w przeglądarce, klikając przycisk z logiem plusa (1) i w pasku adresu wpisujemy (2). Następnie pobieramy program, klikając przycisk Download FileZilla Client (3). Wybieramy wersję oprogramowania w zależności od systemu operacyjnego z którego korzystamy. W moim przypadku jest to wersja 64 bitowa przeznaczona dla systemu Windows. Naciskam przycisk Download FileZilla Client. Rysunek 26. Wybór wersji oprogramowania pobranie programu część 2

18 [17/31] W kolejny kroku wybieramy czy chcemy zainstalować zwykłą wersję FileZilla Client czy wersję Pro. Ja wybrałem wersję standardową ponieważ jest bezpłatna a jej funkcjonalność mi wystarcza. W celu instalacji klikamy przycisk Download. Rysunek 27. Wybór wersji oprogramowania pobranie programu część 3 Program został pobrany. Teraz musimy przejść do folderu w którym został zapisany. Jeśli nie zmienialiśmy w ustawieniach przeglądarki domyślnego folderu w którym zapisują się pobrane pliki to nasz program powinien być w folderze Pobrane. W tym celu klikamy na przycisk Pokaż postęp pobierania plików w prawym górnym rogu przeglądarki. Następnie wybieramy z listy interesujący nas plik i klikamy na ikonę folderu, żeby przejść do folderu w którym został zapisany. Rysunek 28. Pobranie programu FileZilla i przejście do folderu z pobranymi plikami

19 [18/31] Wybieramy pobrany plik z folderu Pobrane (1) i uruchamiamy instalację klikając dwa razy w niego. Rysunek 29. Uruchomienie instalacji FileZilla Instalacja programu. Zapoznajemy się z licencją oprogramowania i naciskamy przycisk I Agree. Rysunek 30. Instalacja FileZilla krok 1

20 [19/31] W kolejnym kroku wybieramy, kto będzie mógł korzystać z programu. Jeśli zaznaczymy pierwszą opcję dostęp do programu będą mieli wszyscy użytkownicy komputera, natomiast jeśli wybierzemy drugą opcję to tylko użytkownik na którego profilu obecnie jesteśmy zalogowani. Po wybraniu odpowiedniej opcji klikamy przycisk Next. Rysunek 31. Instalacja FileZilla krok 2

21 [20/31] W kolejnym kroku wybieramy elementy, które chcemy zainstalować. Po wybraniu elementów klikamy przycisk Next. Rysunek 32. Instalacja FileZilla krok 3

22 [21/31] W kolejnym kroku wybieramy lokalizację instalacji. Po wybraniu naciskamy przycisk Next. Rysunek 33. Instalacja FileZilla krok 4

23 [22/31] Następnie wybieramy pod jaką nazwą w Start Menu zostanie utworzony katalog z programem. Po wybraniu naciskamy przycisk Next. Rysunek 34. Instalacja FileZilla krok 5

24 [23/31] Zakończenie instalacji. Zaznaczając opcję Start FilerZilla now po naciśnięciu przycisku Finish program FileZilla uruchomi się automatycznie. Rysunek 35. Instalacja FileZilla krok 6

25 [24/31] Uruchomienie programu FileZilla. Rysunek 36. Uruchomienie programu FileZilla Aby połączyć się z serwerem FTP musimy wpisać dane naszego serwera FTP w odpowiednie okienka: o Serwer (1), o Nazwa użytkownika (2), o Hasło (3), o Port (4). Po uzupełnieniu wszystkich pól naciskamy przycisk Szybkie łączenie (5).

26 [25/31] Połączenie z serwerem FTP Rysunek 37. Połączenie z serwerem FTP Jeśli podaliśmy poprawnie wszystkie dane: nazwa serwera, nazwa użytkownika, hasło i opcjonalnie port to powinniśmy pomyślnie połączyć się z serwerem FTP. Okno robocze FileZilla podzielone jest na dwie części. Z lewej strony widzimy foldery i pliki znajdujące się na naszym komputerze (1), a po prawej foldery i pliki znajdujące się na naszym serwerze (2). Aby zainstalować WordPress a na serwerze musimy go przenieść z dysku na serwer. W tym celu zaznaczamy folder z WordPressem (po lewej stronie okna roboczego), kopiujemy go i wklejamy po stronie serwera (po prawej stronie okna roboczego).

27 [26/31] Zakończenie transferu plików Rysunek 38. Zakończenie transferu plików W dolnej części okna roboczego mamy trzy zakładki (1): - Pliki w kolejce pokazuje ile plików pozostało do przeniesienia. - Nieudane transfery pokazuje ile plików nieudało się przenieść. - Udane transfery pokazuje ile plików zostało przeniesionych. Po zakończeniu transferu plików otrzymujemy komunikat z informacją o pomyślnym przesłaniu wszystkich plików (2). Teraz możemy zamknąć program klikając na krzyżyk (3).

28 [27/31] Instalacja WordPress a na serwerze. Rysunek 39. Instalacja WordPress a na serwerze krok 1 Otwieramy nową kartę i w pasku adresu przeglądarki wpisujemy adres naszej strony internetowej. W moim przypadku jest to adres ekompetencje.prv.pl/wpadmin/install.php (1). Aby rozpocząć instalację klikamy przycisk Zaczynajmy! (2). W kolejnym kroku musimy podać dane dotyczące połączenia z bazą danych. Jeśli zapisaliśmy je na kartce lub w notatniku wystarczy je przepisać w odpowiednie miejsca w formularzu (1). Po wprowadzeniu danych klikamy przycisk Wyślij (2). Rysunek 40. Instalacja WordPress a na serwerze krok 2

29 [28/31] Jeśli wprowadziliśmy poprawnie wszystkie dane to otrzymamy komunikat o poprawnym połączeniu z bazą danych. Aby przejść do kolejnego etapu instalacji klikamy przycisk Uruchom instalację. Rysunek 41. Instalacja WordPress a na serwerze krok 3 W kolejnym kroku instalacji uzupełniamy formularz, w którym podajemy tytuł naszej witryny i dane potrzebne do utworzenia konta użytkownika w systemie WordPress (1). Po uzupełnieniu formularza przechodzimy dalej klikając przycisk Zainstaluj WordPressa (2). Rysunek 42. Instalacja WordPressa na serwerze krok 4

30 [29/31] Jeśli wszystko poprawnie uzupełniliśmy to w kolejnym kroku otrzymujemy potwierdzenie poprawnego zainstalowania WordPress a. Rysunek 43. Instalacja WordPress a na serwerze krok 5 Po kliknięciu w przycisk Zaloguj się przechodzimy do panelu logowania do systemu WordPress. Panel logowania do WordPress a zainstalowanego na naszej stronie. Rysunek 44. Panel logowania do WordPress a zainstalowanego na naszej stronie. Po zainstalowaniu WordPress a korzystając z opcji Gotowa strona jak i Hosting z dostępem FTP przechodzimy do panelu logowania do systemu WordPress w celu personalizacji naszej strony internetowej. Aby zalogować się do panelu administracyjnego WordPress a musimy podać Nazwę użytkownika i Hasło, a następnie klikamy przycisk Zaloguj się.

31 [30/31] Panel administracyjny Rysunek 45. Panel administracyjny Po zalogowaniu pojawia się panel administracyjny. Klikając na odpowiednie przyciski mamy możliwość zarządzania naszą witryną. Jak utworzyć stronę internetową w WordPress ie opisaliśmy w materiale Utwórz własną stronę internetową z wykorzystaniem oprogramowania WordPress.