15 gennaio 2010

Come inserire un menù orizzontale a tendina in un blog.

Nella mia continua insoddisfazione del modello e delle funzionalità di questo blog mi sono trovato a sperimentare una gran quantità di widget, di personalizzazioni e, soprattutto, di menù. Partendo dal Chrome Drop Down Menù e stimolato da un commento di un lettore mi sono deciso a provare anche questo menù orizzontale a tendina che potete vedere all'opera nel mio blog di demo (solo in una pagina).
Non sto a tediarvi con particolari tecnici, ma mi limito solo a mostrare il procedimento di installazione. Andare su Layout > Modifica HTML e dopo aver salvato il modello completo cercate la riga
</head>
e, immediatamente sopra, incollate il seguente codice
<!-- Inizio Menu Chrome -->
<link href='http://sites.google.com/site/ideepercomputeredinternet/script-1/chrome11.css' rel='stylesheet' type='text/css'/>
<script src='http://sites.google.com/site/ideepercomputeredinternet/script-1/chrome11.js' type='text/javascript'>
</script>
<noscript><a href='http://goo.gl/GnRP' target='_blank'><span style='font-size: x-small;'>Menu Orizzontale</span></a></noscript>
<!-- Fine Menu Chrome -->
quindi andate a fondo pagina e prima della riga </body>, incollate quest'altro blocco di codice
<script type='text/javascript'>
    cssdropdown.startchrome(&quot;chromemenu&quot;)
    </script>
Salvate il modello. Adesso lo script e lo stile del menù sono pronti non vi resta che personalizzarlo. Mi limito a incollare il codice che ho inserito nel mio blog con alcune considerazioni




