Indice del forum Olimpo Informatico
I Forum di Zeus News
Leggi la newsletter gratuita - Attiva il Menu compatto
 
 FAQFAQ   CercaCerca   Lista utentiLista utenti   GruppiGruppi   RegistratiRegistrati 
 ProfiloProfilo   Messaggi privatiMessaggi privati   Log inLog in 

    Newsletter RSS Facebook Twitter Contatti Ricerca
* un semplice template
Nuovo argomento   Rispondi    Indice del forum -> Linguaggi per Internet
Precedente :: Successivo  
Autore Messaggio
Wolverine
Dio minore
Dio minore


Registrato: 27/07/05 10:56
Messaggi: 817
Residenza: Tamen-ni-gru

MessaggioInviato: 04 Lug 2006 12:13    Oggetto: Rispondi citando

fino a quitutto semplice...adesso inserisco i bannerini carini
Top
Profilo Invia messaggio privato HomePage Yahoo MSN
rebelia
Dio maturo
Dio maturo


Registrato: 17/07/03 09:22
Messaggi: 7987

MessaggioInviato: 04 Lug 2006 12:16    Oggetto: Rispondi citando

Wolverine ha scritto:
fino a quitutto semplice...adesso inserisco i bannerini carini


fermo la'!

lo si fa sul template (colpa mia che non ci ho pensato prima) e nel modo corretto e poi si ricopia la parte nel file gia' fatto (questo e' il motivo per cui bisogna prima completare il template con tutti gli elementi, sic!)

dammi un minuto che ti butto giu' il codice corretto
Top
Profilo Invia messaggio privato HomePage
Wolverine
Dio minore
Dio minore


Registrato: 27/07/05 10:56
Messaggi: 817
Residenza: Tamen-ni-gru

MessaggioInviato: 04 Lug 2006 12:24    Oggetto: Rispondi citando

COSì non va bene?
Top
Profilo Invia messaggio privato HomePage Yahoo MSN
rebelia
Dio maturo
Dio maturo


Registrato: 17/07/03 09:22
Messaggi: 7987

MessaggioInviato: 04 Lug 2006 12:29    Oggetto: Rispondi citando

nella stessa cartella dove hai i files, creati una sottocartella che chiamerai "immagini" e salvaci dentro i quattro bannerini

poi prendi in mano il file template.html e modifica il footer come segue:

Codice:

   <div id="footer">
      <ul>
         <li><a href="http://www.madvero.it/"><img src="immagini/madvero.bmp" alt="Vai al sito di Madvero" /></a></li>
         <li><a href="http://zeusnews.it/"><img src="immagini/olimpo.jpg" alt="Vai al forum dell'Olimpo Informatico" /></a></li>
         <li><a href="http://www.beppegrillo.it/"><img src="immagini/beppe.jpg" alt="Vai al blog di Beppe Grillo" /></a></li>
         <li><a href="http://www.imperium-romanum.it/"><img src="immagini/forrom.gif" alt="Vai al sito dell'Imperium Romanum" /></a></li>
      </ul>
   </div>


per favore controlla anche la chiusura della pagina che - dopo la chiusura di footer - deve essere composta da tre tag come segue:

Codice:

</div>
</body>
</html>


mi sono "mangiata" la chiusura del div principale in qualche passaggio e devi correggere

***

per tornare al footer: NON preoccuparti se i banner vanno a finire uno sotto l'altro, poi risolviamo; per ora preoccupati solo di avere l'elenco taggato correttamente e che le immagini siano visualizzate

una volta che il div footer e' pronto, copia il codice anche nella pagina index.html e poi procediamo (pero' prima pensa se ti servono altri elementi "comuni" che provvediamo ad inserirli prima di continuare con la preparazione delle pagine)

vado a correggere i post precedenti, dimmi quando ci sei
Top
Profilo Invia messaggio privato HomePage
Wolverine
Dio minore
Dio minore


Registrato: 27/07/05 10:56
Messaggi: 817
Residenza: Tamen-ni-gru

