Sommario
Prima di sviluppare il nostro modello dobbiamo conoscere alcuni concetti del file Joomla e della struttura delle directory. Alcune directory, elementi e file principali sono:ModelloÈ un gruppo di directory e file che specificano la struttura e il design che il sito web adotterà. Possiamo avere diversi modelli installati per selezionare e quindi modificare il design in base allo sviluppo che stiamo effettuando.
Un file modello generalmente combina codice HTML e php in cui sono definiti i blocchi oi livelli div del web in cui i contenuti web verranno visualizzati in base alla pagina o alla sezione.
Inoltre, nel template HTML possono essere definiti altri blocchi per inserire plugin o codice di funzionalità che dobbiamo eseguire. In generale i blocchi che definiamo blocchi sono l'intestazione del web, la barra di navigazione o menu, le colonne laterali se ci fossero, l'area dei contenuti, se ci serve possiamo creare tutti i blocchi che vogliamo, tutto dipende dal requisiti da sviluppare. Questi blocchi o aree sono chiamati posizioni.
ModuloUn modulo joomla è un oggetto con codice HTML, PHP, CSS o JavaScript che può essere visualizzato in determinate posizioni o blocchi designati nel modello web. Ad esempio, possiamo inserire un accesso utente nell'intestazione, un selettore di lingua, un modulo di contatto, ecc.
CollegareUn plugin Joomla è un oggetto con codice HTML, PHP, CSS o JavaScript che può essere incorporato nel contenuto del web. La differenza dal modulo è dove appare il plugin nella pagina. Il plugin generalmente non può indicare in quale posizione sta andando poiché vengono eseguiti per produrre un evento ad esempio per convalidare un'e-mail,
ComponenteUn componente è una raccolta di moduli e plugin. Ad esempio, un componente può essere un negozio virtuale come Virtuemart, tutti gli oggetti componente hanno le proprie impostazioni e possono essere visualizzati su una pagina separata.
Struttura di un template Joomla
Un template è un insieme di file che definiscono la struttura del web e i blocchi o posizioni a cui possiamo assegnare i diversi elementi. Un modello per Joomla è costituito dai seguenti file:
index.php: è il file principale che descrive la struttura e il design della pagina web
errore.php: è il file che conterrà le direttive in caso di errore pagina non trovata, errore 404.
Anteprima delle immagini: sono quelli denominati template_preview.png.webp e template_thumbnail.png.webp, che ti permetteranno di vedere un'anteprima del template in miniatura da parte dell'amministratore.
Componenti.php: Questo file se abbiamo bisogno di avere una versione stampabile del web allora configuriamo i fogli di stile per presentare l'articolo da stampare.
Immagini: è la directory in cui salveremo tutte le immagini del disegno per le immagini.
js: in questa directory metteremo gli script javascript o Jquery o qualunque cosa usiamo.
linguaggio: in questa directory possiamo trovare i file necessari per le traduzioni in diverse lingue.
Un aspetto importante è che per motivi di sicurezza ogni directory deve avere un file index.html vuoto per evitare che venga letto dall'esterno in modo che chiunque voglia accedere alla directory vedrà solo un documento vuoto.
Dopo aver installato Joomla per il nostro esempio, non indicheremo ora come installarlo, può essere semplicemente scaricato da http://www.joomlaspanish.org/
Demo Template 1.0 26/02/2015 Sergio [email protected] Copyright (C) 2015 Demo Template demo per Joomla 3.0 index.php immagini css debug posizione-0 posizione-1 posizione-2 posizione-3 posizione-4 posizione-5 posizione -6 posizione-7 posizione-8 posizione-9 posizione-10Definiamo il nome del template che chiamiamo Demo del modelloQuando installiamo il template in Joomla, il manager utilizzerà quel nome per creare una directory e salvare i file del template, sarà anche il nome che apparirà nel pannello di amministrazione, l'autore, le directory che contiene il template e il posizioni che avrà, possiamo definirne diverse anche se non le usiamo tutte.
Quindi creeremo il file index.php dove definiremo la struttura del web e le posizioni corrispondenti.
.contenitore {larghezza: 980px; margine sinistro: auto; / * centriamo il web * / margin-right: auto; bordo: nero solido 1px; } .container {margine: 20px 0px; / * applichiamo un margine di 20px al contenuto * / border: verde solido 1px; } .content {float: sinistra; larghezza: 750px; bordo: rosso solido 1px; } .colder {float: a destra; larghezza: 270px; } .colder, .pie, .head {border: 1px blu fisso; } Le classi CSS sono facili da determinare quali blocchi abbiamo e quali posizioni. Infine creiamo un file zip con la directory che contiene il template e lo installiamo dall'amministratore di joomla. Accediamo al pannello di amministrazione di Joomla.
RicordareRicorda che ogni template differisce a seconda della versione di Joomla in quel caso è compatibile con 2.5 a 3.x. Inoltre per installare tutte le directory bisogna avere i permessi per caricare i file.
INGRANDIRE
Clicca sull'immagine per ingrandirla
Il template installato e prendendo le informazioni di default da Joomla in questo caso la versione 2.5 in spagnolo, vediamo come il modulo di accesso utente si trovava automaticamente nella posizione 3 perché è designato così per impostazione predefinita, mentre il contenuto web è posizionato nella posizione 1 che è quello che abbiamo assegnato nei contenuti web. Dall'amministratore possiamo cambiare la posizione dei diversi elementi che gestiamo.Una volta installato il template, se vogliamo aggiornarlo o modificarlo, possiamo agire sul codice del template installato in joomla nella directory templetes oppure lavorare fuori Joomla in un'altra directory, ricreare il file zip, quindi eliminare il template da joomla e reinstallalo.
