PHP i HTML — zgrany duet

PHP i HTML stanowią zgrany i nierozłączny duet. Nic w tym dziwnego, skoro język PHP powstał właśnie w celu usprawnienia pracy ze stronami internetowymi. Co więcej, spokojnie można zaryzykować stwierdzenie, że duet ten niepodzielnie panuje w całym dzisiejszym internecie.

Dlatego jako aspirujący programista musisz wiedzieć, jak prawidłowo łączyć HTML i PHP, aby twoje przyszłe skrypty były poprawne pod każdym względem.

W tym rozdziale:

  • Tworzenie poprawnych plików PHP
  • Dodawanie kodu PHP do stron internetowych
  • Łączenie kodu PHP i HTML
  • Dołączanie plików zewnętrznych do plików PHP

Tworzenie poprawnych plików PHP

Być może myślisz sobie teraz, że nie ma nic prostszego niż utworzyć zwykły plik tekstowy i nadać mu rozszerzenie php — bo przecież pliki PHP i HTML to zwykłe pliki tekstowe z odpowiednim rozszerzeniem. Jeśli tak uważasz, to jak najbardziej masz rację, ale są dwa małe haczyki.

Przypomnę, że na świecie istnieje wiele systemów operacyjnych, na przykład przeróżne dystrybucje Linuksa, Windows, Mac OS i inne. Każdy z nich ma specyficzne cechy i pod wieloma względami nie są one między sobą kompatybilne.

Jedną z różnic między systemami uniksowymi (takimi jak Linux i Mac OS) a systemem Windows jest sposób oznaczania przejścia do nowego wiersza w plikach tekstowych.

Kiedy użytkownik systemu Windows uruchomi dowolny edytor tekstu, choćby Notatnik, i podczas pisania naciśnie klawisz Enter, to przejdzie do nowego wiersza. W tym samym czasie, choć tego nie widać, w miejscu złamania wiersza edytor wstawi specjalny znak kontrolny zwany CRLF.

Akronim CRLF pochodzi od angielskich słów Carriage Return, Line Feed, które oznaczają „powrót karetki, nowy wiersz”. A mówiąc prościej, oznacza to po prostu standardowe przejście na początek nowego wiersza w edytorze tekstu w systemie Windows.

Kiedy użytkownik systemu Linux uruchomi edytor tekstu, na przykład Vim, i podczas pisania naciśnie klawisz Enter, to też przejdzie do nowego wiersza. Ale, w jego przypadku w miejscu złamania wiersza edytor wstawi znak kontrolny o nazwie LF, czyli Line Feed. Tak jest po prostu przyjęte w systemach Linux.

Po co o tym opowiadam? Ponieważ ta różnica w rzadkich przypadkach może powodować problemy z odczytem plików. Kiedy na przykład utworzysz stronę w Notatniku w systemie Windows i wyślesz ją na serwer WWW działający w systemie Linux, to narażasz się na potencjalne kłopoty, ponieważ programy w każdym z tych systemów spodziewają się innych oznaczeń nowego wiersza.

Dlatego lepiej z góry się zabezpieczyć i zawsze tworzyć pliki z właściwym znakiem końca wiersza, który został przyjęty jako ogólny standard. Dla plików PHP jest to LF.

Jak to zrobić? To bardzo proste, choć w każdym edytorze może wyglądać odrobinę inaczej. Zobaczmy, jak to się robi w Visual Studio Code.

Zmiana na LF w Visual Studio Code

Domyślnie Visual Studio Code w systemie Windows stosuje znak końca wiersza CRLF, co widać w prawym dolnym rogu jego okna głównego po otwarciu dowolnego pliku tekstowego.

kod php w html Visual Studio Code CRLF

Aby zmienić ten znak na LF, wystarczy kliknąć zaznaczony na powyższym zrzucie ekranu napis CRLF. Spowoduje to pojawienie się u góry okienka, w którym można wybrać między dwoma omawianymi znakami. Spójrz na poniższą ilustrację.

html i php Okienko wyboru znaku LF i CRLF w Visual Studio Code

Kiedy klikniesz pozycję LF, edytor odpowiednio przekonwertuje bieżący plik i po sprawie. Na tym jednak nie koniec. Ta operacja spowoduje tylko przekonwertowanie bieżącego pliku. Każdy kolejny, który utworzysz w tym edytorze, znów będzie miał domyślny znak końca wiersza CRLF. Aby załatwić to raz na zawsze, należy zmienić ustawienie domyślne Visual Studio Code.