MessaggioInviato: 04 Lug 2006 12:34    Oggetto: Rispondi citando

Wolverine ha scritto:
COSì non va bene?
Old
Top
Profilo Invia messaggio privato HomePage Yahoo MSN
rebelia
Dio maturo
Dio maturo


Registrato: 17/07/03 09:22
Messaggi: 7987

MessaggioInviato: 04 Lug 2006 12:40    Oggetto: Rispondi citando

Wolverine ha scritto:
Wolverine ha scritto:
COSì non va bene?
Old


perche' non fare di meglio, se si puo'? Wink

spiegazione tecnica:
quel che proponi e' un elenco di link, percio' tecnicamente e' giusto taggarlo come tale, cioe' usando un elenco puntato Smile
Top
Profilo Invia messaggio privato HomePage
Wolverine
Dio minore
Dio minore


Registrato: 27/07/05 10:56
Messaggi: 817
Residenza: Tamen-ni-gru

MessaggioInviato: 04 Lug 2006 12:48    Oggetto: Rispondi citando

cioè? Laughing
Top
Profilo Invia messaggio privato HomePage Yahoo MSN
rebelia
Dio maturo
Dio maturo


Registrato: 17/07/03 09:22
Messaggi: 7987

MessaggioInviato: 04 Lug 2006 13:13    Oggetto: Rispondi citando

Wolverine ha scritto:
cioè? Laughing


cioe' come ti ho scritto due post sopra Rolling Eyes

scrolla per la spiegazione, cmq il codice corretto e' questo:

Codice:

   <div id="footer">
      <ul>
         <li><a href="http://www.madvero.it/"><img src="immagini/madvero.bmp" alt="Vai al sito di Madvero" /></a></li>
         <li><a href="http://zeusnews.it/"><img src="immagini/olimpo.jpg" alt="Vai al forum dell'Olimpo Informatico" /></a></li>
         <li><a href="http://www.beppegrillo.it/"><img src="immagini/beppe.jpg" alt="Vai al blog di Beppe Grillo" /></a></li>
         <li><a href="http://www.imperium-romanum.it/"><img src="immagini/forrom.gif" alt="Vai al sito dell'Imperium Romanum" /></a></li>
      </ul>
   </div>


non limitarti a copiare quel che ti scrivo, ma leggi i post e le spiegazioni per favore!
Top
Profilo Invia messaggio privato HomePage
Wolverine
Dio minore
Dio minore


Registrato: 27/07/05 10:56
Messaggi: 817
Residenza: Tamen-ni-gru

MessaggioInviato: 04 Lug 2006 13:17    Oggetto: Rispondi citando

le spiegazioni le leggo.....il codice lo capisco..... Wink
Top
Profilo Invia messaggio privato HomePage Yahoo MSN
rebelia
Dio maturo
Dio maturo


Registrato: 17/07/03 09:22
Messaggi: 7987

MessaggioInviato: 04 Lug 2006 13:24    Oggetto: Rispondi citando

Wolverine ha scritto:
cioè? Laughing


sic!

vabbe', andiamo avanti

ora il template e' pronto e gia' hai anche il file index: mossa successiva e' creare gli altri files

prendi il template e salvalo con gli altri nomi seguendo l'impostazione data qui:

Codice:

   <div id="menu">
      <ul>
         <li><a href="index.html">Home</a></li>
         <li><a href="chi_sono.html">Chi sono</a></li>
         <li><a href="articoli.html">Articoli</a></li>
         <li><a href="giochi.html">Giochi</a></li>
         <li><a href="download.html">Download</a></li>
         <li><a href="link.html">Link utili</a></li>
      </ul>
   </div>


creali anche se ancora non hai contenuti

all'interno della cartellina principale creati anche una cartellina "download" dove salverai i files della sezione download

vado a scolare il riso o oggi non si mangia Mr. Green

ci sentiamo dopo
Top
Profilo Invia messaggio privato HomePage
Wolverine
Dio minore
Dio minore


