Share
In questo tutorial per principianti imparerai a creare i tuoi temi ProcessWire CMS. Creeremo un sito super semplice, che copre modelli, campi, struttura a tema e variabili PHP.
Non dimenticare di iniziare subito seguendo il primo dei nostri tutorial Come installare e configurare ProcessWire CMS.
A differenza di altri CMS come WordPress, ProcessWire non ha un processo di selezione del tema come parte del suo admin, in cui è possibile cambiare temi premendo un pulsante ben etichettato. Tuttavia, questa non è necessariamente una brutta cosa. ProcessWire ha un proprio sistema: la cartella "site / templates" che contiene tutti i file associati al tema.
Il modo migliore per creare un tema vuoto è selezionare il sito a bruciapelo profilo durante l'installazione di ProcessWire (PW). Site-blank contiene la struttura del sito più basilare all'interno della cartella "site / templates", che include cartelle e file
Puoi creare una nuova cartella "site / templates" con i tuoi file dopo l'installazione, se lo desideri, invece di iniziare con il profilo del sito, ma assicurati di avere almeno i file sopra elencati.
Imparare come PW instrada le sue pagine ci aiuterà a costruire i nostri modelli personalizzati in seguito.
Quando viene richiesta una pagina PW (ad es. Www.benbyford.com/about), PW controlla la pagina all'interno del CMS e verifica quale modello è stato assegnato; in questo caso ho assegnato il template "basic-page"; il file "basic-page.php" all'interno del "sito / templates /" viene reso e l'HTML richiesto inviato all'utente (PW consente anche un facile utilizzo di altri formati come JSON o XML).
Mancia: per impostazione predefinita, i modelli vengono definiti all'interno di PW con lo stesso nome del relativo file modello PHP, tuttavia è possibile modificare il nome del modello e il file associato in qualsiasi momento dopo la creazione all'interno dell'amministratore PW.
Per un esempio, aggiungiamo HTML e PHP al nostro file "home.php":
<?php echo $page->titolo; ?> titolo; ?>
Ora vai all'URL del tuo sito nel browser e nota il titolo e h1 dovrebbe ora essere riempito con il titolo della tua homepage (per impostazione predefinita: Casa).
Creare molti file di template con HTML molto simile non è molto efficiente, quindi facciamo un paio di file PHP .inc che possono essere inclusi in ogni modello. Un modello di struttura comune all'interno di theming è quello di creare file "head.inc" e "foot.inc" che sono usati per costruire codice HTML comune come il nostro , navigazione, logo, footer e script.
Modifichiamo nuovamente il file "home.php" per implementare quanto sopra:
titolo; ?>
Aggiungi il nostro head.inc:
<?php echo $page->titolo; ?>
E foot.inc:
Perché usare il tipo di file .inc che sento chiedere? Bene, quando si aggiunge un nuovo modello nell'amministratore di PW, il sistema esamina il sito / templates / cartella per ogni nuovo file .php che non è ancora stato utilizzato da un modello. Usando il tipo di file .inc invece di .php non ti confonderai tra i file di modello e i file che desideri includere nel tuo modello.
Puoi creare tutti i modelli che desideri per le pagine del tuo sito PW, impazzire! Ad esempio, creiamo un nuovo modello per una nuova pagina chiamata "Contatto". Inizio da:
Il CMS ora conosce il tuo nuovo file modello e verrà ora visualizzato come opzione modello durante la creazione di una nuova pagina. Prova a creare una nuova pagina sotto casa tuapagina, chiamalo "Contatto" e seleziona il nostro nuovo modello di pagina di contatto. Ora hai almeno due modelli attivi nel tuo sito: "home" e “contact-pagina”.
Stupefacente! Ora sappiamo come creare file modello, aggiungerli a PW e creare pagine con i nostri nuovi modelli.
Infine, vogliamo sapere come rendere il contenuto aggiunto all'amministratore PW all'interno dei nostri modelli e persino utilizzare vanilla PHP sul nostro sito. Una delle cose che preferisco di PW è che fornisce al programmatore del tema l'accesso immediato al contenuto tramite variabili e una suite di funzioni utili per la più semplice funzionalità. Qualunque cosa non abbia, puoi scrivere in PHP te stesso senza preoccuparti di cosa il sistema potrebbe fare con il tuo codice. Né devi seguire rigide strutture di classe o ganci (ti sto guardando Drupal). In altre parole: ti dà una serie di strumenti, quindi ti toglie di mezzo.
Per un elenco riepilogativo di tutte le variabili e funzioni all'interno di PW, consultare il Cheatsheet API Processwire e per ulteriori spiegazioni consultare la documentazione PW variabile.
Esaminiamo rapidamente alcune delle principali variabili per rendere i nostri modelli più funzionali.
Modificando nuovamente il nostro home.php, aggiungiamo il titolo della pagina, il corpo e il contenuto della barra laterale usando $ page variabile. $ pageti dà accesso a tutti i contenuti caricati su quella pagina all'interno dell'amministratore PW.
". $ page-> title.""; // corpo di uscita copia echo $ page-> body;?>barra laterale; ?>
Aggiungiamo anche una semplice navigazione al nostro head.inc usando il $ pagine variabile. $ pagine ti dà accesso ad altre pagine con il tuo sito, che puoi quindi richiedere per il contenuto.
<?php echo $page->titolo; ?>
Ora conoscete alcune delle nozioni di base sulla tematizzazione in PW. Vi esorto a esaminare alcuni degli altri profili del sito contenuti nel download PW per vedere come sono strutturati. Secondo me, anche sperimentare e ricevere feedback dalla comunità può essere di grande beneficio.
Mancia: troverai molti moduli che possono aiutarti a costruire il tuo sito nella pagina dei moduli. Se sei un amante di MENO e la minzione degli script, ti consiglio il modulo AIOM.
E, naturalmente, fai attenzione ai tutorial futuri qui su Envato Tuts+.
Accentsconagua