Zmiana domyślnego znaku końca wiersza w Visual Studio Code

Aby zmienić domyślny znak nowego wiersza w edytorze Visual Studio Code, najprościej jest nacisnąć kombinację klawiszy Ctrl + , w celu otwarcia karty Ustawienia. W jej górnej części znajduje się pole wyszukiwania. Wpisz w nim eol (od angielskich słów end of line oznaczających „koniec wiersza”).

Pojawi się okno z wynikami wyszukiwania, w którym znajdziesz listę rozwijaną o nazwie Domyślny znak końca wiersza.

php i html - okno programu Visual Studio Code z domyślnym ustawieniem znaku końca wiersza

Rozwiń tę listę i wybierz pozycję \n. Jest to standardowy sposób zapisu znaku nowego wiersza, którego używa się także bezpośrednio w tekście programów.

W dalszej części kursu jeszcze będziemy wracać do tego tematu, więc na razie tylko zapamiętaj, że oznacza on po prostu nowy wiersz, czyli LF (zresztą po najechaniu na opcję \n w edytorze pojawia się informacja, że jest to znak LF).

PJeśli używasz innego edytora kodu, na przykład Notepad++ albo Dreamweaver, to poszukaj odpowiednich informacji na własną rękę.

Skoro już wiesz, jak utworzyć poprawny plik PHP, usuń i utwórz nowy lub przekonwertuj plik index.php, który utworzyłeś w poprzednim rozdziale. Dla przypomnienia, na razie zawiera on tylko poniższy kod:


  <?php
  
  echo "Witaj, świecie!";

Teraz przejdziemy do metod dodawania skryptów PHP do plików PHP. Jedną, i najważniejszą, częściowo już znasz, bo jest zastosowana w powyższym kodzie.

Dodawanie skryptów PHP do stron

Skrypty PHP do stron internetowych można dodawać na kilka sposobów, choć nie znaczy to, że ze wszystkich należy korzystać. Standardowa i najczęściej stosowana metoda została już częściowo zaprezentowana w poprzednim rozdziale i powyżej. Teraz przyjrzymy się jej dokładniej.

Standardowe znaczniki PHP

Standardowe znaczniki PHP (albo tagi PHP) służące do wstawiania skryptów PHP na strony internetowe mają następującą postać:


  <?php
      // Kod PHP
  ?>

Są to tak zwane znaczniki PHP w stylu XML, ponieważ są one zgodne z wymogami języka XML. Status standardu zyskały, kiedy u szczytu popularności był język XHTML, który wymagał, aby zawartość stron internetowych była zgodna ze ścisłymi wymogami standardu XML.

Pierwszy znacznik, <?php, oznacza początek sekcji kodu PHP w pliku, a drugi, ?>, jej koniec. Między nimi można wpisać kod PHP.

Takie są podstawowe zasady dołączania kodu PHP do stron internetowych, ale należy pamiętać jeszcze o dwóch szczegółach:

  • Każdy plik PHP powinien kończyć się niepustym wierszem, zakończonym pojedynczym znakiem LF.
  • Jeśli plik zawiera tylko kod PHP, to nie należy na końcu dodawać znacznika ?>.

Pierwszy wymóg nie wymaga specjalnego komentarza. Chodzi po prostu o to, aby na końcu pliku PHP nie umieszczać tabulatorów, spacji, kilku pustych wierszy itd.

Drugi wymóg z kolei wynika z tego, że jeśli plik zawiera wyłącznie kod PHP, to pominięcie znacznika zamykającego uniemożliwi przypadkowe wysłanie do przeglądarki białych znaków jako danych HTML przed przekazaniem jej nagłówków HTTP strony, co może spowodować różne błędy.

O nagłówkach HTTP i tym podobnych sprawach będzie jeszcze mowa przy okazji omawiania obsługi formularzy HTML w PHP. Na razie zapamiętaj tylko, że jeśli plik zawiera wyłącznie kod PHP, to lepiej nie kończyć go znacznikiem zamykającym ?>.

Choć obie opisane powyżej zasady są tylko zaleceniami, to warto ich przestrzegać, ponieważ są standardem honorowanym przez całą społeczność programistów PHP.

Oprócz opisanych znaczników PHP, które zostały przyjęte jako standard i których nie da się wyłączyć, istnieje kilka innych typów. Warto je znać na wypadek, gdybyś się natknął na któryś z nich, ale lepiej ich nie stosować. Dlaczego? Zaraz się dowiesz.

Krótkie znaczniki PHP