Registrato: 27/07/05 10:56
Messaggi: 817
Residenza: Tamen-ni-gru

MessaggioInviato: 04 Lug 2006 13:30    Oggetto: Rispondi citando

rebelia ha scritto:
Wolverine ha scritto:
cioè? Laughing


sic!

vabbe', andiamo avanti



il caldo incomincia a darti alla testa Wink

hai saltato qualche mex della pagina precedente... Rolling Eyes
Top
Profilo Invia messaggio privato HomePage Yahoo MSN
rebelia
Dio maturo
Dio maturo


Registrato: 17/07/03 09:22
Messaggi: 7987

MessaggioInviato: 04 Lug 2006 14:05    Oggetto: Rispondi citando

edit
Top
Profilo Invia messaggio privato HomePage
rebelia
Dio maturo
Dio maturo


Registrato: 17/07/03 09:22
Messaggi: 7987

MessaggioInviato: 04 Lug 2006 14:08    Oggetto: Rispondi citando

Wolverine ha scritto:
Footer:inseriro le solite scritte della serie"sito senza scopi di lucro" e poi i vari banner....


ok inserisci nel template e nel file index.html come segue:

Codice:

<div id="footer">
<p>bla bla bla</p>

<ul>

[la parte dei banner]

</ul>
</div>



ho dimenticato null'altro, mr wolverine? Wink
Top
Profilo Invia messaggio privato HomePage
rebelia
Dio maturo
Dio maturo


Registrato: 17/07/03 09:22
Messaggi: 7987

MessaggioInviato: 04 Lug 2006 14:44    Oggetto: Rispondi citando

ok, torniamo alle pagine

tra quelle gia' pronte hai la sezione di download, percio' procediamo con quella

le voci attualmente presenti sono:

  • PAC MAN
  • MUTANT SPIDER
  • ANTICITY
  • BRUCIA FORMICHE
  • LABIRINTO


apri il template e salvalo come download.html; il codice che devi inserire nella parte centrale e' questo:

Codice:

   <div id="contenuto">

      <p> [testo che vuoi inserire a presentazione] </p>

      <ol>
         <li><a href="download/pacman.zip" title="Scarica lo zip di Pac-Man">Pac-man</a> - file in formato zip da 240kb</li>
         <li><a href="download/mutant_xpiders.zip" title="Scarica lo zip di Mutant Spider">Mutant Spider</a> - file in formato zip da 174kb</li>
         <li><a href="download/antcity.zip" title="Scarica lo zip di Antcity">Antcity</a> - file in formato zip da 754kb</li>
         <li><a href="download/brucialetutte.zip" title="Scarica lo zip di Brucia formiche">Brucia formiche</a> - file in formato zip da 322kb</li>
         <li><a href="download/labirinto.zip" title="Scarica lo zip di Labirinto">Labirinto</a> - file in formato zip da 864kb</li>
     </ol>

   </div>


e anche la pagina download e' completata Smile
Top
Profilo Invia messaggio privato HomePage
rebelia
Dio maturo
Dio maturo


Registrato: 17/07/03 09:22
Messaggi: 7987

MessaggioInviato: 04 Lug 2006 14:48    Oggetto: Rispondi citando

pagina chi sono:

solito file template.html
solito salvataggio con altro nome (in questo caso chi_sono.html)

e solita modifica al div contenuto:

Codice:

   <div id="contenuto">

      <p>Probabilmente vorreste sapere il mio nome.Ma si...visto che avete visitato il mio sito ve lo devo. Mi chiamo Gabriele. Nome da Webmaster:Qvirites. Ho aperto questo sito per poche e semplici ragioni:</p>

      <ol>
         <li>Non sapevo che fare</li>
         <li>Non sapevo come buttare via il mio tempo</li>
         <li>Per quanto scriva male mi piace scrivere</li>
         <li>Voglio far conoscere al mondo le mie idee e quelle di chi mi appoggia nella costruzione di questo sito.</li>
      </ol>

      <p>Queste sono le banali ragioni che mi hanno portato a pacioccare con il codice HTML e, tra un errore e l'altro, a creare questa sottospecie di sito.</p>

      <p>Cosa fa precisamente questo sito? Quale sarebbe la sua funzione?
