Uno dei modi più rapidi per aggiungere un menu comprimibile a un sito Web o blog è posizionare le voci di menu in un blocco div HTML. I web designer utilizzano contenitori div: due contengono più oggetti della pagina web. Blogger, il servizio di blog gratuito di Google, offre agli utenti la possibilità di incorporare nuovi widget nei loro blog. Aggiungendo un widget che supporta JavaScript è possibile includere un contenitore div che contiene un menu comprimibile che i visitatori del sito possono attivare.
1
Apri il browser e visita la tua pagina Blogger Dashboard. Questa pagina mostra un elenco dei tuoi blog.
2
Trova il link “Design” accanto a uno dei nomi del tuo blog e fai clic su di esso. Blogger ti porta alla pagina Modifica layout.
3
Trova il link “Aggiungi un gadget” sul lato destro della pagina. Fare clic e quindi fare clic su “HTML / JavaScript”.
4
Digita il seguente codice nella casella sotto l’etichetta “Contenuto”:
var toggledUp = true; funzione manageMenu (menu) {var listObject = document.getElementById (menu); if (toggledUp == true) {toggledUp = false; listObject.style.display = “blocco”; } else {toggledUp = true; listObject.style.display = “nessuno”; }} INSERISCI L’ETICHETTA DELL’URL QUI INSERISCI L’ETICHETTA DELL’URL QUI
Questo codice crea il tuo menu comprimibile. Hai solo bisogno di cambiare quattro cose in questo codice. Notare le due righe che contengono il testo “INSERT URL HERE”. Queste righe, nella parte inferiore del codice, creano i collegamenti del menu. Quando i visitatori del sito fanno clic su uno di questi collegamenti, i loro browser accedono all’URL specificato nel collegamento. Passa alla prima riga che dice “INSERISCI URL QUI” e sostituisci il testo con un URL che desideri aggiungere al menu. Sostituisci “INSERT URL LABEL HERE” con qualsiasi testo che ti piace che descriva l’URL. Potrebbe apparire una linea di esempio come mostrato di seguito:
Visita l’IRS
L’URL è “http://www.irs.gov” in questo esempio. Il testo dell’etichetta è “Visita l’IRS”. Passa alla riga successiva che dice “INSERISCI URL QUI” e aggiungi anche un URL e un testo descrittivo a quella riga per creare la tua seconda voce di menu.
5
Fare clic sul pulsante “Salva” per salvare le modifiche. Trova il pulsante “Salva” nella parte superiore della pagina Modifica layout. Fare clic su di esso, quindi fare clic su “Anteprima”. Blogger mostra il tuo blog live. Un nuovo menu a discesa appare nel pannello laterale. Il menu è compresso.
6
Fare clic sul pulsante “Attiva / disattiva menu” situato sotto il menu. Il menu si apre e visualizza i collegamenti aggiunti. Fare clic su uno dei collegamenti per accedere all’URL specificato nel codice HTML per il menu.