Creazione automatica di pagine Web con PHP

Ci sono alcuni momenti nella vita in cui hai bisogno di una pagina web per fare qualcosa di più che limitarti a stare seduto su una pagina web. Ne hai bisogno per guadagnare il suo sostegno. Un modo per farlo è metterlo a posto per te, quindi non dovrai digitare il codice di ogni aggiornamento o mod di pagina. Il modo più semplice per imparare a fare qualcosa di simile è farlo effettivamente, quindi nel resto di questo articolo, ti mostrerò un modo per implementare un sistema che costruirà nuove pagine web per te al tocco di un bottone.

In questo scenario, assumeremo che il tuo cliente sia un ristorante che desidera offrire buoni per diverse occasioni speciali durante tutto l'anno. Ma ovviamente non vogliono pagarti per aggiornarlo per loro, quindi faresti meglio ad assicurarti di fatturarli a sufficienza per questo sistema di automazione che farà gli aggiornamenti per loro

1. Per prima cosa dobbiamo creare un modello di pagina web di base.

Questo è solo uno scheletro di una pagina web standard. Puoi dargli un nome come "pageBuilder.php" o qualcosa del genere. Non devi usare PHP per questo. Potresti usare un altro linguaggio di programmazione, ma per questo esempio manterremo le cose semplici e faremo tutto in PHP.

Screen Shot in 2016 05-30-1.56.52 AM

2. Aggiungi Bootstrap

Ciò contribuirà a migliorare la forma senza alcun lavoro aggiuntivo. Ovviamente dovrai fare in modo che Bootstrap funzioni correttamente.

Screen Shot in 2016 05-30-1.56.56 AM

3. Configura un contenitore

Per mantenere tutto pulito e in ordine, dovremmo definire un contenitore in cui archiviamo i contenuti della pagina.

Screen Shot in 2016 05-30-1.56.48 AM

4. Crea un modulo web

Definire un modulo Web e aggiungeremo anche un titolo di fantasia al modulo, che è opzionale ma una buona idea.

Screen Shot in 2016 05-30-1.56.43 AM

5. Aggiungi i campi del modulo

Questo è veramente semplice Abbiamo solo bisogno di raccogliere alcuni dettagli di base che il robot utilizzerà per creare una nuova pagina web. I dati che dobbiamo sapere includono:

  • L'immagine di sfondo per la pagina
  • Nome dell'evento celebrato
  • Titolo
  • Dichiarazione di apertura
  • Qualche citazione banale o dichiarazione aggiuntiva
  • Attribuzione per citazione trite
  • Stile del carattere da utilizzare per ciascuno dei quattro elementi del testo di framing (singolarmente).
  • Intervallo di date per cui i buoni saranno validi
  • Offri 1 e offri 2 che verrà pubblicizzato sui buoni.
  • Messaggi di giustificativi aggiuntivi (termini e condizioni, ad esempio)
  • Dati per i codici QR voucher che verranno generati

Ecco come appare:

Screen Shot in 2016 05-30-1.56.00 AM

Screen Shot in 2016 05-30-1.55.54 AM

Screen Shot in 2016 05-30-1.55.36 AM

E dopo tutto questo sforzo, finiremo con una pagina che assomiglia a qualcosa del genere:

Screen Shot in 2016 05-30-1.55.22 AM

La buona notizia è che metà del lavoro è ora completo ed è stata la metà più difficile e dispendiosa in termini di tempo. Il resto è molto più facile.

6. Creare il file del processore di forma

Dopo aver creato un modulo, è necessario un software che elaborerà i dati inviati e farà qualcosa con esso. In questo caso, utilizzeremo i dati inviati per generare un nuovo HTML pagina.

Ora, tieni presente che non è la stessa cosa di una normale risposta PHP in cui i dati vengono utilizzati in tempo reale e si riflettono sull'utente in modo dinamico. Invece, stiamo creando una pagina statica che sarà permanentemente esistente fino a quando non la sovrascriveremo.

Il file deve essere nominato come il azione valore dell'attributo nella dichiarazione del modulo, quindi nel nostro esempio sarebbe voucherGen.phpe poiché non abbiamo specificato un percorso, dovrebbe essere archiviato nella stessa posizione di pageBuilder.php per farlo funzionare.

7. Inizializza le variabili

