Automatisierte Webseitenerstellung mit PHP

Es gibt bestimmte Zeiten im Leben, in denen Sie eine Webseite brauchen, um mehr zu tun, als nur eine Webseite zu haben. Sie brauchen es, um seinen Unterhalt zu verdienen. Eine Möglichkeit, dies zu tun, besteht darin, es für Sie zum Laufen zu bringen, so dass Sie nicht jedes Update oder jede Seitenmodifikation manuell codieren müssen. Der einfachste Weg, um zu lernen, wie man so etwas macht, ist, es tatsächlich zu tun. Im Rest dieses Artikels werde ich Ihnen einen Weg zeigen, wie Sie ein System implementieren können, das Ihnen auf Knopfdruck neue Webseiten erstellt ein Knopf.

In diesem Szenario gehen wir davon aus, dass Ihr Kunde ein Restaurant ist, das während des ganzen Jahres Gutscheine für verschiedene besondere Anlässe anbieten möchte. Aber natürlich möchten sie nicht dafür bezahlen, dass sie für sie aktualisiert werden. Sie sollten sie daher ausreichend in Rechnung stellen, damit dieses Automatisierungssystem die Updates für sie durchführen kann

1. Zuerst müssen wir eine grundlegende Webseitenvorlage erstellen.

Dies ist nur ein Standard-Webseiten-Skelett. Sie können ihm einen Namen geben wie "pageBuilder.php" oder so. Sie müssen dafür kein PHP verwenden. Sie können eine andere Programmiersprache verwenden, aber für dieses Beispiel halten wir die Dinge einfach und machen alles in PHP.

Screen Shot bei 2016 05-30-1.56.52 Uhr

2. Füge Bootstrap hinzu

Dies hilft, das Formular ohne zusätzliche Arbeit besser aussehen zu lassen. Natürlich benötigen Sie Bootstrap, damit dies funktioniert.

Screen Shot bei 2016 05-30-1.56.56 Uhr

3. Richten Sie einen Container ein

Um alles sauber und ordentlich zu halten, sollten wir einen Container definieren, in dem die Seiteninhalte gespeichert werden.

Screen Shot bei 2016 05-30-1.56.48 Uhr

4. Erstellen Sie ein Webformular

Definieren Sie ein Webformular, und wir fügen dem Formular auch einen ausgefallenen Titel hinzu, der optional, aber eine gute Idee ist.

Screen Shot bei 2016 05-30-1.56.43 Uhr

5. Fügen Sie die Formularfelder hinzu

Das ist sehr einfach. Wir müssen nur einige grundlegende Details sammeln, die der Roboter zum Erstellen einer neuen Webseite verwenden wird. Zu den Daten, die wir wissen müssen, gehören:

  • Das Hintergrundbild für die Seite
  • Name des gefeierten Ereignisses
  • Schlagzeile
  • Eröffnungsstatement
  • Irgendein banales Zitat oder eine zusätzliche Aussage
  • Namensnennung für trite Zitat
  • Schriftstil für jedes der vier Framing-Textelemente (einzeln).
  • Datumsbereich, für den die Gutscheine gültig sind
  • Angebot 1 und Angebot 2, die auf den Gutscheinen beworben werden.
  • Zusätzliche Gutschein-Nachrichten (z. B. AGB)
  • Daten für die Gutschein-QR-Codes, die generiert werden

So sieht das aus:

Screen Shot bei 2016 05-30-1.56.00 Uhr

Screen Shot bei 2016 05-30-1.55.54 Uhr

Screen Shot bei 2016 05-30-1.55.36 Uhr

Und nach all diesen Bemühungen werden wir mit einer Seite enden, die ungefähr so ​​aussieht:

Screen Shot bei 2016 05-30-1.55.22 Uhr

Die gute Nachricht ist, dass die Hälfte der Arbeit nun abgeschlossen ist und die schwierigste und zeitaufwändigste Hälfte war. Der Rest ist viel einfacher.

6. Erstellen Sie die Formularprozessordatei

Nach dem Erstellen eines Formulars benötigen Sie eine Software, die die übermittelten Daten verarbeitet und damit etwas tut. In diesem Fall verwenden wir die übermittelten Daten, um eine neue zu generieren HTML verifiziert werden.

Denken Sie daran, dass dies nicht dasselbe ist wie eine normale PHP-Antwort, bei der die Daten in Echtzeit verwendet und dynamisch für den Benutzer reflektiert werden. Stattdessen erstellen wir eine statische Seite, die dauerhaft bestehen bleibt, bis wir sie überschreiben.

Die Datei muss genauso wie die Datei benannt werden Aktion Attributwert in der Formular-Deklaration, also in unserem Beispiel wäre das GutscheinGen.phpund weil wir keinen Pfad angegeben haben, müsste er am selben Speicherort wie gespeichert werden pageBuilder.php für sie zu arbeiten.

7. Variablen initialisieren

Die Daten von pageBuilder.php wurde als ein assoziatives Array namens zurückgegeben $ _POSTund auf alle Datenwerte im Array kann über ihre HTML-Formularsteuerung zugegriffen werden Name Attribute. Daher ist das Initialisieren unserer Variablen eigentlich ganz einfach. Es ist auch optional, aber es macht den Code nur ein bisschen aufgeräumter und lesbarer. Sie könnten sicherlich direkt mit dem arbeiten $ _POST Werte, wenn Sie bevorzugen.

