Genesis - Creare il tema
Genesis lo trovi in http://drupal.org/project/genesis
- Scegli l'ultima versione raccomandata der la tua versione di Drupal
- Scaricala sul tuo PC e scappattala
- Apri la cartella genesis
- Copia la cartella genesis_SUBTHEME, incollala fuori dalla cartella genesis e rinominala genesis_miotema
- Apri la cartella genesis_miotema e rinomina il file genesis_SUBTHEME.info in genesis_miotema.info
- Apri il file genesi_miotema.info
- Correggi
- "name = Genesis SUBTHEME" con " name = Genesis Mio tema"
- "description = My Kickn' Sub-theme" con "description = My Kickn' Mio tema"
- Apri il file template.php
- Correggi:
- "function genesis_SUBTHEME_preprocess" con "function genesis_miotema_preprocess"
- "function genesis_SUBTHEME_preprocess_page" con "function genesis_miotema_preprocess_page
- "function genesis_SUBTHEME_preprocess_node" con "function genesis_miotema_preprocess_node"
- "function genesis_SUBTHEME_preprocess_comment" con "function genesis_miotema_preprocess_comment"
- In genesis_miotema/templates/page apri il file page.tpl.php
- a riga 101 trovi <body id="genesis-1b" lascia genesis-1b se vuoi una layout con le barre laterali poste a destra e a sinistra della colonna contenuto (come in scuolacooperativa/drupal)
- correggi con genesis-2b se vuoi che le due barre laterali siano entrambi poste a destra della colonna contenuto
- correggi con genesis-3b se vuoi che le due barre laterali siano entrambi poste a sinistra della colonna contenuto
Ti consiglio di scegliere sempre la variante b perchè la misura delle barre laterali è espressa in percentuale
- Per default Genesis imposta una larghezza del sito (width) di 980 pixel. Meglio correggere per rendere il sito fluido e capace di adattarsi a diverse risoluzioni di schermo
- In genesis_miotema/css apri il file page.css
- Correggi
#container {
width: 980px; /* Width for IE6 */
}
body > #container {
width: 100%; /* Width for all other browsers */
max-width: 980px; /* set a maximum width */
min-width: 760px; /* set a minimum width */
}
- con
#container {
width: 98%; /* Width for IE6 */
}
body > #container {
width: 100%; /* Width for all other browsers */
max-width: 98%; /* set a maximum width */
min-width: 760px; /* set a minimum width */
}
- Personalmente ritengo che la larghezza delle barre laterali, che Genesis imposta nel file genesis/genesis/css/layout.css, sia esagerata
- apri il file genesis/genesis/css/layout.css e copia le 5 righe di codice (5 regole) relative alla configurazione scelta (nel caso di scuolacooperativa Drupal 6 la versione 1b)
genesis-1b .two-sidebars .content-inner{margin:0 25.25%;}
#genesis-1b .sidebar-left .content-inner{margin-left:25.25%;}
#genesis-1b .sidebar-right .content-inner{margin-right:25.25%;}
#genesis-1b #sidebar-left{width:24.25%;margin-left:-100%;}
#genesis-1b #sidebar-right{width:24.25%;margin-left:-24.25%;}
- incolla le righe di codice (regole) nel file genesis_miotema/css/style.css in fondo
- correggi con
#genesis-1b .two-sidebars .content-inner{margin:0 21%;}
#genesis-1b .sidebar-left .content-inner{margin-left:21%;}
#genesis-1b .sidebar-right .content-inner{margin-right:21%;}
#genesis-1b #sidebar-left{width:20%;margin-left:-100%;}
#genesis-1b #sidebar-right{width:20%;margin-left:-20%;}
Perchè copiare da genesis/genesis/css/layout.css e incollare in genesis_miotema/css/style.css?
In futuro potremmo pensare di creare, partendo da Genesis, un nuovo tema, quindi è meglio apportare le modifiche all'interno del tema che si sta personalizzando senza modificare i file contenuti nella cartella genesis.
Se dai uno sguardo alla cartella genesis_miotema/css vedrai che sono presenti diversi fogli di stile.
Ogni foglio di stile contiene una serie di "regole" che indicano come devono essere rappresentati i contenuti del documento HTML.
Per comodità ho deciso di inserire nel file style.css le "regole" nuove che non sono già presenti in blocks.css, comments.css, node.css, page.css e che quindi non posso personalizzare.
In style.css, prima delle regole ho aggiunto anche un commento /* Correzione larghezza barre laterali */ che precisa cosa ho corretto.
- Apri di nuovo la cartella genesis e cancella e cancella le cartelle genesis_DARK e genesis_ ULTRALITE: corrispondono a temi non ci servono perchè ne stiamo costruendo uno nostro.
- Trasmetti via ftp nel tuo spazio web le cartelle genesis e genesis_mio tema in sites/all/themes ( se la cartella themes non è presente, creala)
- Vai in Amministra > Struttura del sito > Temi e attiva Genesis Mio tema mettendo il segno di spunta in Attivato e Predefinito
- Salva configurazione
Il risultato non è dei migliori!
Dobbiamo lavorare sul layout modificando i file css.
- 3731 letture
