| Mostra argomento precedente :: Mostra argomento successivo |
| Autore |
Messaggio |
marcoz71
utente attivo
Iscritto: 02 Set 2006
Messaggi: 7647
Località: la piccola Confoederatio Helvetica
|
 Inviato: Mer 20 Ago, 2008 1:09 pm Oggetto: restyling sito: domande varie su html/php/css |
 |
|
ecco una bella domanda per i webdesigner e appassionati di HTML/CSS...
sto rifacendo completamente la struttura e la grafica del mio sito www.marcoz71.com
il risultato visibile della struttura vorrei mantenerlo invariato, ma vorrei cambiare il modo con cui la ottengo... attualmente ho un menu orizzontale in alto e i contenuti sotto, il tutto è ottenuto tramite i frames, cosa che voglio eliminare
mi son studiato quindi il tag DIV e i fogli di stile CSS, praticamente adesso ho creato una pagina base con la struttura del sito: ho 4 TAGs, uno per l'header, uno per il menu di navigazione, uno per i contenuti ed uno per il footer... anteprima: http://www.marcoz71.com/restyling/home.html
tutta l'impostazione sui caratteri, le dimensioni dei vari blocchi ecc. sono gestiti nel foglio di stile CSS salvato in un file separato...
e fin qui tutto ok...
il sito sarà composto da una 20ina di pagine... se un giorno dovessi voler aggiungere una voce al menu devo per forza modificare tutte le pagine del sito?
non c'è un modo di collegare il tag DIV relativo della navigazione ad una pagina esterna, nella quale viene gestito il menu in un unico file?
_________________
MarcoCanon EOS 6D+40D+350D+3 e un po' di vetri
Ultima modifica effettuata da marcoz71 il Ven 29 Ago, 2008 11:24 pm, modificato 1 volta in totale |
|
Vai ad inizio pagina
Vai a fine pagina |
|
 |
