Automatisk oppretting av websider med PHP

Det er visse tider i livet når du trenger en webside for å gjøre noe mer enn bare å sitte der og være en webside. Du trenger det for å tjene penger. En måte å gjøre det på er å sette det i bruk for deg, slik at du ikke trenger å levere kode hver oppdatering eller sidemodus. Den enkleste måten å lære å gjøre noe slikt på er å faktisk gjøre det, så i resten av denne artikkelen skal jeg vise deg en måte å implementere et system som vil bygge nye websider for deg ved å trykke på en knapp.

I dette scenariet antar vi at klienten din er en restaurant som ønsker å tilby bilag til forskjellige spesielle anledninger gjennom året. Men selvfølgelig vil de ikke betale deg for å oppdatere det for dem, så du bør sørge for å fakturere dem tilstrekkelig for dette automatiseringssystemet som gjør oppdateringene for dem

1. Først må vi lage en grunnleggende webside-mal.

Dette er bare et vanlig nettsideskjelett. Du kan gi den et navn som “pageBuilder.php” eller noe. Du trenger ikke bruke PHP til dette. Du kan bruke et annet programmeringsspråk, men for dette eksemplet holder vi ting enkelt og gjør alt i PHP.

Skjermdump på 2016 05-30-1.56.52 AM

2. Legg til Bootstrap

Dette vil bidra til at skjemaet ser bedre ut uten ekstra arbeid. Selvfølgelig må du ha Bootstrap for at dette skal fungere.

Skjermdump på 2016 05-30-1.56.56 AM

3. Sett opp en beholder

For å holde alt pent og ryddig, bør vi definere en beholder som vi lagrer sideinnholdet i.

Skjermdump på 2016 05-30-1.56.48 AM

4. Lag et nettskjema

Definer et nettskjema, så legger vi også til en fancy tittel til skjemaet, som er valgfritt, men en god idé.

Skjermdump på 2016 05-30-1.56.43 AM

5. Legg til skjemafeltene

Dette er veldig enkelt. Vi trenger bare å samle noen få grunnleggende detaljer som roboten vil bruke til å opprette en ny webside. Dataene vi trenger å vite inkluderer:

  • Bakgrunnen for siden
  • Navnet på arrangementet som feires
  • overskrift
  • Åpningserklæring
  • Noen lite sitat eller tilleggsuttalelse
  • Attribusjon for trite quote
  • Skriftstil å bruke for hvert av de fire innrammede tekstelementene (idividualt).
  • Datoperiode som kupongene vil være gyldige for
  • Tilbud 1 og tilbud 2 som vil bli annonsert på bilagene.
  • Ytterligere kupongmeldinger (for eksempel vilkår og betingelser)
  • Data for kupongen QR-koder som vil bli generert

Slik ser det ut:

Skjermdump på 2016 05-30-1.56.00 AM

Skjermdump på 2016 05-30-1.55.54 AM

Skjermdump på 2016 05-30-1.55.36 AM

Og etter all denne innsatsen, vil vi ende opp med en side som ser slik ut:

Skjermdump på 2016 05-30-1.55.22 AM

 

Den gode nyheten er at halvparten av jobben nå er fullført, og det var den vanskeligste og mest tidkrevende halvdelen. Resten er langt lettere.

6. Lag skjemaprosessor-filen

Etter at du har opprettet et skjema, trenger du litt programvare som behandler de innsendte dataene og gjør noe med det. I dette tilfellet bruker vi de innsendte dataene til å generere en ny HTML side.

Husk nå at dette ikke er det samme som et vanlig PHP-svar der dataene brukes i sanntid og reflekteres dynamisk til brukeren. I stedet lager vi en statisk side som vil eksistere permanent til vi overskriver den.

Filen må heter den samme som filen handling attributtverdi i skjemaerklæringen, så i eksempelet vårt vil det være kupongGen.php, og fordi vi ikke spesifiserte en bane, måtte den lagres på samme sted som pageBuilder.php for at det skal fungere.

7. Initialiser variabler

Dataene sendt inn fra pageBuilder.php ble returnert som et assosiativt utvalg som ble kalt $ _ POST, og alle dataverdiene i matrisen kan nås via deres HTML-skjema-kontroll navn attributter. Derfor er det faktisk ganske enkelt å initialisere variablene. Det er også valgfritt, men det gjør bare at koden ser litt mer ryddig og lettere å lese. Du kan absolutt jobbe direkte med $ _ POST verdier hvis du foretrekker det.

