Kompleksowy przewodnik po zautomatyzowanym tworzeniu stron internetowych za pomocą PHP w roku 2023

Są takie momenty w życiu, kiedy potrzebujesz strony internetowej, aby zrobić coś więcej niż tylko siedzieć i być stroną internetową. Potrzebujesz go, żeby zarobić na utrzymanie. Jednym ze sposobów na osiągnięcie tego jest uruchomienie go samodzielnie, dzięki czemu nie będziesz musiał ręcznie kodować każdej aktualizacji lub modyfikacji strony. Najprościej nauczyć się czegoś takiego, robiąc to faktycznie, więc w dalszej części tego artykułu pokażę jeden ze sposobów wdrożenia systemu, który będzie tworzył dla Ciebie nowe strony internetowe za dotknięciem przycisk.

W tym scenariuszu założymy, że Twoim klientem jest restauracja, która chce oferować bony na różne specjalne okazje przez cały rok. Ale oczywiście nie chcą ci płacić za aktualizację za nich, więc lepiej upewnij się, że wystawisz im wystarczające rachunki za ten system automatyzacji, który wykona aktualizacje za nich

1. Najpierw musimy stworzyć podstawowy szablon strony internetowej.

To jest po prostu standardowy szkielet strony internetowej. Możesz nadać mu nazwę taką jak „pageBuilder.php” lub coś takiego. Nie musisz używać do tego PHP. Możesz użyć innego języka programowania, ale w tym przykładzie zachowamy prostotę i zrobimy wszystko w PHP.

2. Dodaj Bootstrap

Pomoże to poprawić wygląd formularza bez dodatkowej pracy. Oczywiście, aby to zadziałało, musisz mieć Bootstrap.

3. Ustaw kontener

Aby wszystko było schludne i uporządkowane, powinniśmy zdefiniować kontener, w którym będziemy przechowywać zawartość strony.

4. Utwórz formularz internetowy

Zdefiniuj formularz internetowy, a my dodamy również fantazyjny tytuł do formularza, który jest opcjonalny, ale dobry pomysł.

5. Dodaj pola formularza

To jest naprawdę proste. Musimy tylko zebrać kilka podstawowych szczegółów, które robot wykorzysta do stworzenia nowej strony internetowej. Dane, które musimy znać, obejmują:

• Obraz tła strony
• Nazwa obchodzonego wydarzenia
• Nagłówek
• Oświadczenie otwierające
• Jakiś banalny cytat lub dodatkowe stwierdzenie
• Uznanie autorstwa za banalny cytat
• Styl czcionki do użycia dla każdego z czterech elementów tekstu obramowania (w formaciedivipodwójnie).
• Zakres dat, w którym vouchery będą ważne
• Oferta 1 i Oferta 2, które będą reklamowane na kuponach.
• Dodatkowe wiadomości dotyczące kuponów (na przykład warunki)
• Dane do kodów QR vouchera, które zostaną wygenerowane

Oto jak to wygląda:

Po całym tym wysiłku otrzymamy stronę wyglądającą mniej więcej tak:

 

Dobra wiadomość jest taka, że ​​połowa zadania została już ukończona i była to najtrudniejsza i najbardziej czasochłonna połowa. Reszta jest dużo łatwiejsza.

6. Utwórz plik procesora formularzy

Po utworzeniu formularza potrzebujesz oprogramowania, które przetworzy przesłane dane i coś z nimi zrobi. W takim przypadku użyjemy przesłanych danych do wygenerowania nowego HTML strona.

Należy pamiętać, że nie jest to to samo, co zwykła odpowiedź PHP, w której dane są wykorzystywane w czasie rzeczywistym i dynamicznie odzwierciedlane użytkownikowi. Zamiast tego tworzymy stronę statyczną, która będzie istnieć trwale, dopóki jej nie nadpiszemy.

Plik musi mieć taką samą nazwę jak plik akcja wartość atrybutu w deklaracji formularza, więc w naszym przykładzie byłoby to voucherGen.php, a ponieważ nie określiliśmy ścieżki, musiałaby być przechowywana w tym samym miejscu co pageBuilder.php żeby zadziałało.

7. Zainicjuj zmienne