I dati inviati da pageBuilder.php è stato restituito come un array associativo chiamato $ _POSTe tutti i valori dei dati nella matrice sono accessibili tramite il loro controllo di modulo HTML Nome attributi. Pertanto, l'inizializzazione delle nostre variabili è in realtà abbastanza semplice. È anche opzionale, ma rende il codice un po 'più ordinato e facile da leggere. Potresti certamente lavorare direttamente con $ _POST valori se preferisci.

Screen Shot in 2016 05-30-1.55.15 AM

8. Usa condizionali per cambiare i caratteri ai loro valori corretti

Fare questo presto farà risparmiare tempo e problemi in seguito. Controlliamo solo quali valori sono stati selezionati e quindi li sostituiamo con i nomi dei font effettivi.

Screen Shot in 2016 05-30-1.55.10 AM9. Iniziare la costruzione della stringa del generatore

In realtà tutto ciò che dobbiamo fare qui è creare una stringa veramente lunga che conterrà tutto il necessario per creare la nuova pagina. Useremo la concatenazione di stringhe per tenerlo leggibile e per rendere più facile vedere dove sono stati inseriti i valori dei dati. Questo inizia con la pagina HTML di base impostata:

Screen Shot in 2016 05-30-1.55.06 AM

Probabilmente puoi vedere dove stiamo andando con questo. Nota il punto e virgola alla fine. È importante. Anche eventuali punti e virgola che si verificano all'interno del testo (come parte di una dichiarazione CSS o di uno script lato client) devono essere contenuti all'interno di virgolette.

10. Inizia ad aggiungere il corpo della pagina alla stringa del generatore

Esistono modi più efficienti per creare questa stringa, ma mi piace rendere il codice ordinato, in modo che sia facile da leggere. È possibile utilizzare i metodi a mano corta per fare ciò, e non è necessario farlo come processo separato per eseguire 9. Sento che è più facile capire quando le diverse sezioni della pagina sono divise in questo modo.

Screen Shot in 2016 05-30-1.55.00 AM

11. Scrivi la stringa del generatore su un HTML

In questo caso stiamo codificando a fondo il nome del file, ma potresti (e probabilmente dovresti) rendere questo campo un campo nella forma della tua pagina.

Screen Shot in 2016 05-30-1.54.55 AM

12. Aggiungi un link di prova

Quando fai clic sul pulsante BUILD IT, perché non reindirizza a una pagina Web come farebbe un normale programma PHP, devi aggiungere un link o qualcosa da fare per vedere quale sia stato il risultato.

Screen Shot in 2016 05-30-1.54.50 AM

13. Crea il file CSS personalizzato

È possibile memorizzare ulteriori istruzioni per lo styling in questo file, ma per ora l'unica importante è l'istruzione di stile per principale div

Screen Shot in 2016 05-30-1.54.45 AM

14. Crea e carica wrap.png

Affinché funzioni correttamente, è necessario creare una singola immagine pixel traslucida e nominarla wrap.png quindi caricarlo sul percorso specificato in custom.css file.

15. Carica alcune immagini di sfondo adatte e metti alla prova la tua pagina

Sarai felice di sapere che abbiamo quasi finito, e in realtà è solo questione di testare e correggere eventuali errori che si verificano. Scegli alcune belle immagini semplici che non sono troppo impegnate e che sono adatte a relazionarsi con eventi speciali o occasioni (nel nostro esempio, sono andato con la festa della mamma e la festa del papà). Carica le immagini sul percorso in cui memorizzi le immagini per il tuo sito web. Quindi compilare il modulo, fare clic sul pulsante e vedere cosa succede. Ecco un esempio del modulo con tutti i campi dati compilati.

Picture1

Il che dovrebbe portare alla creazione di qualcosa del tutto simile a questo:

Screen Shot in 2016 05-30-1.54.11 AM

Abbiamo già indovinato che non avresti voluto digitare tutto da zero, quindi puoi scaricare il codice sorgente per pageBuilder.php e voucherGen.php in questo file zip.

È possibile applicare questa tecnica per creare file HTML come stringhe e quindi scriverli su file in tutti i tipi di situazioni. Fai solo attenzione a non mettere qualcosa di simile in un ciclo ricorsivo o riempirai il tuo disco rigido e manderai in crash il server.

Catalin Zorzini

Sono un blogger di web design e ho iniziato questo progetto dopo aver trascorso alcune settimane cercando di capire quale sia la migliore piattaforma di e-commerce per me. Controlla la mia corrente i migliori costruttori di siti di e-commerce 10.