Skjermdump på 2016 05-30-1.55.15 AM

 8. Bruk betingelsene til å endre skriftene til de riktige verdiene

Å gjøre dette tidlig vil spare tid og problemer senere. Vi sjekker bare hvilke verdier som ble valgt, og erstatter dem deretter med de faktiske skriftnavnene.

Skjermdump på 2016 05-30-1.55.10 AM9. Begynn med å bygge generatorstrengen

Egentlig alt vi trenger å gjøre her er å lage en veldig lang streng som inneholder alt som kreves for å opprette den nye siden. Vi vil bruke streng sammenføyning for å holde den lesbar og gjøre det enkelt å se hvor dataverdiene er satt inn. Dette starter med den grunnleggende HTML-siden som er satt opp:

Skjermdump på 2016 05-30-1.55.06 AM

Du kan sikkert se hvor vi skal med dette. Legg merke til semikolon på slutten. Det er viktig. Også semikolon som forekommer i teksten (som en del av en CSS-erklæring eller et skript på klientsiden) må være inne i anførselstegn.

10. Begynn å legge sidekroppen til generatorstrengen

Det er mer effektive måter å bygge denne strengen på, men jeg liker å gjøre koden ryddig, slik at den er lett å lese. Du kan bruke korthåndsmetoder for å gjøre dette, og du trenger heller ikke å gjøre det som en egen prosess til trinn 9. Jeg føler det er lettere å forstå når de forskjellige delene av siden er delt på denne måten.

Skjermdump på 2016 05-30-1.55.00 AM

11. Skriv generatorstrengen til en HTML

I dette tilfellet koder vi hardt for filnavnet, men du kan (og sannsynligvis bør) gjøre dette til et felt i din sideBuilder-form.

Skjermdump på 2016 05-30-1.54.55 AM

12. Legg til en testlenke

Når du klikker på BUILD IT-knappen, fordi den ikke viderekobler til en webside som et normalt PHP-program ville gjort, må du legge til en kobling eller noe for å se hva resultatet ble.

Skjermdump på 2016 05-30-1.54.50 AM

13. Lag den tilpassede CSS-filen

Du kan lagre flere stylinginstruksjoner i denne filen, men foreløpig er den eneste viktige stylinginstruksjonen for main div.

Skjermdump på 2016 05-30-1.54.45 AM

14. Opprett og last opp wrap.png

For at dette skal fungere ordentlig, må du lage et enkelt gjennomsiktig pikselbilde og gi det navnet wrap.png last den opp til banen du spesifiserte i custom.css filen.

15. Last opp noen passende bakgrunnsbilder og test sideBuilder

Du vil bli begeistret over å vite at vi nesten er ferdige, og egentlig er det bare å teste og rette opp eventuelle feil som oppstår. Velg noen fine enkle bilder som ikke er for opptatt, og som er egnet til å forholde seg til spesielle arrangementer eller anledninger (i vårt eksempel har jeg gått med morsdag og farsdag). Last opp bildene til banen der du lagrer bildene dine på nettstedet ditt. Fyll deretter ut skjemaet, klikk på knappen og se hva som skjer. Her er et eksempel på skjemaet med alle datafeltene fylt ut.

Picture1

Noe som skulle resultere i å skape noe ganske likt dette:

Skjermdump på 2016 05-30-1.54.11 AM

Vi har allerede gjettet at du ikke vil skrive alt dette fra bunnen av, slik at du kan laste ned kildekoden for pageBuilder.php og voucherGen.php i dette zip-fil.

Du kan bruke denne teknikken for å lage HTML-filer som strenger og deretter skrive dem ut til filer i alle slags situasjoner. Bare vær forsiktig så du ikke legger noe slikt i en rekursiv sløyfe, ellers fyller du harddisken og krasjer serveren.

Catalin Zorzini

Jeg er en webdesignblogger og startet dette prosjektet etter å ha brukt noen uker på å slite med å finne ut hvilket den beste e-handelsplattformen for meg selv. Sjekk ut strømmen min topp 10 e-handel byggherrer.