<div id="chromemenu" class="chromestyle">
<ul>
<li><a href="http://www.ideepercomputeredinternet.com" rel="dropmenu1">Home</a></li>
<li><a href="#" rel="dropmenu2">Risorse Blogger</a></li>
<li><a href="#" rel="dropmenu3">Widget e Menù</a></li>
<li><a href="#" rel="dropmenu4">Eros e Videochat</a></li>
<li><a href="#" rel="dropmenu5">Streaming</a></li>
<li><a href="#" rel="dropmenu6">Effetti</a></li>
<li><a href="#" rel="dropmenu7">Giochi</a></li>
<li><a href="#" rel="dropmenu8">Altro</a></li>
</ul>
</div>
<!--1st drop down menu -->                                                  
<div id="dropmenu1" class="dropmenudiv">
<a href="http://www.blogger.com/profile/03393759575661143644" target="_blank">Profilo su Blogger</a>
<a href="http://it-it.facebook.com/parsifal32" target="_blank">Aggiungimi su Facebook</a>
<a href="http://twitter.com/parsifal32" target="_blank">Aggiungimi su Twitter</a>
<a href="http://friendfeed.com/parsifal32" target="_blank">Seguimi su Friendfeed</a>
<a href="http://parsifal32.stumbleupon.com/" target="_blank">Aggiungimi su StumbleUpon</a>
<a href="http://parsifal32.tumblr.com/" target="_blank">Seguimi su Tumblr</a>
<a href="http://www.mybloglog.com/buzz/community/ideepercomputeredinternet/" target="_blank">Seguimi con MyBlogLog</a>
<a href="http://
www.ideepercomputeredinternet.com/2008/01/messaggi-dei-lettori.html">Modulo per contattarmi</a><a href="http://
www.ideepercomputeredinternet.com/2009/03/tutti-i-blogger-che-usano-adsense-sono.html">Norme sulla Privacy</a></div>
<!--2nd drop down menu -->                                               
<div id="dropmenu2" style="width: 180px;" class="dropmenudiv">
<a href="http://www.ideepercomputeredinternet.com/2008/12/come-creare-un-blog-con-pochi-click.html">Crea blog </a>
<a href="http://www.ideepercomputeredinternet.com/2008/12/come-iniziare-un-blog-e-cosa-fare-nel.html">Che fare nel 1° mese</a>
<a href="http://www.ideepercomputeredinternet.com/2009/02/le-55-cose-da-sapere-per-creare-gestire.html">96 risorse Blogger</a>
<a href="http://www.ideepercomputeredinternet.com/2009/07/altre-16-risorse-per-blog-su-blogger.html">99 risorse Blogger</a>
<a href="http://www.ideepercomputeredinternet.com/2009/12/14-post-utili-migliorare-un-blog-su.html">Altri post su Blogger</a>
<a href="http://www.ideepercomputeredinternet.com/2009/01/la-pi-grande-collezione-di-template-e.html">Collezione di modelli</a>
<a href="http://www.ideepercomputeredinternet.com/2009/07/come-inserire-emoticon-animate.html">Guadagnare con blog</a>
<a href="http://www.ideepercomputeredinternet.com/2009/06/tutto-quello-che-serve-sapere-per.html">Animoticon</a>
<a href="http://www.ideepercomputeredinternet.com/2009/07/come-crearsi-una-rendita-mensile-di.html">Guadagnare 1000€ al mese</a>
</div>
<!--3rd drop down menu -->                                                  
<div id="dropmenu3" style="width: 180px;" class="dropmenudiv">
<a href="http://www.ideepercomputeredinternet.com/2009/04/ho-cambiato-il-codice-per-inserire-gli.html">Ultimi Articoli</a>
<a href="http://www.ideepercomputeredinternet.com/2009/04/ho-riadattato-il-widget-degli-ultimi.html">Ultimi Commenti</a>
<a href="http://www.ideepercomputeredinternet.com/2009/11/come-inserire-un-widget-di-benvenuto-in.html">Widget di Benvenuto</a>
<a href="http://www.ideepercomputeredinternet.com/2010/01/come-inserire-il-widget-degli-ultimi.html">U. A. con miniature</a>
<a href="http://www.ideepercomputeredinternet.com/2009/12/il-fantastico-widget-dell-con-il.html">Archivio con Calendario</a>
<a href="http://www.ideepercomputeredinternet.com/2010/01/il-widget-degli-articoli-correlati-con.html">Articoli simili con M.</a>
<a href="http://www.ideepercomputeredinternet.com/2010/01/come-inserire-il-widget-degli-ultimi_07.html">U. A. per etichetta</a>
<a href="http://www.ideepercomputeredinternet.com/2010/01/come-inserire-nel-blog-il-widget-degli.html">U. A per categoria</a>
<a href="http://www.ideepercomputeredinternet.com/2010/01/come-inserire-il-widget-degli-ultimi_04.html"> U. A in verticale</a>
</div>
<!--4th drop down menu -->                                                  
<div id="dropmenu4" style="width: 180px;" class="dropmenudiv">
<a href="http://www.ideepercomputeredinternet.com/2008/01/ecco-dove-puoi-trovare-amicizia-amore-e.html">Incontri & Eros</a>
<a href="http://videoblog32.blogspot.com/" target="_blank">Videochat Gratis</a>
<a href="http://www.ideepercomputeredinternet.com/2008/10/ciaoamigos-la-videochat-pi-frequentata.html">Ciao Amigos</a>
<a href="http://www.ideepercomputeredinternet.com/search/label/videochat">Le videochat di tutto il mondo</a>
</div>
<!--5th drop down menu -->                                                  
<div id="dropmenu5" style="width: 150px;" class="dropmenudiv">
<a href="http://www.ideepercomputeredinternet.com/2009/03/worldlive-tv-per-vedere-gratis-partite.html">WorldLiveTv per TV P2P</a>
<a href="http://www.ideepercomputeredinternet.com/search/label/televisione">Tutto sulle televisioni</a>
</div>
<!--6th drop down menu -->                                                  
<div id="dropmenu6" style="width: 150px;" class="dropmenudiv">
<a href="http://.com/2008/12/effetti-neve-e-foglie-che-cadono-per-il.html">Effetto neve che cade</a>
<a href="http://www.ideepercomputeredinternet.com/2009/01/cuoricini-animati-che-cadono-da-mettere.html">Effetto cuoricini</a>
<a href="http://www.ideepercomputeredinternet.com/2009/07/come-ingrandire-le-immagini.html">Effetto Expando</a>
<a href="http://www.ideepercomputeredinternet.com/2009/10/ripristinato-l-sfoglia-pagina-con-un.html">Effetto Sfoglia Pagina</a>
<a href="http://www.ideepercomputeredinternet.com/2009/11/come-inserire-un-effetto-multicolore-ai.html">Effetto multicolore</a>
</div>
<!--7th drop down menu -->                                               
<div id="dropmenu7" style="width: 150px;" class="dropmenudiv">
<a href="http://www.ideepercomputeredinternet.com/2008/01/gioca-gratis-piu-di-dodicimila-giochi.html">12.000 Giochi gratis</a>
<a href="http://www.ideepercomputeredinternet.com/2009/04/friv-per-giocare-gratis-online-piu-di.html">Gioca con Friv</a>
</div>
<!--8th drop down menu -->                                                  
<div id="dropmenu8" style="width: 150px;" class="dropmenudiv">
<a href="http://www.ideepercomputeredinternet.com/2009/09/come-installare-wordpress-in-un-dominio.html">Installare Wordpress</a>
<a href="http://www.ideepercomputeredinternet.com/search/label/wordpress">Risorse Wordpress</a>
<a href="http://www.youtube-video-it.com/" target="_blank">I migliori video di Youtube</a>
<a href="http://www.ideepercomputeredinternet.com/2008/01/invia-sms-gratis-in-tutta-italia.html">Invia SMS gratis</a>
</div>
Si possono costruire menù con tutte le sezioni che si vogliono, è solo un problema di spazio. Ho creato 8 voci principali che sono quelle che si vedono in grassetto nel primo blocco di codice. Se si volessero diminuire basta togliere le righe del tipo


<li><a href="#" rel="dropmenu6">Effetti</a></li>
e lasciare il numero che ci serve. Analogamente si possono inserire altre voci se si ha un modello molto largo o se si vuole mettere il menù in tutta la larghezza della pagina. In questo caso bisognerà aggiungere la riga


