iWeb è un programma web-publishing sviluppato da Apple che permette di creare layout utilizzando il metodo drag-and-drop. Non è necessario essere fluente in programmazione per fare un sito web di base, perché iWeb genera il codice HTML automaticamente. Tuttavia, è necessario apportare modifiche al codice, se si desidera aggiungere dettagli al tuo sito web, come ad esempio una lightbox, un modo creativo per visualizzare una singola immagine o una galleria di immagini utilizzando il programma di iWeb.

istruzione

1 Mettere le immagini che si desidera aggiungere al tuo sito web sul desktop per rendere più facile trovarli.

2 Apri iWeb. Aprire una nuova pagina vuota. Il nome "Galleria".

3 Modificare le dimensioni delle immagini in miniatura. Disporre le immagini sulla pagina.

4 Apri "ispettore". Fare clic sulla scheda "Collegamento ipertestuale". Mettere un segno di spunta nella casella accanto a "Attiva come hyperlink". Scegliere "Un file" dalla casella a discesa accanto a "Link a". Fai clic su "Scegli" e selezionare la posizione della cartella deskop con le immagini. Aggiungere un collegamento ipertestuale a ogni immagine.

5 Pubblicare il sito iWeb nella cartella "Siti" nella directory "Home" sul computer per salvare le modifiche.

6 Scaricare il file "lightbox.zip" (vedi risorse) ed estrarre i file nel tuo sito web - non la pagina "Galleria" - cartella.

7 Pulsante destro del mouse sulla pagina "Galleria" e selezionare un editor di testo / HTML, come ad esempio TextWrangler, per aprirla.

8 Scorrere fino a </ head> e inserire il codice seguente nella riga sopra di essa:

<Link rel = "stylesheet" href = "/ lightbox.css lightbox" type = supporto = "screen" "text / css" />
<Script type = "text / javascript" src = "lightbox / lightbox.js"> </ script>

9 Scorrere verso il basso per onload = "onPageLoad ();" e inserire initLightbox () subito dopo il punto e virgola per farlo sembrare come questo:

onload = "onPageLoad (); initLightbox ()"

10 Scorrere verso il basso per i collegamenti di immagine, separati da <div> e seguito da <a href = "nomecartella / image_name.png", dove "nomecartella" e "image_name" visualizza la posizione ed il nome delle immagini. Aggiungere rel = "lightbox" che segue il codice immagine per farlo sembrare come questo:

a href = "nomecartella / image_name.png" rel = "lightbox"

Continuare aggiungendo il codice per ogni link immagine.

11 Aggiungere un titolo a ciascuna immagine per immagine su ogni link dove dice title = "...... per farlo sembrare come questo:

title = "Titolo d'immagine"

12 Salvare la pagina nel editor HTML. Aprire la cartella sito. Fare doppio clic sulla pagina "Galleria" per aprire nel browser e vedere i cambiamenti.