Screen Shot bei 2016 05-30-1.55.15 Uhr

8. Verwenden Sie Bedingungen, um die Schriftarten in ihre korrekten Werte zu ändern

Wenn Sie dies früh tun, sparen Sie später Zeit und Ärger. Wir prüfen nur, welche Werte ausgewählt wurden, und ersetzen sie durch die tatsächlichen Namen der Schriftarten.

Screen Shot bei 2016 05-30-1.55.10 Uhr9. Beginnen Sie mit dem Erstellen des Generatorstrings

Wir müssen hier wirklich nur eine wirklich lange Zeichenfolge erstellen, die alles enthält, was zum Erstellen der neuen Seite erforderlich ist. Wir werden die String-Verkettung verwenden, um sie lesbar zu halten und zu erkennen, wo die Datenwerte eingefügt wurden. Dies beginnt mit der Einrichtung der einfachen HTML-Seite:

Screen Shot bei 2016 05-30-1.55.06 Uhr

Sie können wahrscheinlich sehen, wohin wir damit gehen. Beachten Sie das Semikolon am Ende. Das ist wichtig. Auch Semikolons, die innerhalb des Textes (als Teil einer CSS-Deklaration oder eines clientseitigen Skripts) vorkommen, müssen in Anführungszeichen stehen.

10. Beginnen Sie mit dem Hinzufügen des Seitenrumpfs zur Generatorzeichenfolge

Es gibt effizientere Methoden, um diese Zeichenfolge zu erstellen, aber ich mag es, Code aufgeräumt zu machen, damit er leicht zu lesen ist. Sie können hierfür kurze Handmethoden verwenden, und Sie müssen dies auch nicht als separaten Prozess für Schritt 9 durchführen. Ich glaube, es ist einfacher zu verstehen, wenn die verschiedenen Abschnitte der Seite auf diese Weise aufgeteilt werden.

Screen Shot bei 2016 05-30-1.55.00 Uhr

11. Schreiben Sie die Generatorzeichenfolge in einen HTML-Code

In diesem Fall codieren wir den Dateinamen hart, aber Sie könnten (und sollten wahrscheinlich) dies zu einem Feld in Ihrem PageBuilder-Formular machen.

Screen Shot bei 2016 05-30-1.54.55 Uhr

12. Fügen Sie einen Testlink hinzu

Wenn Sie auf die Schaltfläche BUILD IT klicken, weil sie nicht wie ein normales PHP-Programm auf eine Webseite umleitet, müssen Sie einen Link oder etwas hinzufügen, um zu sehen, was das Ergebnis ist.

Screen Shot bei 2016 05-30-1.54.50 Uhr

13. Erstellen Sie die benutzerdefinierte CSS-Datei

Sie können in dieser Datei zusätzliche Styling-Anweisungen speichern, aber für den Moment ist nur die Styling-Anweisung für die Haupt- Div.

Screen Shot bei 2016 05-30-1.54.45 Uhr

14. Erstellen und laden Sie wrap.png hoch

Damit dies ordnungsgemäß funktioniert, müssen Sie ein einzelnes durchscheinendes Pixelbild erstellen und benennen wrap.png Laden Sie es dann auf den Pfad hoch, den Sie in der Liste angegeben haben custom.css Datei.

15. Laden Sie geeignete Hintergrundbilder hoch und testen Sie Ihren PageBuilder

Sie werden begeistert sein, wenn wir wissen, dass wir fast fertig sind. Jetzt müssen Sie nur noch auftretende Fehler testen und beheben. Wählen Sie einige schöne, einfache Bilder, die nicht zu beschäftigt sind und sich auf besondere Ereignisse oder Anlässe beziehen (in unserem Beispiel habe ich den Muttertag und den Vatertag besucht). Laden Sie die Bilder in den Pfad hoch, in dem Sie Ihre Bilder für Ihre Website speichern. Dann füllen Sie das Formular aus, klicken Sie auf die Schaltfläche und sehen Sie, was passiert. Hier ist ein Beispiel für das Formular, in das alle Datenfelder ausgefüllt sind.

Picture1

Daraus sollte etwas Ähnliches entstehen:

Screen Shot bei 2016 05-30-1.54.11 Uhr

Wir haben bereits vermutet, dass Sie das nicht von Grund auf neu eingeben wollen, also können Sie hier den Quellcode für pageBuilder.php und voucherGen.php herunterladen zip-Datei.

Sie können diese Technik anwenden, um HTML-Dateien als Zeichenfolgen zu erstellen und sie dann in allen möglichen Situationen in Dateien zu schreiben. Achten Sie jedoch darauf, dass Sie niemals etwas in eine rekursive Schleife schreiben, da sonst Ihre Festplatte voll wird und der Server abstürzt.

Catalin Zorzini

Ich bin ein Webdesign-Blogger und habe dieses Projekt gestartet, nachdem ich ein paar Wochen damit verbracht habe, herauszufinden, wer das ist die beste E-Commerce-Plattform für mich. Überprüfen Sie meine aktuelle top 10 E-Commerce-Site-Builder.