Menu a tendina per WordPress
![template Suckerfish [template Suckerfish]](/k-images/menuSuckerfish.jpg)
Se usate il plugin WordPress Menubar potete facilmente costruire dei menu dropdown, o a tendina, usando il template Suckerfish.
Il template Suckerfish (Download) si chiama così perchè è realizzato seguendo i due articoli ormai celebri che spiegano come realizzare menu dropdown accessibili, leggeri, conformi agli standard e compatibili con i vari browser. Ve li ricordo:
- Suckerfish Dropdowns (Patrick Griffiths, Dan Webb)
- Son of Suckerfish Dropdowns (Patrick Griffiths, Dan Webb)
Il template Suckerfish utilizza una sola immagine, per l’ombra sotto la barra orizzontale, e poche righe di JavaScript che gli consentono di funzionare anche con IE. Se JavaScript è disabilitato, il dropdown non funziona in IE, ma continua a funzionare negli altri browser provati (Firefox e Opera).
Come sempre è possibile personalizzare l’aspetto del menu modificando il foglio di stile del template, e cambiare dimensioni, colori, font, bordi, margini del menu per sintonizzarlo perfettamente con il design del vostro sito.
Buona personalizzazione!

Posted December 9, 2007
Comments: 40
Scusa il disturbo, vedo sei un esperto… da qualche giorno nel mio blog wordpress non mi fa più modificare la sidebar… non solo se aggiungo e salvo codici di widget non me li salva, ma neanche se li elimino… praticamente come se non mi salvasse più le modifiche che faccio… che succede?
Ciao Max,
nessun disturbo, i commenti sono aperti per questo
Prova a verificare se hai esaurito lo spazio per il database. Altrimenti prova a disattivare i plugin e vedi se la situazione torna normale. Se il problema persiste, suggerisco di chiedere una mano anche agli altri amici di WordPress Italy, http://www.wordpress-it.it/forum/
Sta tranquillo che troviamo una soluzione!
ciao andrea, sai cos’era? i permessi… così per caso ho provato nel mio hosting a riparare permessi di cartelle e file… e ora funziona… mah, chissà che era successo
Grazie dell’appoggio
Ciao andrea. complimenti per l’ottimo plug in. l’ho già installato e personalizzato
Dario
unica cosa che ancora mi sfugge è come fare per eliminare le pagine figlie-figlie dal menu …
quello che voglio dire è che vorrei che apparisse solo il primo livello di pagine figlie e non tutto l’albero.
come fare?
approfitto dell’occasione per augurarti buone feste.
ps il sito che sto mettendo su: http://www.annadevemorire.altervista.org
Ciao Dario,
ho inserito la risposta alla tua domanda nella nota in fondo all’articolo. Ti ricambio gli auguri di buone feste e buon anno!
Ciao Andrea. ho appena modificato opportunamente il file incriminato
adesso funziona proprio come volevo.
grazie per la dritta.
Di nuovo auguri di buon anno!
Dario
Ciao Andrea. Davvero un bel plugin. Complimenti
Ho un problema con questo template. Quando lo attivo, nella home appare questo:
http://img171.imageshack.us/img171/4117/bar2jn6.png
al posto del menù in immagine.
Ciao e grazie
Ciao Ubu4ever,
ti ho inviato via mail alcuni suggerimenti, fammi sapere se la situazione migliora!
Grazie 10 000 andrea
Tutto ok
Grazie ancora (sia per il plugin sia per l’aiuto)
Ciao
innanzitutto complimenti per il lavoro e la professionalità!
Stavo cercando un modo per inserire nel mio nuovo sito che sto creando con WP, un menu a tendina.
Ho scaricato il plugin Menubar 2.2, ho inserito attraverso questo plugin il menu principale (basato su pagine), commentando il menu che avevo creato precedentemente.
Ora però mi trovo in difficoltà, perchè non capisco come gestire il menu di secondo livello.
semplifico con un esempio, puramente fittizio.
Il menu è fatto da queste pagine:
HOME, PAGINA1, PAGINA2, … PAGINA7
Per PAGINA2 prevedo 3 ’sottopagine’
Pagina2-a, Pagina2-b, Pagina2-c
Ho già creato queste pagine dal pannello di amministrazione, ma come faccio ora a riportarle nel menu?
Ho inserito anche i codici che riporti sopra nell’articolo nel file wpm.php
ti ringrazio in anticipo per l’aiuto!
Ciao Emanuela,
il menu a tendina per il momento è disponibile solo con il template Suckerfish. Ti basta scaricarlo, installarlo ed attivarlo seguendo le istruzioni (vedi “Come usare i template di menu“) e le tendine verranno visualizzate automaticamente. Forse non hai attivato Suckerfish? Fammi sapere!
Ciao Andrea,
complimenti per il bellissimo plugin.
Ho dei problemi con la visualizzazione delle categorie e spero tu possa darmi qualche suggerimento.
Ho creato un “albero” di categorie: cat.A (livello 1), cat.B (sottocategoria di A), cat.C (sottocategoria di B), cat.D (sottocategoria di B).
In una voce del menu, scegliendo come tipo “Category” e segnalando come “ID della categoria” l’ID di cat.B, mi aspetto che mi si apra una tendina con due elementi: cat.C e cat.D, giusto?
Invece continua a comparire solo “nessuna categoria”
Cosa sbaglio?
Grazie e ancora complimenti.
Ciao Fil,
prova ad inserire dei post nelle sottocategorie, altrimenti WordPress non le visualizza. Buon lavoro!
grazie per aver creato un menù bar a tendina ho un problema con il tema kubrick che uso perchè mi occorre una testata personalizzabile per inserire un logo specifico il menù diventa di un colore violaceo fastidiosissimo puoi aiutarmi ciao e grazie Silvia
Ciao Silvia,
se apri il file wp-content/plugins/menubar/Suckerfish/wpm.css puoi trovare (e cambiare) tutti i colori del menu. Ad esempio il colore #1874CD è il colore di sfondo, #2EB0FF è il colore del bordo superiore, e così via.
Ciao Andrea,
stavo provando a installare WP 2.5 riportandomi tutti i plugin utilizzati… ma la menubar mi genera un errore strano in testa alla pagina del blog e anche nelle pagine di amministrazione relative alla gestione della menubar.
Ecco l’errore:
Warning: Invalid argument supplied for foreach() in /nomesito/wp-includes/wp-db.php on line 556
Spero possa esserti utile nel caso tu voglia lavorarci.
Ciao a tutti!
Grazie della segnalazione, ti faccio sapere qualcosa al più presto. Ciao!
Ciao Andrea, sempre io…
volevo sapere se c’era un modo per rendere non cliccabile un pulsante del menu che abbia delle sottocategorie (ovvero che presenti l’effetto dropdown).
Ci sto provando ma non mi viene nulla in mente…
Grazie e ciao!
Ciao Fil,
la cosa che chiedi non c’è ancora, ma la sto aggiungendo per la prossima versione, Menubar 3.0 beta 5. Ciao!
Lo so, rompo sempre troppo…
Grazie ancora cmq!
Ciao Andrea!
Ti scrissi tempo fa per alcuni problemi che avevo con il menu, (all’epoca, il sito era http://thelword.hostsnake.com, adesso ho cambiato servizio di hosting perchè avevo problemi di accessibilità: lentezza incredibile, a volta non si apriva nemmeno, e simili). Ho installato wordpress 2.5 e caricato il la versione del menu 3.0 beta 4, visto che quella che avevo prima non era compatibile con quest’ultima versione di wordpress.
Ma, quando provo ad inserire il menù. ottnego questo messaggio di errore:
“Warning: include() [function.include]: open_basedir restriction in effect. File(/wpm3.php) is not within the allowed path(s): (/tmp/:/users/t/h/e/thelword/public_html/) in /users/t/h/e/thelword/public_html/wp-content/plugins/menubar/wpm-main.php on line 151
Warning: include(/wpm3.php) [function.include]: failed to open stream: Operation not permitted in /users/t/h/e/thelword/public_html/wp-content/plugins/menubar/wpm-main.php on line 151
Warning: include() [function.include]: open_basedir restriction in effect. File(/wpm3.php) is not within the allowed path(s): (/tmp/:/users/t/h/e/thelword/public_html/) in /users/t/h/e/thelword/public_html/wp-content/plugins/menubar/wpm-main.php on line 151
Warning: include(/wpm3.php) [function.include]: failed to open stream: Operation not permitted in /users/t/h/e/thelword/public_html/wp-content/plugins/menubar/wpm-main.php on line 151
Warning: include() [function.include]: Failed opening ‘/wpm3.php’ for inclusion (include_path=’.:/usr/share/php:/usr/share/pear’) in /users/t/h/e/thelword/public_html/wp-content/plugins/menubar/wpm-main.php on line 151″ dove vorrei che apparisse il menu.
Hai qualche suggerimento? Io non so davvero dove mettere le mani…
Ciao Chiara,
ho appena rilasciato la versione 2.3 di Menubar, che funziona anche con WordPress 2.5 ma per il resto è identica alla precedente versione 2.2.
Se vuoi provarla, potrebbe risolvere il tuo problema; se invece non lo risolvesse, fammelo sapere così approfondisco l’indagine. Il link per scaricare il plugin è sempre nella pagina Download.
Ciao Andrea,
ho scaricato la versione 2.3 ma, purtroppo, ci sono dei problemi con l’hosting che sto usando, probabilmente il retaggio dell’ultima manutenzione ai server che hanno fatto il 2 maggio.
Non ho potuto controllare prima se avessi o meno risposto al messaggio, quindi sono bloccata. Ci sono sia problemi d’accesso via FTP che problemi via pannello di controllo, (fa vedere tutto bianco, come se non esistessero cartelle o files, benchè il sito sia visibile).
Non appena sarò in grado di uploadare la nuova versione, ti farò sapere ^_^
Intanto grazie per la risposte e un’ultima domandina: visto che avevo già adattato il template suckerfish al template del sito, che non ho cambiato, ci sono problemi? Nel senso, posso utilizzarlo con le modifiche che ho già fatto, oppure devo riadattarlo? Grazie ancora ^_^
Ciao Chiara,
se passi a Menubar 3.0 dovrai riadattare il CSS di Suckerfish, ma l’operazione non è difficile perchè il CSS originale per la versione 3.0 è quasi identico a quello della versione 2.x.
Fammi sapere come procedi con l’hosting!
Ciao Andrea, è inutile farti i complimenti tanto sai che ti seguo e uso le tue utilità per i miei siti.
Volevo solo dirti, ma magari già lo sai, che ho usato la versione 2.3 del tuo plugin menubar con WP 2.5.1 e mi ha dato dei problemi, nel senso che non riuscivo ad accedere ai sotto menu di suckerfish, quando passavo sulla voce mi si apriva il sotto menu ma poi non riuscivo a cliccare niente perchè spariva.
Ho risolto tutto utilizzando la beta6 di menubar 3!
Continua così perchè fai dei lavori davvero ottimi.
Ciao,
ti premetto che non sono un esperto della materia.
Ho installato il tuo plugin con il template Suckerfish. Va tutto bene, solo ho un problema: il menu dovrebbe scorrere verso l’alto. Come posso fare?
Grazie
Ciao atletico,
non sono sicuro che si possa fare quello che chiedi, avrò bisogno di qualche giorno per studiare il problema. A presto!
grazie per la risposta, spero che tu riesca a risolvermi questo problema.
grazie ancora.
Ciao Andrea,
volevo chiederti una cosa: siccome i menu’ a tendina non sono propriamente “accessibili” per la Legge Stanca presumo perche’ da qualche parte sicuramente qualche browser fara’ casino; quindi avevo pensato ad un menù su due righe dove nella seconda riga comparissero gli items di una voce di menu’ della prima riga….come se fossero dei sottomenu’…magari è possibile con uno di questi template?…
Intanto complimenti per il plugin, e’ molto interessante!
Grazie!
Ciao, Luigi
Ciao Luigi,
ci sto lavorando, ma non sono ancora riuscito ad ottenere il risultato voluto. Resta sintonizzato!
Ciao Andrea,
inserisco un commento a questo tuo utilissimo post poichè il problema che mi capita sui browser riguarda i menù a tendina anche se uso un mio template. Sul mio giornale, il quale link ho indicato sul commento, succede questo:
Ho fatto impostare i menù a tendina in automatico a wordpress inserendo delle categorie figlie all’interno di macro-categorie per evitare il sovrappopolamento della subnav però capita una cosa strana che non sono riuscito a risolvere neanche lavorando su margin o padding.
In pratica su firefox funziona benissimo su ie invece funziona tutto tranne l’home-page che in pratica oltre a visualizzarsi tutta spostata a sinistra e fuori sfondo non da la possibilità di visualizzare i menù a tendina.
Da cosa può dipendere?
Spero puoi darmi una mano.
Saluti
Jerry
Ciao Jerry,
lo spostamento dell’intera pagina e il problema col menu potrebbe essere dovuto a qualche modifica che hai apportato al tema, si dovrebbe ripartire dall’originale e verificare, con una modifica per volta, quale modifica non funziona. Se poi è proprio l’originale che non funziona, meglio segnalarlo all’autore del tema che così potrà rimediare.
In bocca al lupo per il tuo giornale!
salve andrea
grazie per menubar!
ho provato a modificare il css per creare dei menu “dropUP” anzichè dropdown.
un po’ a tentoni, ma ci sono riuscito.
guardando il codice però non mi riesco a spiegare le seguenti duplicazioni di dichiarazione per uno stesso elemento:
.sf-vertical ul ul {
top: 26px;
position: absolute;
left: -999em;
width: 170px;
margin: 0;
padding: 0;
}
.sf-vertical ul ul {
margin: -26px 0 0 170px;
}
.sf-vertical li {
float: left;
padding: 0;
height: 26px;
position: relative;
}
.sf-vertical li {
float: left;
padding: 0;
width: 170px;
}
mi verrebbe da pensare che si poteva mettere tutto dentro a due sole dichiarazioni, o no?
magari la spiegazione mi porterà all’illuminazione del css ed entrerò nel nirvana del web…
cmq grazie e ciao
Ciao 1835,
hai perfettamente ragione, due regole CSS con lo stesso selettore possono essere fuse in una sola.
Il motivo di quella stranezza è che il CSS per il menu verticale deriva da quello orizzontale con poche modifiche, e una di quelle modifiche ha reso uguali due selettori che nel CSS originale erano diversi.
ciao andrea
grazie per la conferma qui su.
sono alle prese con un problema su IE: se provo ad attribuire a diversi elementi di lista classi diverse, in modo da ottenere comportamenti diversi (es: colori diversi per ogni elemento) pare che la classe .wpmhover ricordi solo l’ultima regola data nel foglio di stile. e addirittura la cosa agisce anche se abbiamo due menù completamente diversi. è come se a .wpmhover non interessasse a quale classe applicarsi…
può essere?
mille grazie e ciao
Quando c’è di mezzo IE tutto è possibile
Comunque per capirci qualcosa ho bisogno di vedere il sito con il problema, se non vuoi mettere l’indirizzo nei commenti puoi inviarmelo per e-mail.
Ciao!
ciao
sì anch’io sono un grande fan dei colpi di scena di IE.
il sito eccolo qua: http://www.rottelocali.it/wordpress/
non so cosa vedrai nel momento in cui lo visiti, perché ci sto lavorando, comunque il problema qua sopra l’ho aggirato inserendo per ogni un identificatore anziché una classe.
sempre grazie!
Ora che me lo dici mi è tornato in mente che IE gestisce solo una classe per ogni elemento, o qualcosa del genere, e quindi bisogna ricorrere agli id per differenziare gli elementi tra loro.
Complimenti e in bocca al lupo per il sito!
Ciao, avrei una domanda da porvi per un menu a tendina (uso wordpress da pochissimo, abbiate pietà di me!). Utilizzo come template Azul 1.1, ho creato alcune pagine madri con diverse sottopagine per ognuna di esse (anche a più di due livelli); è possibile creare dei menu a tendina per rendere la navigazione più semplificata? E comeee?
Paolo,
ti suggerisco di seguire le istruzioni contenute in http://www.dontdream.it/come-usare-wp-menubar-30
Se trovi delle difficoltà, fammi sapere dove ti sei bloccato. Ciao!