-Aragorn-
utente
Iscritto: 15 Lug 2007
Messaggi: 350
Località: Torino
|
| Inviato: Mer 20 Ago, 2008 1:25 pm Oggetto: |
|
|
Se le pagine sono scritte in php basta creare un file con all'interno l'header e poi includerlo all'interno di ogni pagina in cui vuoi inserirlo.
Le eventuali modifiche le dovrai poi fare all'unico file "header.php" che hai creato per renderle effettive in tutte le pagine del sito.
La riga php è
include('cartella/header.php');
da inserire nel punto in cui vuoi compaia l'header.
Se le pagine sono scritte in html l'unico modo che conosco è quello dei frame, ormai in disuso e superscongliati, ma non so come sono stati sostituiti
_________________
Canon EOS400D - Canon EF-S 10-22 f/3,5-4,5 - Canon EF-S 17-55 f/2,8 IS - Canon EF 50 f/1,8 - Canon EF 70-200L f/4 - Canon EF 300L f/4 IS - Canon Extender 1,4x II - Canon Speedlight 430EX - Sistema Cokin serie P - Manfrotto 190XDB + 460MG |
|
Vai ad inizio pagina
Vai a fine pagina |
|
|
Nicola Giani
utente attivo
Iscritto: 01 Feb 2006
Messaggi: 3677
Località: Milano
|
| Inviato: Mer 20 Ago, 2008 1:39 pm Oggetto: |
|
|
Oltre al PHP tutti i linguaggi di scripting consentono l'inclusione di blocchi.
Se usi gli IFRAME te la cavi con il solo HTML.
Oppure, come secondo per semplicità, generi il menu con una funzioncina Javascript che sta su un file esterno.
Al limite la funzione contiene solo un lungo document.write con tutto l'HTML come parametro...
_________________
Che bello il copia e incolla! |
|
Vai ad inizio pagina
Vai a fine pagina |
|
|
Italian Comrade
utente
Iscritto: 04 Nov 2007
Messaggi: 145
Località: Italia Centrale
|
| Inviato: Mer 20 Ago, 2008 3:23 pm Oggetto: Un'interessante JS update |
|
|
Ti hanno già detto tutto.
Gli IFRAME (inline frame) sono utilizzabili, è semmai l'Elemento FRAME che può dare problemi/limitazioni.
Ricordo che si deve/può codificare <a href="#" target="_parent"> perché altrimenti i Link del menù aprono le pagine nell' iframe (piccolo) stesso.
Valuta anche questa possibilità.
Salva un file .js dove c'è solo (per adesso) una funzione vuota.
Il file è tutto qua:
function revise() {
}
salvandolo lo chiami, diciamo service.js
Lo scrivi come semplice file di testo (un copia-incolla) solo che invece dell'estensione .txt gli assegni .js (c'è l'opzione anche nella dialog-box mentre salvi).
Allora in ogni pagina, nella HEAD metti sin d'ora un richiamo a questo file JavaScript:
<script type="text/javascript" src="service.js"></script>
e nel Tag di apertura BODY inserisci già il richiamo della funzione:
<body onLoad="revise()">
E per ora rimangono indifferenti.
Il giorno che vorrai modificare qualcosa, equipaggeremo la funzione con quanto dovuto; nel caso citato, per estendere il menù, lo sovra-scriviamo con .innerHTML :
function revise() {
document.getElementById("navigation").innerHTML = ' '
}
Puoi già fare una prova, per adesso rimanendo a scrivere su una sola riga:
| Codice: |
function revise() {
document.getElementById("navigation").innerHTML = '<ul><li><a id="activelink" href="#">nome</a></li><li><a href="#">news</a></li></ul>'
}
|
Ti ho già preparato un layout, processa questo per testare, lo SCRIPT con la funzione è già interno al Documento;
poi chiaramente, rendendolo esterno diventa un file.js unico per tutte le pagine.
| Codice: |
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>www.marcoz71.com</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
function revise() {
document.getElementById("navigation").innerHTML = '<ul><li><a id="activelink" href="#">home</a></li><li><a href="#">news</a></li></ul>'
}
</script>
<style type="text/css">
@import url("http://www.marcoz71.com/restyling/stile_standard.css");
a#viewcss{color: #00f;font-weight: bold}
</style>
</head>
<body onLoad="revise()">
<div id="container">
<div id="header">
<img src="http://www.marcoz71.com/restyling/images/top-frame-immagine-sfondo.jpg" border=0>
</div>
<div id="navigation">
<ul>
<li><a id="activelink" href="#">home</a></li>
<li><a href="#">news</a></li>
<li><a href="#">chi sono?</a></li>
<li><a href="#">fotografia</a></li>
<li><a href="#">viaggi&vacanze</a></li>
<li><a href="#">hobbies&altro</a></li>
<li><a href="#">links</a></li>
<li><a href="#">guestbook</a></li>
<li><a href="#">e-m@il</a></li>
</ul>
</div>
<div id="content">
contenuto della pagina...
</div>
<div id="footer">
© Marco Minucelli - ultimo aggiornamento: 19 agosto 2008
</div>
</div>
</body>
</html>
|
Do' per assunto che gli Elementi interessati abbiano un NAME o un ID come già gli viene attribuito per i CSS; JavaScript può benissimo avvalersi dei medesimi. Altrimenti, JS non li può andare a "beccare".
Andando a "beccare" il <div id="header"> ti posso cambiare la Foto nell'intestazione in tutte le pagine; allora la stringa di esecuzione è questa:
document.getElementById("header").innerHTML = '<img src="nuovoURL.jpg" border="0"> '
volendo, sarebbe più pratico conferire direttamente un ID al Tag IMG e allora la stringa diventa:
document.getElementById("header_pic").src = ' nuovoURL.jpg '
Nella stessa funzione function possono coesistere più stringhe di esecuzione.
|
|
Vai ad inizio pagina
Vai a fine pagina |
|
|
marcoz71
utente attivo
Iscritto: 02 Set 2006
Messaggi: 7647
Località: la piccola Confoederatio Helvetica
|
| Inviato: Mer 20 Ago, 2008 8:53 pm Oggetto: |
|
|
grazie mille a tutti... sapevo di trovare qualche esperto...
la versione php sarebbe veramente semplice, ma per ora evito...
la versione js è un po' troppo laboriosa...
penso che mi baserò su IFRAME...
adesso mi ci metto... vi farò sapere...
_________________
MarcoCanon EOS 6D+40D+350D+3 e un po' di vetri |
|
Vai ad inizio pagina
Vai a fine pagina |
|
|
marcoz71
utente attivo
Iscritto: 02 Set 2006
Messaggi: 7647
Località: la piccola Confoederatio Helvetica
|
| Inviato: Mer 20 Ago, 2008 10:18 pm Oggetto: |
|
|
alla fine ho optato per php... molto più semplice... con IFRAME non riuscivo ad applicare i giusti stili... tramite php tutto ok...
è che mi spiace avere tutti i files php unicamente per la gestione del menu... ma fa nagott...
eccolo: http://www.marcoz71.com/restyling/home.php
cmq ho ancora moltissimo da fare...
_________________
MarcoCanon EOS 6D+40D+350D+3 e un po' di vetri |
|
Vai ad inizio pagina
Vai a fine pagina |
|
|
raffaele75
utente
Iscritto: 12 Mar 2008
Messaggi: 367
Località: Roma
|
| Inviato: Gio 21 Ago, 2008 12:46 pm Oggetto: |
|
|
forse sono arrivato in ritardo...
se usi dreamweaver puoi creare il menu come oggetto nella library, così quando aggiorni la library ti si aggiorna tutto il sito. stessa cosa se crei un template.
|
|
Vai ad inizio pagina
Vai a fine pagina |
|
|
marcoz71
utente attivo
Iscritto: 02 Set 2006
Messaggi: 7647
Località: la piccola Confoederatio Helvetica
|
| Inviato: Gio 21 Ago, 2008 3:16 pm Oggetto: |
|
|
| raffaele75 ha scritto: | forse sono arrivato in ritardo...
se usi dreamweaver puoi creare il menu come oggetto nella library, così quando aggiorni la library ti si aggiorna tutto il sito. stessa cosa se crei un template. |
grazie... si uso dreamweaver normalmente (per i contenuti delle pagine)... interessante anche questa cosa... così potrei evitare il php... mmmhhh adesso sono in dubbio sul da farsi...
_________________
MarcoCanon EOS 6D+40D+350D+3 e un po' di vetri |
|
Vai ad inizio pagina
Vai a fine pagina |
|
|
raffaele75
utente
Iscritto: 12 Mar 2008
Messaggi: 367
Località: Roma
|
| Inviato: Ven 22 Ago, 2008 11:07 am Oggetto: |
|
|
| io programmo in php e uso anche dreamweaver... alla fine ti consiglio il php, è sempre più versatile, pure per sviluppi futuri del tuo sito...
|
|
Vai ad inizio pagina
Vai a fine pagina |
|
|
marcoz71
utente attivo
Iscritto: 02 Set 2006
Messaggi: 7647
Località: la piccola Confoederatio Helvetica
|
| Inviato: Gio 28 Ago, 2008 10:08 am Oggetto: |
|
|
ho deciso... php e basta... ho quasi finito le impostazioni base della pagina, adesso posso creare tutte le pagine, ne avrò per un po'...
una sola domanda... ho testato con FF3, IE6 e IE7 e tutto sembra funzionare a dovere...
capita solo una cosa strana quando carico la pagina la prima volta, praticamente resta una fascia in basso al browser di colore bianco, anzichè il colore di sfondo da me impostato... ma se faccio refresh si colora e tutto è ok...
c'è ancora un errorino da qualche parte?
http://www.marcoz71.com/restyling/home.php
_________________
MarcoCanon EOS 6D+40D+350D+3 e un po' di vetri |
|
Vai ad inizio pagina
Vai a fine pagina |
|
|
FotoFaz
utente attivo
Iscritto: 14 Giu 2005
Messaggi: 10181
Località: a cavallo del Ticino (fiume)
|
| Inviato: Gio 28 Ago, 2008 2:02 pm Oggetto: |
|
|
Arrivo tardi, ma vedo che hai scelto la soluzione migliore (cioè quella che ho scelto pure io  )
Io non vedo quella striscia bianca di cui parli.
Come lo hai fatto lo sfondo?
E' un'immagine con un "repeat" nei CSS?
Un'immagine singola?
Conta che alle volte il browser pesca dalla cache e non da internet, quindi non vedi l'aspetto definitivo fino a che non fai Ctrl+R (per FF) o Shift+F5 per IE.
Ora non ti resta che darci dentro e far rendere un po' di più il php.
Io l'ho trovato eccezionale per la gestione della mia galleria. Son passato da 30 file html ad un solo php+file db.
Ciao
_________________
|
|
Vai ad inizio pagina
Vai a fine pagina |
|
|
Neo_82
utente
Iscritto: 24 Mgg 2004
Messaggi: 487
Località: Catania
|
| Inviato: Gio 28 Ago, 2008 2:39 pm Oggetto: |
|
|
Qualcuno potrebbe consigliarmi una guida al php base.....anche io voglio eliminare i frame dal mio sito un pò datato e mantenere la struttura esistente...ma non saprei dove cominciare col php...
_________________
Sony A700 - Minolta Dynax 5 - KM 17-35 f2,8-4 D - KM 28-75 f2,8 D - KM 50 f1,7 - KM 70-210 f4 Beercan - KM 75-300 f4,5-5,6 Big Beercan - Cosina 100 f3,5 - Flash KM 2500D -::- Fuji S5000
<<Tutto ciò che passa non è che immagine>> [Goethe] |
|
Vai ad inizio pagina
Vai a fine pagina |
|
|
marcoz71
utente attivo
Iscritto: 02 Set 2006
Messaggi: 7647
Località: la piccola Confoederatio Helvetica
|
| Inviato: Gio 28 Ago, 2008 3:01 pm Oggetto: |
|
|
| Neo_82 ha scritto: | | Qualcuno potrebbe consigliarmi una guida al php base.....anche io voglio eliminare i frame dal mio sito un pò datato e mantenere la struttura esistente...ma non saprei dove cominciare col php... |
io ho fatto con css, php solo per gestire il menu in un unico posto (altrimeni in caso di cambiamenti avrei dovuto operare su tutte le pagine del sito, cosa che assolutamente non avrebbe senso)...
come impostare il tutto l'ho "rubato" da qui: http://css.html.it/guide/leggi/3/guida-layout-dei-siti-con-i-css/
_________________
MarcoCanon EOS 6D+40D+350D+3 e un po' di vetri |
|
Vai ad inizio pagina
Vai a fine pagina |
|
|
marcoz71
utente attivo
Iscritto: 02 Set 2006
Messaggi: 7647
Località: la piccola Confoederatio Helvetica
|
|
Vai ad inizio pagina
Vai a fine pagina |
|
|
FotoFaz
utente attivo
Iscritto: 14 Giu 2005
Messaggi: 10181
Località: a cavallo del Ticino (fiume)
|
| Inviato: Gio 28 Ago, 2008 5:16 pm Oggetto: |
|
|
| Neo_82 ha scritto: | | Qualcuno potrebbe consigliarmi una guida al php base.....anche io voglio eliminare i frame dal mio sito un pò datato e mantenere la struttura esistente...ma non saprei dove cominciare col php... |
www.php.net
Ciao
_________________
|
|
Vai ad inizio pagina
Vai a fine pagina |
|
|
FotoFaz
utente attivo
Iscritto: 14 Giu 2005
Messaggi: 10181
Località: a cavallo del Ticino (fiume)
|
| Inviato: Gio 28 Ago, 2008 5:33 pm Oggetto: |
|
|
Secondo me per far sparire la banda bianca dovresti togliere la dichiarazione "margin: 0px auto"
da questa riga:
| Codice: | | div#container{width: 850px; margin: 0px auto; text-align: left; border-left: 0px; border-right: 0px} |
Ciao
_________________
|
|
Vai ad inizio pagina
Vai a fine pagina |
|
|
Italian Comrade
utente
Iscritto: 04 Nov 2007
Messaggi: 145
Località: Italia Centrale
|
| Inviato: Gio 28 Ago, 2008 6:19 pm Oggetto: |
|
|
Dai quello stesso colore di sfondo al BODY !!!!!!!!!!!!!!!!!!!!!!!!!!!!
| Codice: | | <body bgcolor=""> |
o nel CSS:
| Codice: | body {
background-color: ;
} |
inssieme agli altri che probabilmente accompagnano il body CSS (non sono andato a vedere il tutto ...).
|
|
Vai ad inizio pagina
Vai a fine pagina |
|
|
marcoz71
utente attivo
Iscritto: 02 Set 2006
Messaggi: 7647
Località: la piccola Confoederatio Helvetica
|
| Inviato: Gio 28 Ago, 2008 9:29 pm Oggetto: |
|
|
| Italian Comrade ha scritto: | Dai quello stesso colore di sfondo al BODY !!!!!!!!!!!!!!!!!!!!!!!!!!!!
| Codice: | | <body bgcolor=""> |
o nel CSS:
| Codice: | body {
background-color: ;
} |
inssieme agli altri che probabilmente accompagnano il body CSS (non sono andato a vedere il tutto ...). |
già c'è nel CSS... strano...
se poi apro il sito su una finestra non a tutto schermo capita la stessa cosa, ma come clicco sul bordo per ridimensionare la finestra, quella banda bianca si colora magicamente del colore voluto... bohhhhh... misteri...
nel body della pagina vorrei evitare ogni tipo di formattazione, così in futuro se voglio cambiare stile/colori il tutto lo gestisco unicamente con il foglio di stile CSS, uno e unico per tutto il sito...
_________________
MarcoCanon EOS 6D+40D+350D+3 e un po' di vetri |
|
Vai ad inizio pagina
Vai a fine pagina |
|
|
marcoz71
utente attivo
Iscritto: 02 Set 2006
Messaggi: 7647
Località: la piccola Confoederatio Helvetica
|
| Inviato: Gio 28 Ago, 2008 9:30 pm Oggetto: |
|
|
| FotoFaz ha scritto: | Secondo me per far sparire la banda bianca dovresti togliere la dichiarazione "margin: 0px auto"
da questa riga:
| Codice: | | div#container{width: 850px; margin: 0px auto; text-align: left; border-left: 0px; border-right: 0px} |
Ciao |
se ben ricordo quel comando devo lasciarlo per IE, altrimenti la pagina non viene centrata...
_________________
MarcoCanon EOS 6D+40D+350D+3 e un po' di vetri |
|
Vai ad inizio pagina
Vai a fine pagina |
|
|
Neo_82
utente
Iscritto: 24 Mgg 2004
Messaggi: 487
Località: Catania
|
| Inviato: Ven 29 Ago, 2008 10:39 pm Oggetto: |
|
|
Grazie 
_________________
Sony A700 - Minolta Dynax 5 - KM 17-35 f2,8-4 D - KM 28-75 f2,8 D - KM 50 f1,7 - KM 70-210 f4 Beercan - KM 75-300 f4,5-5,6 Big Beercan - Cosina 100 f3,5 - Flash KM 2500D -::- Fuji S5000
<<Tutto ciò che passa non è che immagine>> [Goethe] |
|
Vai ad inizio pagina
Vai a fine pagina |
|
|
|
Home
Forum
Fotografie
Le mie foto
Cerca
Utenti
Regolamento
FAQ
MP
Iscrizione
Login