<li><a href="#" rel="dropmenu9">Altra voce</a></li>
con numeri progressivi (9, 10, ecc.). Contestualmente alla eliminazione o all'aggiunta di nuove righe nel primo blocco di codice dobbiamo eliminare o aggiungere il relativo codice delle voci secondarie. Queste voci sono contraddistinte da commenti del tipo


<!--7th drop down menu --> 
e si possono togliere o aggiungere mantenendo la stessa sintassi. Bisogna considerare che ciascun menù si posizionerà sotto alla voce principale a seconda del numero presente dopo dropmenu, e deve esserci una corrispondenza tra i numeri della prima parte di codice e quelli delle altre sezioni.
Si può anche personalizzare la larghezza del sottomenù di ciascuna voce principale variando i numeri evidenziati di rosso accanto a width in ciascun blocco di codice.
In alcuni link oltre al tradizionale URL è presente anche la stringa target="_blank" che serve per far aprire la pagina in un'altra scheda. E' conveniente inserirla negli indirizzi che si riferiscono a un altro sito o che comunque fanno uscire il lettore dal blog.
Nelle voci principali ho inserito solo il collegamento alla Homepage mentre ho lasciato gli altri link vuoti. Se avete l'esigenza di collegare tali voci inseritene l'URL al posto del cancelletto (#) nel primo blocco di codice.
Non vi resta quindi che sostituire i nomi delle voci e i relativi URL a questo codice che serve esclusivamente da riferimento. Fatto questo andate su Layout > Aggiungi un gadget > HTML/javascript e incollatelo in Sezioni del sito senza inserire il Titolo
menù-tendina
Cliccate su Salva e andate su Layout > Elementi pagina dove, con il mouse, attraverso il drag & drop, posizionate il menù nel punto voluto
menù-orizzontale

Andate su Salva per l'ultima volta e verificate il funzionamento dei link delle voci che avete immesso. Al passaggio del mouse si evidenzierà la tendina verticale dei link che sono stati inseriti
menù-orizzontale-3
La voce puntata dal mouse assumerà una diversa colorazione. I più smanettoni possono ulteriormente personalizzare i colori del menù, quelli del colore di sfondo al passaggio del mouse, ecc. Devono scaricare il file chromestyle.css, aprirlo con un editor tipo Notepad++ e modificare i colori. Questo menù non è esclusivo di Blogger e può essere aggiunto anche a altre piattaforme come Splinder; l'ho testato con tutti i browser, compreso Internet Explorer 7 o superiori, e non dà problemi di sorta.

Aggiornamento: (02/01/2011) Ho realizzato un menù di questo stesso tipo ma con i colori identici a quello in uso in questo blog. Si può trovare il codice nel post




91 commenti:

  1. Ottima guida, complimenti... Ma scusa non è meglio utilizzare con blogger il classico menù con le etichette?

    RispondiElimina
  2. @mondoinformatico
    Nei template originali di Blogger non sono previsti dei menù e il widget con le etichette è difficilmente gestibile se se ne hanno parecchie. In Blogger non esistono le categorie come in Wordpress :-(
    Usare questi menù è la soluzione più semplice a meno che non si abbia un modello personalizzato che lo preveda già.
    Ciao

    RispondiElimina
  3. Ciao...sono riccardo di Sport City. Ho seguito alla perfezione i vari passi per creare il menu a tendina per il mio blog e ci sono riuscito. ma l'unica cosa che non mi viene è il fatto di evidenziare la voce singola al passaggio del mouse...come mai?

    RispondiElimina
  4. @Riccardo Troiani
    Credo di aver capito a cosa ti riferisci. Vorresti che nello sfondo della voce secondaria evidenziata con il mouse comparisse un colore diverso come nel caso del mio blog?
    Se è così scarica il file che trovi qui
    http://sites.google.com/site/ideepercomputeredinternet/script-menu/chrome.css
    rinominalo in txt. Cambia il colore che c'è in fondo cioè al posto di
    background-color: #EBF7FF;
    metti per esempio
    background-color: #FDBCB7;
    come nel mio blog o un altro colore che si differenzi maggiormente.
    Rinomini il file di nuovo con estensione CSS, quindi lo carichi su un hosting che supporta gli script tipo Google Sites. Ne acquisisci l'URL e lo sostituisci nella prima riga del codice.
    Ciao

    RispondiElimina
  5. Ciao Parsifal, ti ho inviato una mail vorrei sapere dove sbaglio...please help me

    RispondiElimina
  6. @admin
    Il metodo di inserimento consiste nell'incollare del codice.
    La prima porzione prima di /head e
    un'altra prima di /body a fondo pagina.
    Quindi creare un elemento Javascript. Dimmi se inserendo il menù così come l'ho creato io lo vedi oppure no!
    Se non lo vedi hai sbagliato ad incollare il codice nel modello. Se invece lo vedi significa che sbagli a inserire il tuo menù.
    Può essere che il codice abbia superato il limite di banda consentito.
    Per rimediare a questa eventualità ho caricato gli script da un'altra parte. Se era questo il problema, ripetendo la procedura dovrebbe funzionare.
    Fammi sapere, ciao.
    P.S. Ho letto la tua email ma non avevo ancora letto questo commento quindi non sapevo a quale menù ti stavi riferendo

    RispondiElimina
  7. Ciao,
    ho aggiunto il menu nel mio blog : http://calcio-scommesse-diretta-streaming.blogspot.com
    Se apro con firefox ok ma se uso explorer da problemi e non capisco il motivo.
    Mi sapresti dire da cosa dipende?
    Grazie

    RispondiElimina
  8. @admin
    Ho visto che hai inserito la pagina di benvenuto, dipende da quella, visto che i problemi ci sono solo in homepage mentre per esempio in questo post
    http://calcio-scommesse-diretta-streaming.blogspot.com/2010/03/milan-pato-fermo-una-settimana.html
    il menù funziona perfettamente anche con IE.
    Ciao

    RispondiElimina
  9. Grazie,
    in effetti ho provato a togliere il mess di benvenuto e funziona.
    Ho notato che su IE il mess di benvenuto blocca l'apertura di tutti gli elementi della pagina che gli stanno sotto. Infatti se lo metto in basso la pagina si apre tutta ma la barra orizzontale proprio non va.
    Peccato perche avrei voluto tenerli entrambi. Se proprio non c'è soluzione provero l'altro modello di menu che hai.
    Ciao

    RispondiElimina
  10. @admin
    Il fatto è che anche i modelli sono basati su degli script.
    In linea di massima non è che la pagina di benvenuto è il menù siano incompatibili in IE. Lo sono se associati agli altri script del tuo template.
    Più un modello è personalizzato più script ha e più sono difficili ulteriori personalizzazioni.
    Questo solo per dirti che, specie nel caso di IE, non si possono fare previsioni, si può solo provare, sperimentare e "sperare" che tutto funzioni al meglio.
    Ciao

    RispondiElimina
  11. non mi funziona :( ho provato anche a caricare il tuo menu... ma nulla xchè ? :(

    RispondiElimina
  12. @soffio di dea
    forse questo menù è stato installato da troppe persone quindi la larghezza di banda non è sufficiente. Ho caricato lo script da un'altra parte, prova adesso, dovrebbe funzionare. Se così non fosse significa che è incompatibile con il tuo modello.
    Ciao

    RispondiElimina
  13. riprovato... nn va, nn si vedono i sottomenu a discesa... pazienza :) ho optato x quello laterale... grazie cmnq :) kiss

    RispondiElimina
  14. Ciao Parsifal,
    innanzitutto volevo ringraziarti per questo tutorial, grazie al quale il mio blog ha finalmente il menù a discesa.
    Purtroppo sono riuscita a personalizzare solo i sottomenu, potresti spiegare più dettagliatamente come fare?
    Ti segnalo il blog in questione:
    http://gloryflower1.blogspot.com/

    Grazie ancora! :-))
    Gloria

    RispondiElimina
  15. @Gloria
    Ho visto che il menù lo hai inserito bene. Ad alcune voci hai messo i sottomenù ad altre no. Le personalizzazioni riguardano le aggiunte di nuove voci, mi pare sia spiegato abbastanza dettagliatamente nell'articolo; se sei più precisa... ^_^
    Ciao

    RispondiElimina
  16. Questo commento è stato eliminato dall'autore.

    RispondiElimina
  17. scusami, mi riferivo alla personalizzazione del colore della barra dei menu, poichè sono riuscita solamente a cambiare il colore dei sottomenu.
    Ciao :-)

    RispondiElimina
  18. @Gloria
    La cosa non è semplicissima. I creatori di questo menù hanno messo a disposizione 4 stili diversi che puoi trovare in questa pagina
    http://www.dynamicdrive.com/dynamicindex1/chrome/index.htm
    Puoi anche scaricare il file zip che contiene i CSS di tutti gli stili che si trova qui
    http://www.dynamicdrive.com/dynamicindex1/chrome/chromemenu.zip
    Il punto è che il menù, come avrai notato, non è un colore ma è una immagine. Puoi caricare quella che ti piace di più.
    Se vuoi conoscere il procedimento più nel dettaglio puoi leggere quest'altro post
    http://parsifal32.blogspot.com/2009/10/come-creare-chrome-drop-down-menu-un.html
    Ciao

    RispondiElimina
  19. Ciao parsi! Una domanda, spero tu possa rispondermi in fretta:
    Io voglio modificare le impostazioni come il colore le dimensioni e le spaziature con il foglio .css che hai linkato, però una volta modificato non so dove metterlo. Quindi la domanda è: dove lo metto?

    RispondiElimina
  20. @hogash
    Lo metti su Google Sites. Leggi come fare
    http://parsifal32.blogspot.com/2010/05/come-caricare-file-javascript-e-css-su.html
    Ciao

    RispondiElimina
  21. ciao parsifal .. ho fatto tutto e seguito scrupolosamente le tue indicazioni ma non mi funziona compaiono i vari menu film ecc ecc pero invece di aprirsi una volta posizionato col mause me li ritrovo gia tutti aperti i singoli gruppi in modo sparso allargandomi di sproposito la pagina ... questo template aveva gia un suddetto menu ma aime tocca oggi tocca domani ora non riesco piu a portarlo in origine o almeno creare altro menu ... se qualora vi fosse il codice gia nel template che stringa di referimento dovrei percorrere x riuscire ... ti ringrazio .. sandro

    RispondiElimina
  22. IL MENU ORIZZONTALE CHE HO INSERITO FA COMPARIRE I SOTTOMENU SCOSTATI VERSO IL BASSO...NON CAPISCO PERCHE'
    http://calcio-scommesse-diretta-streaming.blogspot.com
    HELP PLEASE

    RispondiElimina
  23. @admin
    Forse c'è un'incompatibilità con gli script del tuo modello. Se hai seguito correttamente tutte le istruzioni non vedo altra possibile causa

    RispondiElimina
  24. ho risolto scaricando un altro template differente dal mio avendo il menu a tendina .. ho prelevato i codici li ho inseriti nel mio template .. o inserito i collegamenti e va che e una bomba yuppyyyyyyyyyyyyyyyyy .. grazie ugualmente parsifal ...

    RispondiElimina
  25. IL MODELLO CHE USO E' UNO TRA QUELLI DI BLOGGER...LO FA CON TUTTI I MODELLI. LE ISTRUZIONI LE HO SEGUITE ALLA LETTERA.
    HO PROVATO A CREARE ANCHE UN NUOVO BLOG DI PROVA.

    RispondiElimina
  26. QUESTO E' IL NUOVO BLOG
    http://diretta-calcio-streaming.blogspot.com/

    RispondiElimina
  27. E' una cosa veramente strana perché come puoi vedere in questo blog funziona così come quello che ho messo in un altro blog.
    Può essere che con l'introduzione del Design Modelli sia cambiato qualcosa in Blogger.
    Prova ad inserire il javascript direttamente nel modello invece che su un hosting esterno seguendo le indicazioni di questo post
    http://www.ideepercomputeredinternet.com/2010/01/come-inserire-uno-script-di-un-menu-o.html
    Ciao

    RispondiElimina
  28. HO INSERITO GLI SCRIPT DEL MENU DIRETTAMENTE NEL MODELLO ORA NON APRE PIU LE TENDINE
    http://diretta-calcio-streaming.blogspot.com
    IN EFFETTI BLOGGER HA CAMBIATO QUALCHE COSA PERCHE ORA IL CAMPO TITOLO DEI GADGET E' DIVENTATO OBLIGATORIO...PUO DIPENDERE DA QUELLO?

    RispondiElimina
  29. Non credo dipenda da quello, anch'io ho dovuto togliere il widget dell'archivio con il calendario perché non funzionava più.
    Per me dipende dal nuovo Designer Modelli.
    Vogliono che si usi solo i loro tool, presumo... e rendono più difficile inserire altre personalizzazioni...

    RispondiElimina
  30. Ciao Parsifal32!
    Io ho seguito perfettamente le indicazioni per creare il menu orizzontale con i sottomenu a tendina. Funziona il tutto, ma non riesco solo a capire perchè la tendina non mi si apre esattamente sotto il suo menu, ma in un punto a caso in mezzo alla pagina del mio blog!! sai cosa potrei fare per risolvere? grazie

    RispondiElimina
  31. @BiO bserver
    E' un problema che si presenta in molti modelli come puoi leggere anche nei commenti precedenti. Come certo saprai queste personalizzazioni non è detto che funzionino perfettamente su tutti i template.
    Se non sei soddisfatto di questo menù puoi comunque provare quest'altro multilivello che è anche più funzionale
    http://www.ideepercomputeredinternet.com/2010/02/come-inserire-nel-blog-un-menu.html
    Ciao

    RispondiElimina
  32. Non mi compare il menu a tendina!!!
    ARGH!! perchè?
    in più se volessi posizionare il menu al centro come posso fare??
    grazie!!!
    http://provadoramarth.blogspot.com/

    RispondiElimina
  33. @Lepracauno
    Per posizionare il menù al centro non ci sono problemi. Devi aggiunger il tag (center) all'inizio del codice e (/center) alla fine prima di incollarlo in un elemento HTML/Javascript.
    Ovviamente al posto delle parentesi metti i segni di minore e maggiore che non possono essere inseriti nei commenti.
    Per quanto riguarda problemi di cattiva visualizzazione ti dico quello che ho già detto ad altri. Ogni modello fa storia a sé e quello che va bene per uno non va bene per un altro.
    Inoltre da un giorno all'altro può capitare che una personalizzazione non funzioni più. Dipende dalle continue modifiche che fanno quelli di Blogger e non ci possiamo fare molto.
    Ciao

    RispondiElimina
  34. parsifal32 sei veramente il top sta venendo fuori un lavorone.Grazie per la tua consulenza quando hai bisogno di qualsiasi cosa sul mio settore dello spionaggio www.spyproject.com fai un fischio sarai il benvenuto guarda tu stesso che barra dei menù http://spy-project.blogspot.com/ grazie ancora
    Gianfranco

    RispondiElimina
  35. Ciao, io ho un problema, il menu mi si apre in fondo alla pagina! Come posso risolvere?

    RispondiElimina
  36. @Mirko
    SE non ti funziona dipende dall'incompatibilità con qualche script del tuo modello e c'è poco da fare

    RispondiElimina
  37. Ciao, grazie per la risposta. Attualmente ho un modello classico di peterson con un'immagine in alto, apparte 2, 3 post non ho niente caricato. Si può scoprire qualche dettaglio sul mal funzionamento. Adesso con le nuove modifiche non mi apre le tendine.

    RispondiElimina
  38. Mirko anche a me succede la stessa cosa ! Hai risolto per caso ?

    RispondiElimina
  39. Ciao ho inserito il menu orizzontale a tendina, ma i vari sottomenu si aprono un pò più in baso rispetto al menù principale. Non sono aderenti. Cosa avrò sbagliato?

    RispondiElimina
  40. @Affari Nostri
    E' probabile che tu non abbia sbagliato nulla ma che sia solo un problema di modello. Se scorri i commenti vedrai che anche altri hanno lamentato il tuo stesso problema.
    Ciao

    RispondiElimina
  41. Ciao, mi chiedevo se fosse possibile creare un menù per un blog su piattaforma blogger come quello in alto di questo sito: http://it.beruby.com/

    Grazie per un eventuale risposta!

    RispondiElimina
  42. @Nerko
    Qualcosa di simile l'ho già presentato
    http://www.ideepercomputeredinternet.com/2010/11/megamenu-alternative-per-l-nei-diversi.html
    E' evidente che non si possono trasportare il Blogger tutti i plugin di Wordpress riguardo ai vari temi, ammesso che fosse possibile.
    Ciao

    RispondiElimina
  43. Ora controllo! Comunque ho provato a mettere questo menù ma non mi si apre la tendina, ho fatto tutto alla perfezione...uff

    RispondiElimina
  44. Ciao!Grazie mille per le tue guide e scusa se ti scrivo(ma giuro che ho perso il pomeriggio cercando un menu a tendina che vada con i nuovi modelli blogger)L'unico funzionante per il momento è solo il megamenu?
    Io l'ho provato..ma mi funzionano massimo 3 sottomenu...:(..
    Grazie In Anticipo per la risposta
    e complimenti per l'ottimo lavoro!

    RispondiElimina
  45. @EasyCheapy Staff
    Vedrò di presentarne qualche altro. E' comunque un problema trovare dei menù basati su javascript funzionanti con i nuovi modelli. Quelli a tendina sfruttano spesso la tecnologia JQuery che si adatta poco al Designer Modelli

    RispondiElimina
  46. Grazie!Ma non si può aggirare il problema diversamente?cioè non si può usare sui nuovi blog un vecchio modello "compatibile"?

    RispondiElimina
  47. @EasyCheapy Staff
    Non ci sono più a disposizione quelli ufficiali ma ci sono moltissimi template in rete che potrebbero essere compatibili con i menù
    http://www.ideepercomputeredinternet.com/2009/01/la-pi-grande-collezione-di-template-e.html

    RispondiElimina
  48. Ne ho visti parecchi ma non mi convince nessuno..anche perchè la maggior parte hanno già un menu e altre cose integrate nell'html e sono un po difficili da togliere..vorrà dire che aspetterò nella speranza di trovare un menù compatibile...se solo con il megamenu si potessero usare piu di 3 voci...In ogni caso ti ringrazio e aggiungo l'antipixel nel mio blog!(anche se non è famoso)

    RispondiElimina
  49. @EasyCheap
    Sto preparando due articoli su due menù in stile popup compatibili con i nuovi modelli e con Internet Explorer

    RispondiElimina
  50. Li aspetto con ansia!:) grazie mille!

    RispondiElimina
  51. Ciao ho inserito questo codice, ma ho dei problemi: prima di tutto non so come ma non viene già la tendina; in secondo luogo mi potresti suggerire un modo per cambiare il colore al passaggio del mouse.
    Per farlo ho seguito le tue prime indicazioni, poi ho copiato tutto il tuo codice e l'ho modellato a seconda dei miei link. Comunque, io avevo provato a copiare completamente il tuo codice, per vedere dove stava il problema, e quando passavo sopra con il cursore, la tendina risultava staccata dalla home o dalle altre.. veniva 10 cm più in basso. Grazie mille

    RispondiElimina
  52. Sono riuscita a creare il menu a tendina..però ho un problema quando si apre il menu a tendina le voci spuntano in basso..come mai??

    RispondiElimina
  53. @solofilm
    Se leggi i precedenti commenti è purtroppo un problema molto comune :(

    RispondiElimina
  54. @Ernesto T.ah ): grazie..puoi consigliarmi un altro menu a tendina orizzontale carino?

    RispondiElimina
  55. @solofilm
    Qui sotto ci sono tutti quelli che ho pubblicato
    http://www.ideepercomputeredinternet.com/2011/03/i-migliori-menu-per-blogger.html

    RispondiElimina
  56. domanda: esiste una lista di template testati che funzionano con questo codice? io l'ho installato, ma non si visualizzano le tendine...Grazie!

    RispondiElimina
  57. @Mario Alan
    Se non funziona puoi fare altri due tentativi
    1)Caricare i file javascript e CSS su DropBox invece che su Google Sites. Io non lo posso fare perché c'è un limite di banda. I file sono
    http://sites.google.com/site/ideepercomputeredinternet/script-1/chrome11.css e
    http://sites.google.com/site/ideepercomputeredinternet/script-1/chrome11.js
    2)Se hai un template nuovo, con il Designer Modelli puoi provare a seguire questa procedura
    http://www.ideepercomputeredinternet.com/2011/04/come-installare-i-menu-anche-nei.html

    RispondiElimina
  58. appena letto...grazie 1000 e complimenti

    RispondiElimina
  59. Salve a tutti e scusate la mia ignoranza:
    ho incollato le prime due parti del codice poi dopo
    aver salvato il modello non so come proseguire e dove incollare quella parte di codice con le voci di menù
    Risorse Blogger
    Widget e Menù
    ..
    mi sono spiegato ?

    RispondiElimina
  60. @robot grafica ...
    Devi andare su Design > Aggiungi un gadget > HTML/Javascript e incollarlo in Sezioni del sito. Clicchi su Salva e, con il mouse, trascini l'elemento pagina nel punto in cui vuoi visualizzare il menù.

    RispondiElimina
  61. il menù c'è ma è dietro ai post.. problemi di modello mi pare di aver capito ma come si può risolvere? c'è un modo per ottenere un semplice menù a tendina in questa stagione?

    RispondiElimina
  62. @robot ...
    Prova con qualcuno di questi
    http://www.ideepercomputeredinternet.com/search/label/menu
    alcuni sono semplici e basati solo su HTML e CSS

    RispondiElimina
  63. ciao, scusa se ti rompo, ma sono giorni che provo ad insierire un emnua tendina, ma niente. Faccio tutto quello che hai scritto, tra l'altro con una chiarezza impressionante, ma niente.
    In pratica mi appare il menu con tutte le voci principali. Quelle senza sottomenu si cliccano e si vedono bene, ma le due che prevedono i sottomenu niente. non si apre la tendina e nè mi fa cliccare. Questo è il codice che ho fatto seguendo le tue indicazioni, dandgli un'occhiata, potresti gentilmente dirmi se sbaglio qualcosa?

    Niente, non me lo mettere. provo a amndartelo via mail. Grazie!

    RispondiElimina
  64. @sarchy
    Significa semplicemente che il tuo modello è incompatibile con questo menù e allora non c'è nulla da fare. Puoi solo pensare di sceglierne un altro :(

    RispondiElimina
  65. Ho notato di passaggio il riferimento a "mybloglog", cui ero iscritta pure io : è ora di eliminare il codice tracciante o se ne serve in qualche modo Yahoo? Thanks.

    RispondiElimina
  66. @segniesogni
    Mi prendi alla sprovvista. Avevo inserito il widget di MyBlogLog ma è molto ormai che l'ho tolto. Non ho mai saputo di codici traccianti :)

    RispondiElimina
  67. Ho installato l'estensione Ghostery per Chrome, che mi ha segnalato questo track4.mybloglog....ho uno script dopo la fine di head e l'inizio di body, una riga, cancellato,segnalazione sparita. Ho provato questa estensione solo perchè negli Strumenti Webmaster ho troppi link da siti.com e la cosa mi secca, ma Ghostery non li vede.Ciao, alla prossima!

    RispondiElimina
  68. Ciao Ernesto, grazie per l'ennesimo gadget utile e magnificamente spiegato! Ho un piccolo problema: l'ho appena installato in questo blog: http://www.cooknbook.org/ ma come vedi il sottomenu non scompare: le voci restano lì fisse! sai dirmi cosa potrei fare? Grazie!

    RispondiElimina
  69. @sara b
    C'è poco da risolvere ... Se non hai sbagliato qualcosa significa che il tuo modello e questo menù non sono compatibili. C'è da dire che questo menù è di due anni fa. Con i nuovi modelli è più difficile trovare menù che funzionino.

    RispondiElimina
  70. Questo commento è stato eliminato dall'autore.

    RispondiElimina
  71. Ciao, scusa il disturbo ma ho provato a creare il drop down mwnù come hai scritto, però non riesco a visualizzare i sottomenù. mi potresti dare una mano per favore?

    RispondiElimina
  72. @Jojo
    Questo è un menù che è molto difficile installare. Per esempio nei nuovi modelli ho provato varie volte senza successo.
    Se poi hai un dominio personalizzato allora è ancora più complesso.
    Quello che ti posso consigliare è di scaricare questi due file CSS e JS
    http://sites.google.com/site/ideepercomputeredinternet/script-1/chrome11.css
    http://sites.google.com/site/ideepercomputeredinternet/script-1/chrome11.js
    che ho caricato su un mio account Google Sites e di caricarli su DropBox nella cartella Public
    http://www.ideepercomputeredinternet.com/2010/11/dropbox-per-condividere-file-con-piu.html
    quindi acquisiscine gli URL diretti e sostituiscili nella prima parte del codice

    RispondiElimina
  73. Buongiorno Parsifal,
    non finirò mai di ringraziarti per il tuo blog, ricco di consigli per inesperti come me. In assoluto il migliore e il più completo che ho trovato sul Web, sono riuscita a fare cose per me impensabili ;)

    Ho provato a creare il menù a tendina di questo post, ma quando salvo il tutto le voci mi compaiono separate dalle pagine statiche del blog. Ti faccio un esempio pratico: quando provo a creare il sottomenù della pagina "Home" e ad inserire le varie voci, dopo che ho salvato mi compaiono a destra nel blog la scritta Home e le scritte con le sottocategorie, come elementi separati e non facenti parte della pagine "Home".
    Significa che questo tipo di menù non è compatibile con il mio template o che sbaglio qualcosa? Qualche consiglio? (Io utilizzo il template di Blogger modello semplice

    RispondiElimina
  74. @Dieta e Dintorni
    Uno dei problemi di questo menù è che funziona solo su alcuni template. Puoi provare a utilizzare questa tecnica
    http://www.ideepercomputeredinternet.com/2011/04/come-installare-i-menu-anche-nei.html
    però bisogna stare attenti e salvare il modello.

    RispondiElimina
  75. Ho provato a seguire il tuo consiglio, però dopo che effettuo le modifiche preliminari suggerite nell'altro tuo post, quando visualizzo il blog la barra di navigazione risulta sparita e trasformata in un elenco verticale a parte.
    Cosa può significare?...

    RispondiElimina
  76. @Dieta e Dintorni
    Significa che ti devi rassegnare e puntare su un altro menù ;(

    RispondiElimina
  77. Ok, dopo numerosi tentativi mi sono arresa per quanto riguarda il menù a tendina.
    A questo punto, vorrei per lo meno creare qualche pagina statica con le 4 etichette più importanti del mio blog. Non sono riuscita a trovare sul tuo sito qualche articolo che trattasse questo argomento; è una cosa fattibile?

    RispondiElimina
  78. @Dieta e dintorni
    Le pagine statiche sono una cosa mentre le pagine delle etichette sono un'altra cosa. Puoi aggiungere alcune etichette al widget di Blogger delle pagine statiche usando questo semplice metodo
    http://www.ideepercomputeredinternet.com/2011/11/come-creare-un-menu-aggiungendo-link-al.html
    o in subordine quest'altro
    http://www.ideepercomputeredinternet.com/2011/02/come-aggiungere-link-al-widget-delle.html

    RispondiElimina
  79. Ottimo script...ma....come mai se passo sopra al menu l'elenco degli argomenti mi compare almeno 10 centimetri sotto?????

    RispondiElimina
    Risposte
    1. @Emiliano
      E' una cosa che hanno lamentato anche altri come puoi leggere nei commenti precedenti. Non ho una spiegazione ...

      Elimina
  80. Ciao ! Foese sono off topic...ma da qualche giorno, grazie ai tuoi post ( ho messo il tuo antipixel!) sto aggingendo sempre maggiori miglioramenti al mio blog...ma da ieri non mi rimanda più alla homepage clikkando sul titolo ( non appare neanche la "manina" ) cosa ho combinato ? :)

    RispondiElimina
    Risposte
    1. @FrancoFedails
      Se mi incolli l'URL del tuo blog posso dare uno sguardo. Comunque puoi risolvere semplicemente ricopiando e incollando nuovamente il codice

      Elimina
    2. Il problema è che non so che codice incollare ! ;)
      www.fedetails.net

      Elimina
    3. @FrancoFedetails
      Il codice del mio antipixel è questo

      <a href="http://www.ideepercomputeredinternet.com" title="Il blog dell'informatica" alt="idee per computer ed internet - logo"><img src="https://lh3.googleusercontent.com/-zOPhUYRfSyU/TgIe5Abst7I/AAAAAAAATkE/scwjhQHCTOU/antipixel%252520idee%252520per%252520computer.gif" /></a>

      E' visibile nella textarea a fondo pagina sulla sinistra

      Elimina
    4. Scusa forse mi sono spiegato male ! :)
      E' il titolo del mio blog ( Fedetails ) che non rimanda più alla homepage...non funziona più dopo che ho trafficato con i codici html...

      Elimina
    5. @FrancoFedetails
      Ho provato con Chrome e funziona benissimo sia cliccando sulla Home del menu sia sul titolo del blog (si vede anche la manina). Prova con un altro browser

      Elimina
  81. ho un problema ad inserire tutti i tuoi menu a tendina nel modello awesome di blogger..non si vedono i sottomenu, praticamente non permette di avere altri livelli..si può risolvere in qualche modo?

    RispondiElimina
    Risposte
    1. @# Il tuo sito principale è questo?
      http://pdozzano.blogspot.it/
      In questo caso vedo che hai inserito uno slideshow orizzontale Nivo Slider. Non so se lo hai preso da questo blog. E' probabile che questo crei incompatibilità con i menù che tenti di installare (ipotesi). C'è da dire che molti menù sono vecchi e da allora il codice di Blogger è cambiato parecchio. Prova anche con questo sistema
      http://www.ideepercomputeredinternet.com/2011/04/come-installare-i-menu-anche-nei.html

      Elimina

Non inserire link cliccabili altrimenti il commento verrà eliminato. Metti la spunta a Inviami notifiche per essere avvertito via email di nuovi commenti al post.