Eh!... bella domanda! Sinceramente parlando:non lo so neanche io. Ho le idee confuse? No. Le idee le ho chiare, il punto è che il sito non rientra in una determinata categoria. Diciamo che è un mix... avreste mai pensato di unire articoli riguardanti politica e attualità a sezioni dedicate ai giochi?!Solo un pazzo lo farebbe.... ed ecco perchè l'ho fatto! Sono pazzo! Comunque, sarebbe complicato spiegarvi tutto adesso (anche perchè non so scrivere un gran chè) e inoltre vi ho rubato fin troppo tempo con queste quattro righe. Dunque, se avete intenzione di conoscere a fondo il mio "regno", visitate interamente il sito, qualche cosa di utile lo roverete!</p>

      <p>Buona navigazione!!</p>

      <p>Gabriele (Qvirites)</p>

   </div>


L'ultima modifica di rebelia il 04 Lug 2006 15:09, modificato 2 volte
Top
Profilo Invia messaggio privato HomePage
rebelia
Dio maturo
Dio maturo


Registrato: 17/07/03 09:22
Messaggi: 7987

MessaggioInviato: 04 Lug 2006 14:51    Oggetto: Rispondi citando

appena sei arrivato fin qua e mi confermi che non ci sono problemi (nel caso ci fermiamo e torniamo sulle parti poco chiare), passiamo alla formattazione per rendere il tuo sito un po' piu' come piace a te Smile

primo passo, trasformare le liste da verticali a orizzontali Wink
Top
Profilo Invia messaggio privato HomePage
rebelia
Dio maturo
Dio maturo


Registrato: 17/07/03 09:22
Messaggi: 7987

MessaggioInviato: 04 Lug 2006 15:55    Oggetto: Rispondi citando

beh, visto che ho qualche minuto, procedo a rendere orizzontali i due menu

apri il file stile.css e aggiungi alcuni parametri al div #menu come segue:

Codice:

   #menu ul {
      list-style: none;
      margin: 0px;
      padding: 0px;
      }

      #menu ul li {
         display: inline;
         margin: 0px;
         padding: 0px;
         }


che tradotto vuol dire:


  • list-style: none; -> non mettere alcun simbolo prima della voce
  • margin: 0px; -> non mettere alcun margin all'elemento
  • padding: 0px; -> non mettere alcun padding all'elemento
  • display: inline; -> questo elemento - che di solito manda a capo l'elemento successivo - fallo diventare "in linea" cioe' fai in modo che *non* mandi a capo l'elemento successivo (spiegazione MOLTO a spannoni, ma per ora e' sufficiente)


la stessa cosa e' da scrivere per l'elenco del footer, quello con i bannerini:

Codice:

#footer {
   }

   #footer ul {
      list-style: none;
      margin: 0px;
      padding: 0px;
      }

      #footer ul li {
         display: inline;
         margin: 0px;
         padding: 0px;
         }


con l'occasione, ho aggiunto anche #footer { } che facilmente mi servira' piu' avanti

riepilogo: a questo punto il css sara' piu' o meno cosi':

Codice:

body {
   background: white;
   color: black;
   font-family: verdana, arial, helvetica, sans-serif;
   font-size: 70%;
   text-align: center;
   }
   
hr {
   display: none;
   }

img {
   border: 0px;
   }
   
#contenitore {
   width: 750px;
   border: 1px solid navy;
   margin: 10px auto 10px auto;
   padding: 0px;
   }

#header {
   border-bottom: 1px solid navy;
   }
   
#menu {
   border-bottom: 1px solid navy;
   }

   #menu ul {
      list-style: none;
      margin: 0px;
      padding: 0px;
      }

      #menu ul li {
         display: inline;
         margin: 0px;
         padding: 0px;
         }