Krótkie znaczniki PHP są podobne do wersji zgodnej z XML, tylko nie zawierają członu php w znaczniku otwierającym:


  <?
      // Kod PHP
  ?>

Te tagi PHP, albo inaczej krótkie znaczniki PHP, mają składnię w stylu języka SGML.

Lepiej ich unikać, ponieważ mogą zostać wyłączone w pliku php.ini za pomocą opcji short_open_tag (przez nadanie jej wartości Offshort_open_tag = Off). Wprawdzie domyślnie ta opcja jest włączona, ale nigdy nie ma pewności, czy ktoś jej nie wyłączy.

Znacznik echo

Ten znacznik otwierający PHP stanowi skrótową formę zapisu <?php echo. Czyli można go używać w przypadku, gdy pierwszą instrukcją w skrypcie ma być właśnie echo. Dalej można pisać normalny kod PHP. Na przykład:


  <?= "Witaj, świecie";

Ten kod jest równoważny z poniższym:


  <?php
      echo "Witaj, świecie";

Znacznika <?= można bez obaw używać we wszystkich skryptach, ponieważ nie da się go wyłączyć, co oznacza, że zawsze jest dostępny.

Znaczniki PHP w stylu ASP

Tagi PHP w stylu ASP (ang. Active Server Pages — jest to przestarzała technologia serwerowa Microsoftu) mają postać <% %>.

Są niedostępne od PHP 7, ale można je spotkać w starym kodzie, więc na wszelki wypadek warto wiedzieć o ich istnieniu.

Element HTML script

Kiedyś skrypty PHP można też było dodawać do stron za pomocą elementu script z atrybutem language, np.:


  <script language="php">
      // Kod PHP
  </script>

Ze względu na ilość znaków do wpisania nigdy nie były często używane, aż w końcu w PHP 7 całkowicie z nich zrezygnowano. Dobrze jest o nich wiedzieć tylko ze względów historycznych — może kiedyś, jakimś cudem, spotkasz je w starym kodzie PHP.

Jak widzisz, jest sporo znaczników PHP, ale praktycznie zastosowanie mają tylko dwa rodzaje. Skoro już umiesz dodawać skrypty PHP do plików, to teraz pokażę ci, jak mieszać je z kodem HTML.

Mieszanie HTML i PHP

Umiesz już utworzyć prawidłowy plik PHP oraz poprawnie dodać do niego skrypt PHP. Czasami rzeczywiście tworzy się pliki zawierające wyłącznie kod PHP, takie jak pokazywałem do tej pory, ale jeszcze częściej kod stosuje się kod PHP w HTML, czyli miesza się go bezpośrednio ze znacznikami HTML.

Do pokazania przykładów w tym przypadku potrzebny jest dokument zawierający kod HTML. Jeśli używasz edytora Visual Studio Code, to podstawową strukturę dokumentu HTML w łatwy sposób wygenerujesz dzięki standardowo zainstalowanemu w nim rozszerzeniu Emmet.

Przejdź do pliku index.php w edytorze i usuń całą jego zawartość. Następnie wpisz znak wykrzyknika. Kiedy to zrobisz, pojawi się menu z dwiema pozycjami: ! i !!!. Jego pojawienie się jest zasługą właśnie rozszerzenia Emmet.

html i php tagi php interfejs emmet

Naciśnij klawisz Enter, aby wybrać opcję z jednym wykrzyknikiem. Spowoduje to wstawienie do dokumentu kompletnego szkieletu HTML strony internetowej, który jest pokazany poniżej (zmieniłem tylko język en na pl i tytuł dokumentu na Dokument, ponieważ nasza strona będzie w języku polskim).


  <!DOCTYPE html>
  <html lang="pl">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Dokument</title>
  </head>
  <body>
    
  </body>
  </html>
  
  
  
  <body>

Zakładam, że znasz już podstawy HTML, więc nie tłumaczę tego kodu. Jeśli jednak masz problem ze zrozumieniem czegoś, to przeczytaj rozdział o podstawowej strukturze dokumentu HTML w Kursie HTML i CSS dla początkujących.

Jak wiadomo każda strona internetowa powinna mieć tytuł w nagłówku h1, np.:


  <body>
    <h1>Tytuł strony</h1>
  </body>

Gdybyśmy nie chcieli wpisywać tego tytułu bezpośrednio, tylko pobierać go przykładowo z bazy danych, to w elemencie h1 zamiast zwykłego tekstu użylibyśmy odpowiedniego skryptu PHP. Na przykład:


  <body>
    <h1><?php echo "Tytuł strony"; ?></h1>
  </body>

