Joomla! 2.5 (versione con supporto terminato) > I Template di Joomla 1.6/1.7/2.5

photoshop + tutorial

<< < (2/3) > >>

tomtomeight:
Tutto quello che ti serve per fare un template è un editor tipo notepad++ e basta come strumenti, poi occorre la conoscenza del linguaggio html, css e php, il software grafico non serve per integrare, è il codice che integra gli elementi, tutt'alpiù il software frafico ti è utile per manipolare  (ottimizzare, ridimensionare, ecc.) le immagini.

daniele95:
html lo conosco bene...  css e php nozioni base... ma qello che non capisco è se il software grafico non serve alr perche nei templates che scarico c'è al cartella img col banner lo sfondo la decorazione dei moduli eqnt'altro?

tomtomeight:
Quelli sono gli elementi grafici e li puoi costruire come ti pare ma per integrarli nel template lo fai solo col codice, non esiste un metodo wysiwyg ove prendi gli elementi e li assembli per costruire un template,  secondo me non hai letto la guida attentamente, non cercare scorciatoie, ti consiglio di incominciare ad analizzare un template pezzo per pezzo osservandone gli elementi con firebug e provando a cambiare i parametri visualizzandone i cambiamenti in tempo reale. Inizia coi template per la 1.5 che sono più semplici.

daniele95:
ahahah di solito io la vita più che "scorciatoiarla(neologismo inventato sul momento)" me la complico! conoscendomi poreferisco impiegare 1 mese e fare da solo più tosto che imparare a studiare un template in 1 settimana.... quindi basandomi su quanto letto in quella guida la base per iniziare è una pagina html costituita con i tag <div></div>... dovendo essere un layout in 2 colonne(corpo centralle e menù principale ed utente laterale), il banner in alto e il copyright ed altre piccole voci in basso avrò bisogno di 4 spazi.... che sono header, left, main contenent, e footer, quindi il codice html sarà il seguente:

--- Codice: ---<div class="container">

<div class="header">
header
</div>

<div class="left">
left
</div>

<div class="Main Contenent">
Main Contenent
</div>

<div class="footer">
footer
</div>

</div>

--- Termina codice ---

ho fatto errori?

daniele95:
il codice html:

--- Codice: ---<html>
<head>

</head>

<body bgcolor="000000">
<style type="text/css" >@import url(stile.css);</style>

<div class="container">

<div class="header">
header
</div>

<div class="left">
left
</div>

<div class="main-contenent">
main-contenent
</div>

<div class="footer">
footer
</div>

</div>
</body>
</html>
--- Termina codice ---

e il foglio di stile:


--- Codice: ---.container{
     width: 800px;
     margin: 0 auto;
}

.header {
     text-align: center;
     background-color:#FF9900;
     border: 1px solid #CCCCCC;
     width: 100%;
     height: 80px;
     float:none;

}

.left {
     text-align: center;
     background-color:#6666CC;
     width: 25%;
     height: 600px;
     float:left;

}

.main-contenent {
     text-align: center;
     background-color:#FFCC99;
     width: 75%;
     height: 600px;
     float:left;

}

.footer {
     text-align: center;
     background-color:#33FF33;
     border: 1px solid #CCCCCC;
     height: 50px;
     clear:left;

}
--- Termina codice ---

il prossimo passo?

Navigazione

[0] Indice dei post

[#] Pagina successiva

[*] Pagina precedente

Vai alla versione completa