#contenuto {
   padding: 10px;
   text-align: left;
   border-bottom: 1px solid navy;
   }

#footer {
   }

   #footer ul {
      list-style: none;
      margin: 0px;
      padding: 0px;
      }

      #footer ul li {
         display: inline;
         margin: 0px;
         padding: 0px;
         }



L'ultima modifica di rebelia il 27 Ago 2006 10:21, modificato 1 volta
Top
Profilo Invia messaggio privato HomePage
rebelia
Dio maturo
Dio maturo


Registrato: 17/07/03 09:22
Messaggi: 7987

MessaggioInviato: 04 Lug 2006 16:38    Oggetto: Rispondi citando

se tutto finora e' andato a buon fine, cliccando sulle pagine il browser dovrebbe visualizzare qualcosa di simile:



(in versione piu' grande, naturalmente: quest'immagine e' ridotta del 50%)

nota: al momento i link sono appiccicati l'uno all'altro, ma provvederemo a staccarli al piu' presto Smile

***

e ora passiamo a qualcosa di piu' divertente: i colori

appena ti sei portato in pari con il codice, ti consiglio di pacioccare un po' con questo strumento fino a quando trovi la combinazione che ti ispira, mi posti lo screenshot (non e' possibile postare il link) oppure anche solo i codici colore che trovi nell'area contrassegnata dal cerchio rosso:



altra cosa da decidere: come intendi impostare l'intestazione? vuoi inserirci un'immagine tipo quella di zn oppure preferisci lasciare il testo cosi' com'e'?
Top
Profilo Invia messaggio privato HomePage
Wolverine
Dio minore
Dio minore


Registrato: 27/07/05 10:56
Messaggi: 817
Residenza: Tamen-ni-gru

MessaggioInviato: 07 Lug 2006 19:35    Oggetto: Rispondi citando

scusa se posto dsolo adesso è solo che ultimamente sono un po' incasinato...cmq,per quel che riguarda l'aspetto...pensavo aun colore come questo

Codice:
#BFFFF9


lo inserisco nel codice body gusto? Wink
Top
Profilo Invia messaggio privato HomePage Yahoo MSN
rebelia
Dio maturo
Dio maturo


Registrato: 17/07/03 09:22
Messaggi: 7987

MessaggioInviato: 07 Lug 2006 19:41    Oggetto: Rispondi

dipende cosa vuoi farne Smile

se quel che ti interessa e' che diventi lo sfondo allora si; nel file stile.css scriverai:

Codice:

body {

   background: #BFFFF9;

   color: black;
   font-family: verdana, arial, helvetica, sans-serif;
   font-size: 70%;
   text-align: center;
   }

(te l'ho staccato dal resto per evidenziarlo)

anziche' il background: white; che c'era prima Smile
aggiungerei quest'ultimo al div contenitore, in questo modo:

Codice:

#contenitore {

   background: #fff;

   width: 750px;
   border: 1px solid navy;
   margin: 10px auto 10px auto;
   padding: 0px;
   }


(#fff e' il valore esadecimale del bianco ed essendo le coppie di cifre uguali a due a due, e' possibile contrarlo e scrivere #fff anziche' l'originario #ffffff)

altra domanda:

rebelia ha scritto:
come intendi impostare l'intestazione? vuoi inserirci un'immagine tipo quella di zn oppure preferisci lasciare il testo cosi' com'e'?


L'ultima modifica di rebelia il 07 Lug 2006 20:01, modificato 1 volta
Top
Profilo Invia messaggio privato HomePage
Mostra prima i messaggi di:   
Nuovo argomento   Rispondi    Indice del forum -> Linguaggi per Internet Tutti i fusi orari sono GMT + 2 ore
Vai a Precedente  1, 2, 3  Successivo
Pagina 2 di 3

 
Vai a:  
Non puoi inserire nuovi argomenti
Non puoi rispondere a nessun argomento
Non puoi modificare i tuoi messaggi
Non puoi cancellare i tuoi messaggi
Non puoi votare nei sondaggi