Skopiuj lub przepisz ten element elemencie h1 do swojej strony w edytorze Visual Studio Code i sprawdź efekt w przeglądarce.

Na stronie powinien pojawić się duży napis Tytuł strony. Jeśli tak się stało, to znaczy, że wszystko zrobiłeś prawidłowo. Gratulacje!

Ten skrypt oczywiście nie pobiera niczego z bazy danych ani z żadnego innego zewnętrznego źródła, ale wyobraź sobie, że tak właśnie jest. Chodzi tylko o ilustrację tego, jak łączyć kod HTML i PHP.

Tutaj do zapamiętania jest tylko jedna ważna rzecz: w takich przypadkach zamykający znacznik PHP jest obowiązkowy.

Nie ma natomiast obowiązku stawiać średnika na końcu instrukcji echo. Dlaczego? I czym w ogóle jest instrukcja echo? Poza tym, co to za dziwna struktura // widoczna w niektórych przykładach i pomijana złowieszczą ciszą?

Odpowiedzi na te pytania i na parę innych znajdziesz w następnym rozdziale. Zanim jednak do niego przejdziesz, zachęcam Cię, abyś przeczytał podsumowanie, odpowiedział na pytania i wykonał ćwiczenia. Jak zawsze są łatwe i przyjemne.

Podsumowanie

Tygrys podsumowania
  1. Pliki PHP to pliki tekstowe z rozszerzeniem php.
  2. W plikach PHP należy stosować znak złamania wiersza LF.
  3. Domyślnie edytory działające w systemie Windows zwykle stosują znaki CRLF.
  4. W Visual Studio Code znak złamania wiersza można zmienić dla bieżącego pliku jak również domyślnie dla wszystkich nowo tworzonych plików.
  5. Istnieje kilka rodzajów znaczników PHP (tagów PHP) do wstawiania skryptów PHP do plików.
  6. Używać się powinno tylko dwóch typów znaczników PHP: <?php … ?> i <?= … ?>.
  7. Pozostałe znaczniki PHP (tagi PHP) są niepewne (mogą być wyłączone w pliku php.ini) lub są przestarzałe i już wyszły z użycia.
  8. Jeśli plik zawiera tylko kod PHP, to powinien kończyć się niepustym wierszem zakończonym jednym znakiem LF i nie powinien zawierać znacznika zamykającego ?>.
  9. Kod PHP i HTML można przeplatać.
  10. Kiedy kod HTML i PHP są przeplatane, obowiązkowo należy użyć otwierającego i zamykającego tagu PHP.


Rozmawiający mężczyźni

Pytania

  1. Jakim rodzajem pliku są pliki PHP?
  2. Jaki znak złamania wiersza należy stosować w plikach PHP?
  3. Jak ustawić domyślny znak złamania wiersza dla wszystkich plików tworzonych w edytorze Visual Studio Code?
  4. Jakich znaczników PHP należy używać do wstawiania kodu PHP do plików?
  5. Co powinno znajdować się na końcu pliku PHP zawierającego tylko kod PHP?
  6. Jakie kodowanie znaków powinno się stosować w plikach PHP?
  7. Czy można wplatać kod PHP między znaczniki HTML?
  8. O czym trzeba pamiętać, kiedy wplata się kod PHP między znaczniki HTML?


Ćwiczące dzieci

Ćwiczenia

  1. W swoim projekcie w Visual Studio Code utwórz nowy plik PHP o dowolnej nazwie i sprawdź, jakie ma znaki końca wiersza. Jeśli niewłaściwe, to wprowadź w edytorze odpowiednie ustawienia, aby domyślnie tworzył prawidłowe pliki.
  2. Użyj w nowo utworzonym pliku którejś z przestarzałych metod wstawiania kodu PHP i sprawdź, co się stanie.

Podobał Ci się ten artykuł?

Oceń go!

Średnia 5 / 5. Liczba głosów: 1

Jeszcze nikt nie głosował. Wyprzedź innych i zagłosuj.

Skoro spodobał Ci się ten artykuł...

Poleć go znajomym!

Ojej :( Powiedz nam, co powinniśmy poprawić!

Jajko z dzwonkiem
Podoba Ci się ta strona?

Pomóż nam się rozwijać, wykupując płatne konto. Dzięki temu będziemy mogli tworzyć dla Ciebie jeszcze więcej ciekawych treści, a Ty pozbędziesz się reklam.

Autor: Łukasz Piwko

Dodaj komentarz

1 × pięć =