Come creare un tema personalizzato per il tuo sito HTML5 e CSS3 con un WebsiteBaker Prebuilt Temple - dummies

Sebbene sia possibile creare un modello WebsiteBaker da zero per il tuo sito Web HTML5 e CSS3, in genere non è una buona idea. È molto più intelligente iniziare con un modello che è vicino e aggiungere quelle caratteristiche necessarie per renderlo tuo. In questo modo la struttura generale è già provata e devi solo personalizzarla secondo le tue specifiche.

1. Trova un modello iniziale che ti piace.

   Se non hai un altro posto dove iniziare, prova i modelli integrati nel core di WebsiteBaker (specialmente tutti i CSS e Round). Blank Template è appositamente progettato per la personalizzazione.

2. Installa il modello sul tuo sistema locale.

   È molto più semplice lavorare con un modello sul sistema locale che su un server remoto.

3. Trova la copia locale del modello.

   Normalmente, i modelli sono memorizzati nella directory del proprio server. Ogni modello avrà una sua cartella.

4. Copia la cartella del modello che vuoi modificare.

   È generalmente più intelligente lavorare con una copia piuttosto che con l'originale. Incolla la cartella copiata nella directory dei modelli.

5. Rinomina la nuova cartella per riflettere il nuovo nome del modello.

   Il tuo nuovo modello ha bisogno di un nome diverso rispetto al modello originale.

A questo punto, si ha una copia del modello originale, ma questa copia non si rifletterà ancora nel CMS. È necessario apportare alcune modifiche prima che il nuovo modello sia disponibile. Prima di farlo, dai un'occhiata alla struttura dei file di un tipico modello WebsiteBaker.

Uno dei motivi per cui WebsiteBaker è eccezionale è quanto relativamente semplice sia la struttura del modello rispetto ad altri CMS. La directory contiene un numero relativamente piccolo di file:

• indice. php: Questo file PHP è il file di base utilizzato come fondamento di ogni pagina del sistema. È essenzialmente una pagina HTML con alcune funzioni PHP speciali integrate. Puoi modificare qualsiasi HTML che desideri e le modifiche risultanti si rifletteranno in ogni pagina del sito.

• info. php: Questo semplice file PHP contiene un numero di variabili usate per controllare il comportamento generale del modello. Apporterai alcune modifiche in questo file per dare al tuo modello un nome ufficiale.

• layout_setup. css: Questo file CSS descrive il CSS utilizzato per la progettazione generale della pagina. È possibile modificare il contenuto di questo file CSS per cambiare i colori dei caratteri o altri CSS big-picture.

• layout_text. css: Questo file CSS viene utilizzato per definire gli stili dei vari elementi di testo nel sito.Se stai cercando una classe che non è definita in layout_setup. css, potresti trovarlo qui. Nota: I nomi dei file CSS possono cambiare in altri modelli, ma ci sarà almeno un file CSS.

• Editor. css: Questo file viene utilizzato per modificare l'editor WYSIWYG interno. Descrive come vari elementi sono visualizzati nell'editor.

• directory immagini: Spesso un modello include un numero di immagini. Questi sono memorizzati in una sottodirectory per comodità. Potrebbe essere necessario modificare alcune di queste immagini per creare l'aspetto che stai cercando.

Alcuni modelli sono più complessi, altri meno. Davvero, puoi avere tutti i file che vuoi. Avrai sempre bisogno di avere un indice. php e informazioni. php. Avrai quasi sempre almeno una pagina CSS. Puoi avere qualsiasi altra cosa desideri nel modello, ma nient'altro è assolutamente necessario.