Dane przesłane z pageBuilder.php została zwrócona jako tablica asocjacyjna o nazwie $ _ POST, a dostęp do wszystkich wartości danych w tablicy można uzyskać poprzez kontrolkę formularza HTML Nazwa atrybuty. Dlatego inicjowanie naszych zmiennych jest w rzeczywistości całkiem łatwe. Jest to również opcjonalne, ale sprawia, że ​​kod wygląda na bardziej uporządkowany i łatwiejszy do odczytania. Z pewnością możesz pracować bezpośrednio z $ _ POST wartości, jeśli wolisz.

 8. Użyj warunków, aby zmienić czcionki na prawidłowe wartości

Wykonanie tej czynności wcześniej pozwoli zaoszczędzić czas i kłopoty później. Po prostu sprawdzamy, które wartości zostały wybrane, a następnie zastępujemy je rzeczywistymi nazwami czcionek.

9. Rozpocznij budowanie łańcucha generatora

Tak naprawdę wszystko, co musimy tutaj zrobić, to utworzyć jeden naprawdę długi ciąg znaków, który będzie zawierał wszystko, co jest potrzebne do utworzenia nowej strony. Zastosujemy łączenie ciągów, aby zachować czytelność i ułatwić sprawdzenie, gdzie wstawiono wartości danych. Zaczyna się od podstawowej konfiguracji strony HTML:

Prawdopodobnie widać, dokąd w tym zmierzamy. Zwróć uwagę na średnik na końcu. To jest ważne. Również wszelkie średniki występujące w tekście (jako część deklaracji CSS lub skryptu po stronie klienta) muszą być ujęte w cudzysłów.

10. Rozpocznij dodawanie treści strony do ciągu generatora

Istnieją bardziej wydajne sposoby budowania tego ciągu, ale lubię porządkować kod, aby był łatwy do odczytania. Można do tego użyć metod skróconych i nie trzeba tego robić jako osobnego procesu względem kroku 9. Uważam, że łatwiej jest zrozumieć, kiedy różne sekcje strony są podzielone w ten sposób.

11. Zapisz ciąg generatora w formacie HTML

W tym przypadku kodujemy na stałe nazwę pliku, ale możesz (i prawdopodobnie powinieneś) ustawić to pole w formularzu pageBuilder.

12. Dodaj link testowy

Kiedy klikniesz przycisk ZBUDUJ IT, ponieważ nie przekierowuje on do strony internetowej jak zwykły program PHP, musisz dodać link lub coś, co umożliwi przejście i zobaczenie, jaki był wynik.

13. Utwórz niestandardowy plik CSS

W tym pliku możesz przechowywać dodatkowe instrukcje dotyczące stylizacji, ale na razie najważniejsza jest instrukcja stylizacji dla pliku główny div.

14. Utwórz i prześlij plik wrap.png

Aby to działało poprawnie, musisz utworzyć pojedynczy półprzezroczysty obraz pikselowy i nazwać go zawijanie.png następnie prześlij go do ścieżki określonej w pliku custom.css plik.

15. Prześlij odpowiednie obrazy tła i przetestuj program PageBuilder

Będziesz zachwycony, wiedząc, że już prawie skończyliśmy, a tak naprawdę teraz pozostaje tylko przetestowanie i naprawienie wszelkich błędów, które się pojawią. Wybierz ładne, proste obrazy, które nie są zbyt napięte i które nawiązują do specjalnych wydarzeń lub okazji (w naszym przykładzie wybrałem Dzień Matki i Dzień Ojca). Prześlij obrazy do ścieżki, w której przechowujesz obrazy dla swojej witryny. Następnie wypełnij formularz, kliknij przycisk i zobacz co się stanie. Oto przykład formularza z wypełnionymi wszystkimi polami danych.

Co powinno skutkować utworzeniem czegoś podobnego do tego:

Już domyśliliśmy się, że nie będziesz chciał pisać tego wszystkiego od zera, więc możesz pobrać kod źródłowy pageBuilder.php i voucherGen.php w tym zip.

Możesz zastosować tę technikę tworzenia plików HTML jako ciągów znaków, a następnie zapisywania ich do plików w różnych sytuacjach. Uważaj tylko, aby nigdy nie umieszczać czegoś takiego w pętli rekurencyjnej, bo zapełnisz dysk twardy i zawiesisz serwer.