Drupal 6 navigazione veloce.
menu principale | colonna di navigazione a sinistra | contenuto principale | colonna di navigazione a destra | piè di pagina

menu principale

contenuto principale

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

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

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. 

Foglio di stile con commento e regole 

  • 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)

sites/all/themes

  • 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!

Home page

Dobbiamo  lavorare sul layout modificando i file css.


colonna sinistra

colonna destra