Pubblicato il 09/09/12 - aggiornato il  | 20 commenti :

Menù multicolore e multilivello per Blogger.

By con etichette , , , ,
Come creare un menù multilivello con schede a più colori per i blog su Blogger che funziona con tutti i browser.
Il sito Blogs.com ha un menù che è piuttosto originale visto che è su più livelli e quando si passa con il cursore sopra a un elemento del menù si visualizzano i sottomenù con un colore diverso a seconda dell'elemento che si è puntato con il mouse.

Questo tipologia di menù non mi sembra di averla mai presentata quindi penso di fare cosa gradita se lo aggiungo alla sequela dei tanti menù di cui mi sono occupato. Inoltre ho testato il menù su Chrome, Firefox e Internet Explorer senza avere alcun problema. Ho pubblicato in rete una sua demo

per dare una idea del suo funzionamento. L'installazione non presenta molte difficoltà ma visto che il menù viene a visualizzarsi proprio nella parte superiore del layout, sopra all'header, è consigliabile nascondere la Navbar di Blogger. Ecco una GIF animata del menù al passaggio del cursore

menu-multicolore

Per l'installazione dopo aver salvato il template si va su Modello > Modifica HTML > Procedi e si cerca la riga </head>. Subito sopra si incolla il seguente codice

<!-- Menu Multicolor Javascript Start -->
<script src='https://sites.google.com/site/scriptperilblog/javascript-2/jquery-pack-colourful1.js' type='text/javascript'/>
    <script src='https://sites.google.com/site/scriptperilblog/javascript-2/jcarousel-colourful1.js' type='text/javascript'> </script>
    <script src='https://sites.google.com/site/scriptperilblog/javascript-2/mt-colourful1.js' type='text/javascript'/>
<style>#navbar-iframe { display: none !important; }
.content-inner{margin-top:30px;}
</style><!-- Menu Multicolor Javascript End -->

dove, oltre ai javascript, è stato inserito anche il codice per nascondere la Navbar. Se non ce l'avete cancellate pure tutto il codice che va dai tag <style> a </style> compresi. Il valore 30px serve per allontanare il contenuto del blog dal menù multicolore. Tale valore positivo può essere messo anche negativo poi  modificato e calibrato in funzione dei singoli modelli. I file javascript sono stati caricati su Google Sites. Nel caso abbiate un blog con dominio personalizzato come è noto tali script non funzioneranno e dovranno essere caricati nella cartella Public di Dropbox o su Google Code. Per scaricare i file colorati di rosso basta incollarne l'URL nella barra degli indirizzi del browser e pigiare su Invio.

Adesso cercate la riga body {  che sarà l'inizio di un blocco di codice di questo tipo

body {
  font: $(body.font);
  color: $(body.text.color);
……
Incollate le due righe colorate di rosso in questo modo
body {
margin:0px
padding:0px;  font: $(body.font);
  color: $(body.text.color);
……

Ora è il momento di cercare la riga <body>, nei vecchi modelli, oppure la seguente

<body expr:class='&quot;loading&quot; + data:blog.mobileClass'>

nei nuovi template. Subito sotto a questa riga va incollato questo codice

<!-- MENU MULTICOLOR SU PIU LIVELLI INIZIO -->
<style>
.IPCEI-contenitore {
border: 1px solid #cfcfcf;
    background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgPaJkKw1UOrLOafkwBCrI6IJuhQ5qAPGXhyT5IS8CWyqYAN-eOihg2jDJq68JCLwlNfVhjEpUaFwyiVcpGAlbdysSCpVP-hAvsjuV9tIVhtDx4T0tst0WzfE-H_E6L5nkYIvbEyUtAXYVX/s34/menu-bg.png) bottom left repeat-x;
    position: relative;
      margin: 0;  padding: 0;
border: 1px solid #cfcfcf;
}
ul#nav {
    border-left: 1px solid #cfcfcf;
        border-right: 0px solid #cfcfcf;
    background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgPaJkKw1UOrLOafkwBCrI6IJuhQ5qAPGXhyT5IS8CWyqYAN-eOihg2jDJq68JCLwlNfVhjEpUaFwyiVcpGAlbdysSCpVP-hAvsjuV9tIVhtDx4T0tst0WzfE-H_E6L5nkYIvbEyUtAXYVX/s34/menu-bg.png) bottom left repeat-x;
    position: relative;
    font-size: 12px; font-family: helvetica, arial, sans-serif;
    list-style: none;  margin: 0 auto;  padding: 0;
    width:1000px;
}
#nav ul {
     margin: 0;    
}
:focus {
    outline: 0;
}
*html ul#nav { clear: both; height: 1%; }
ul#nav li a {
    display: block;
    float: left;
    text-transform: uppercase;
    font-weight: bold;
    line-height: 33px;
    padding: 0 13px 0 10px;
    color: #333;
    text-decoration: none;
    background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjDq5wsEDK-QbpvXWrUq9RGKNkHO3oZEmWAGJUtWESq8gUym5EGIRrHba_pp8B3G9fLdvChg9yzyvjDDiN2eJeVZDUIasZPELDa5VQh5j8gssjucVLBzGREiAZ0czZluoCpScuW9mttbCG/s26/menu-rl.png) right 2px no-repeat;
}
*html ul#nav li.top-link { float: left; margin: 0px 0 -13px 0; padding-top: 2px; }
*:first-child+html ul#nav li.top-link { float: left; margin: 0px 0 -13px 0; padding-top: 2px; }
ul#nav li a:hover, ul#nav li a.open { color: #fff; }
ul#nav li#ipcei a:hover, ul#nav li#ipcei a.open { background: #0f1f37; }
ul#nav li#link-entertainment a:hover, ul#nav li#link-entertainment a.open { background: #b70943; }
ul#nav li#link-news a:hover, ul#nav li#link-news a.open { background: #cf3c02; }
ul#nav li#link-life a:hover, ul#nav li#link-life a.open { background: #724375; }
ul#nav li#link-technology a:hover, ul#nav li#link-technology a.open { background: #02b0cf; }
ul#nav li#link-top10 a:hover, ul#nav li#link-top10 a.open { background: #353533; }
ul#nav li#links-1 a:hover, ul#nav li#links-1 a.open { background: #b70943; }
ul#nav li#links-2 a:hover, ul#nav li#links-2 a.open { background: #289728; }
ul#nav li#links-3 a:hover, ul#nav li#links-3 a.open { background: #666666; }
ul#nav li#links-4 a:hover, ul#nav li#links-4 a.open { background: #b70943; }
ul#nav li#link-home a {
    padding: 0 33px 0 10px;
    text-indent: -9999px;
    background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjK-6da4PRSzJ16g61gxaqmeGykYZv9MRXhD8-dnm6vUyiEXW7T1SOTyP3IIJ43GVJ4JC8RjP_DtpbBn0eBTgoj-vz83nb6eWRoNG-0yDXXPorKhlqeYCS0UmBOVtgxzUuUSwbwBJ1O1B8T/s66/icona-home.png) right 0px no-repeat;
}
*html ul#nav li#link-home a { padding: 0; width: 43px; }
ul#nav li#link-home a:hover { background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvfkV2TuBkYkhG93nS5-9XQjtkHYRj21m51OSTFZoIzVISlW2oah3GtHgN6XMg1VNd6CcJfBaN-X5uKMDcwGIrLj-QJxkWwFgE9XEs1LdR1jiBMAowryisUZ_GW7sctaebcxN4ONhZxtY/s400/home-icon.png) right -33px no-repeat; }
ul.sub-nav {
    position: absolute;
    top: 33px;
    left: -1px;
    overflow: hidden;
    width:1000px;
    display: none;
    z-index: 999;
list-style: none;
  padding-left:0px;
}
ul#nav li#ipcei ul.sub-nav { background: #6f7987 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdgdIeRZEXz5jj5qZIqGRoa_Obt_exGenpjDhr0kiB_x0bNkuUlgz3f3nSCGPMGfZvve1ojidveW2cZB1J61w7DCDUdNBOlzqC79FvAEcDkxo_puNOcUaHia70NNCDiAWR5Tg_Jqyx9BOp/s50/business-bgd.png) top left repeat-x; }
ul#nav li#link-entertainment ul.sub-nav { background: #d46b8e url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipFhRXLwShVyTJY9NrRMB9Tt876eGIwlymLkKQmdU5EAqO4BIT3pnP4c1t2DIaMsAPTbcpI-9bIAWP-jsA-oNJbfZ_-J9X1Tuet5Bi5otlyJjUhDvKYhPc7FVtpz-xyNKB3ttriinVWuAC/s50/entertainment-bgd.png) top left repeat-x; }
ul#nav li#link-news ul.sub-nav { background: #e28a67 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVI_A50qpkLIFx5oYxvUveZ_vVpXO9afNRaAdW6d0pqjUqWHfbE6FYJYgm1PRUv857jXweHIe63mtUBd6SBCzBxkDUR1KjyMOb8boDeXAPNAWg7M9rIbTyQGljwc1Ajx4Jeyvjz-_nk687/s50/news-bgd.png) top left repeat-x; }
ul#nav li#link-life ul.sub-nav { background: #aa8eac url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1weBQA1SoqHIpgqdgQXC3dauys075Vx-CWwnhu0sYU1dxmwNwEoLrp98FWaPpOcrbWhvhOixsjhXhgpCT_A5bqw0XPNCgsD2hSBgHGIF1t1EAvcJrtfPIH_QRq7DF9mKmS2pn_bwXSpsw/s50/life-bgd.png) top left repeat-x; }
ul#nav li#link-technology ul.sub-nav { background: #67d0e2 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5Ekt6UOzf91Sla71hFeE_5vLECEX5JrYfmiHFC6yfuT23iK4bx9_MKW5Q7Vzc71wJj3BLmsmfCeruzJwxizAJzgkNngHJ5fEsxAU82e_totaITodDeXWjGJuxe_znDKkql8NrkJ5KwEmp/s50/technology-bgd.png) top left repeat-x; }
ul#nav li ul.sub-nav li { float: left;   }
ul#nav li ul.sub-nav li a {
    float: none;
    background: none;
    font-size: 11px;
    text-transform: none;
    color: #fff;
    line-height: 25px;
}
ul#nav li#ipcei ul.sub-nav li a:hover, ul#nav li#ipcei ul.sub-nav li a.active-cat{ background: #0f1f37 !important; }
ul#nav li#link-entertainment ul.sub-nav li a:hover, ul#nav li#link-entertainment ul.sub-nav li a.active-cat { background: #b70943 !important; }
ul#nav li#link-news ul.sub-nav li a:hover, ul#nav li#link-news ul.sub-nav li a.active-cat { background: #cf3c02 !important; }
ul#nav li#link-life ul.sub-nav li a:hover, ul#nav li#link-life ul.sub-nav li a.active-cat { background: #724375 !important; }
ul#nav li#link-technology ul.sub-nav li a:hover, ul#nav li#link-technology ul.sub-nav li a.active-cat { background: #02b0cf !important; }
</style>
<div class='IPCEI-contenitore'>
<ul id='nav'>                
               <li class='non-vertical-link top-link' id='link-home'><a class='open' href='#'>Home</a></li>
                <li class='top-link' id='ipcei'><a href='#'>SCHEDA 1</a>
                    <ul class='sub-nav'> 
                    <li><a href='#'>SCHEDA 1.1</a></li>
                    <li><a href='#'>SCHEDA 1.2</a></li>
                    <li><a href='#'>SCHEDA 1.3</a></li>
                    <li><a href='#'>SCHEDA 1.4</a></li>
                    <li><a href='#'>SCHEDA 1.5</a></li>
                    </ul>
                </li>
                <li class='top-link' id='link-entertainment'><a href='#'>SCHEDA 2</a>
                    <ul class='sub-nav' style='display: none;'> 
                    <li><a href='#'>SCHEDA 2.1</a></li>
                    <li><a href='#'>SCHEDA 2.2</a></li>
                    <li><a href='#'>SCHEDA 2.3</a></li>
                    <li><a href='#'>SCHEDA 2.4</a></li>
                    <li><a href='#'>SCHEDA 2.5</a></li>
                    </ul>
                </li>
                <li class='top-link' id='link-news'><a href='#'>SCHEDA 3</a>
                    <ul class='sub-nav' style='display: none;'> 
                    <li><a href='#'>SCHEDA 3.1</a></li>
                    <li><a href='#'>SCHEDA 3.2</a></li>
                    <li><a href='#'>SCHEDA 3.3</a></li>
                    <li><a href='#'>SCHEDA 3.4</a></li>
                    </ul>
                </li>
                <li class='top-link' id='link-life'><a href='#'>SCHEDA 4</a>
                    <ul class='sub-nav' style='display: none;'> 
                    <li><a href='#'>SCHEDA 4.1</a></li>
                    <li><a href='#'>SCHEDA 4.2</a></li>
                    <li><a href='#'>SCHEDA 4.3</a></li>
                    <li><a href='#'>SCHEDA 4.4</a></li>
                    <li><a href='#'>SCHEDA 4.5</a></li>
                    <li><a href='#'>SCHEDA 4.6</a></li>
                    <li><a href='#'>SCHEDA 4.7</a></li>
                    </ul>
                </li>
                <li class='top-link' id='link-technology'><a href='#'>SCHEDA 5</a>
                    <ul class='sub-nav' style='display: none;'> 
                    <li><a href='#'>SCHEDA 5.1</a></li>
                    <li><a href='#'>SCHEDA 5.2</a></li>
                    <li><a href='#'>SCHEDA 5.3</a></li>
                    <li><a href='#'>SCHEDA 5.4</a></li>
                    <li><a href='#'>SCHEDA 5.5</a></li>
                    </ul>
                </li>
<li class='top-link' id='ipcei'><a href='#'>SCHEDA 6</a>
<ul class='sub-nav' style='display: none;'> 
                    <li><a href='#'>SCHEDA 6.1</a></li>
                    <li><a href='#'>SCHEDA 6.2</a></li>
                    <li><a href='#'>SCHEDA 6.3</a></li>
                    <li><a href='#'>SCHEDA 6.4</a></li>
                    <li><a href='#'>SCHEDA 6.5</a></li>
                    </ul>
</li>
<li class='top-link' id='link-entertainment'><a href='#'>SCHEDA 7</a>
<ul class='sub-nav' style='display: none;'> 
                    <li><a href='#'>SCHEDA 7.1</a></li>
                    <li><a href='#'>SCHEDA 7.2</a></li>
                    <li><a href='#'>SCHEDA 7.3</a></li>
                    <li><a href='#'>SCHEDA 7.4</a></li>
                    <li><a href='#'>SCHEDA 7.5</a></li>
                    </ul>
</li>
<li class='top-link' id='link-news'><a href='#'>SCHEDA 8</a>
<ul class='sub-nav' style='display: none;'> 
                    <li><a href='#'>SCHEDA 8.1</a></li>
                    <li><a href='#'>SCHEDA 8.2</a></li>
                    <li><a href='#'>SCHEDA 8.3</a></li>
                    <li><a href='#'>SCHEDA 8.4</a></li>
                    <li><a href='#'>SCHEDA 8.5</a></li>
                    </ul>
</li>
<li class='top-link' id='link-life'><a href='#'>SCHEDA 9</a>
<ul class='sub-nav' style='display: none;'> 
                    <li><a href='#'>SCHEDA 9.1</a></li>
                    <li><a href='#'>SCHEDA 9.2</a></li>
                    <li><a href='#'>SCHEDA 9.3</a></li>
                    <li><a href='#'>SCHEDA 9.4</a></li>
                    <li><a href='#'>SCHEDA 9.5</a></li>
                    </ul>
</li>
<li class='non-vertical-link top-link' id='links-4'><a href='#'>SCHEDA 10</a></li>         
                 <li style='clear: both;'/>
            </ul>
</div>
<!-- MENU MULTICOLOR SU PIU LIVELLI FINE -->

Finalmente si salva il modello e si può verificare il suo funzionamento.

COME CONFIGURARE IL MENU MULTICOLORE

La scheda Home e la Scheda numero 10 sono senza sottomenù. Se ne possono inserire altre seguendo la stessa sintassi. Il numero delle voci dei sottomenu possono variare quanto si vuole. Nella dimostrazione ne ho inseriti da 5 a 7. Per creare un nuovo sottomenù basta incollare una riga del tipo

<li><a href='#'>SCHEDA X.Y</a></li>

Ovviamente al posto dei cancelletti ( # ) vanno incollati gli URL delle pagine a cui vogliamo collegare le singole schede. La larghezza del menù di 1000 pixel può essere modificata. Se si vogliono aggiungere altre schede basta copiare il codice della scheda di cui ci piace il colore, esempio

<li class='top-link' id='link-news'><a href='#'>SCHEDA 11</a>

per aggiungere la scheda numero 11 con i colori della scheda 'link-news' che è la numero 3. Le schede con id='links-1', id='links-2', id='links-3' e id='links-4' avranno, quando verranno puntate dal mouse, il colore di sfondo determinato dai corrispondenti CSS.

20 commenti :

  1. Ansia e attacchi di panico S.O.S.9 settembre 2012 alle ore 23:28

    Aaaaaaaaaah, Ernesto!
    Ma che bellino questo menù!!! Sai che ci sto facendo seriamente un pensierino?... Ora mi hai messo in crisi ^^ Che faccio? Abbandono il mitico Matt Black menù che tanto mi ha fatto sudare per l'installazione, e passo a questo così grazioso?... Lascio tutto così com'è?...
    Mumble mumble... Che dici?

    RispondiElimina
    Risposte
    1. Ernesto Tirinnanzi9 settembre 2012 alle ore 23:54

      @DietaEDintorni
      Ci sto pensando anch'io perché c'entrano un numero di link più o meno come nel MattBlackMenù ma qui sono più compatti e non si coprono altri elementi del layout quando si passa sopra con il mouse.

      Elimina
    2. Ansia e attacchi di panico S.O.S.11 settembre 2012 alle ore 00:01

      Eh eh, l'hai messo per davvero! Bellissimo, ci sta proprio bene ^^
      Mi pare di capire, tra l'altro, che a differenza del Matt Black menù si può impostare un larghezza superiore rispetto a quella del layout del blog, facendo ad esempio in modo che la striscia di menù occupi tutto lo schermo, come hai fatto tu.
      Ma per creare questo effetto hai impostato una larghezza in pixel o in percentuale?

      Elimina
    3. Ernesto Tirinnanzi11 settembre 2012 alle ore 01:24

      @DietaEDintorni
      No, l'ho installato in un blog di prova e ho visto che prendeva in modo naturale tutta la larghezza (almeno in questo modello). Ho solo cambiato il codice di cui al commento n°3 perché il menù era troppo attaccato al resto.

      Elimina
    4. Ansia e attacchi di panico S.O.S.11 settembre 2012 alle ore 09:19

      Ah,ok.

      Ernesto, ieri sera non riuscivo ad entrare nel mio blog (con nessun browser) e quando dopo mezz'ora che caricava riuscivo finalmente ad entrare, si vedeva il Matt Black menù sballato, sai come quando capita che Dropbox "impazzisce" e anzichè vedere una sola riga di menù si vedono tutte le voci del menù una sotto all'altra?

      Stamattina, invece, si riesce ad entrare nel blog normalmente, ma ho visto che a destra una parte del menù è scomparsa, lasciando posto ad uno spazio bianco (in corrispondenza delle bandierine del traduttore, per capirci).

      Hai idea di cosa possa essere successo?... e se posso rimediare?...

      Elimina
    5. Ansia e attacchi di panico S.O.S.11 settembre 2012 alle ore 09:35

      A quanto sopra, aggiungo che anche provando a spostare il widget del traduttore il problema permane, e quel pezzetto di spazio rimane sempre bianco

      Elimina
    6. Ernesto Tirinnanzi11 settembre 2012 alle ore 09:58

      @DietaEDintorni
      Ieri sera non si poteva entrare in molti siti con dominio personalizzato perché era in corso un attacco hacker di Anonymous a GoDaddy il provider in cui sono hostati i domini personalizzati di Blogger. La cosa non era generalizzata perché con alcuni proxy si riusciva a entrare. Ora è tutto OK.
      Se metti troppe cose su DropBox diventa più lento.
      Per il problema del traduttore attualmente tu hai questo codice di posizionamento
      style="float:right; margin:-55px -25px 0px 20px;
      prova a sostituire right con left in questo modo
      style="float:left; margin:-55px 0px 0px 10px;
      poi i margini li puoi settare a piacere. Il primo è la distanza verso l'alto poi a seguire tutte le altre in senso orario.

      Elimina
    7. Ansia e attacchi di panico S.O.S.11 settembre 2012 alle ore 10:33

      Il problema non è con il traduttore, perchè anche se provo a spostarlo o rimuoverlo, rimane comunque lo stesso spazio bianco alla destra del menù. Dev’essere un problema proprio con il matt black menù, magari con dropbox o con i file .js, non saprei. Comunque, prima la striscia del menù copriva l’intero layout, lo spazio bianco si è creato dopo il casino di ieri sera...

      P.S. Ne approfitto per segnalarti che con Internet Explorer il nuovo menù che hai installato sul tuo blog dà qualche problema, nel senso che permette di cliccare col mouse solo sulle voci del sottomenù adiacenti al menù principale; se si prova a spostarsi a destra o sinistra sulle altre voci del sottomenù, si chiude prima che sia possibile selezionare la voce di proprio interesse.

      Elimina
    8. Ernesto Tirinnanzi11 settembre 2012 alle ore 10:40

      @DietaEdintorni
      Non saprei che dirti. Per quello che riguarda il menù vorrà dire che quelli che usano IE si arrangeranno :)

      Elimina
    9. Ansia e attacchi di panico S.O.S.11 settembre 2012 alle ore 11:11

      Ehehe, che carino ^^
      Probabilmente nel caso del tuo blog può andare bene lo stesso, ma io mi sa che dovrò restare con il Matt Black menù: la maggior parte delle visite che arrivano nel mio provengono proprio da Explorer!

      Un salutino!

      Elimina
    10. Ansia e attacchi di panico S.O.S.11 settembre 2012 alle ore 12:18

      P.S. Ho risolto il problema con il Matt Black menù, e ora è tornato tutto normale. Avevo impostato dei nuovi margini, e avendo messo anche "float left", il menù si spostava a sinistra, lasciando uno spazio bianco a destra. Tolto quel pezzo di codice, si è ricentrato da solo :)

      Elimina
  2. Unknown10 settembre 2012 alle ore 17:15

    Ciao Ernesto,
    ho utilizzato anch'io questo menù, ma come puoi vedere sul mio blog www.iconadeironchi.com non si visualizzano le sottovoci poichè è troppo attaccato al corpo del blog, che non riesco a staccare nemmeno con:

    .content {
    margin-top:-30px !important;
    }


    aiutooooooo!!!! =)

    RispondiElimina
  3. Ernesto Tirinnanzi10 settembre 2012 alle ore 17:40

    @GaiaVincenzi
    Usa quest'altro CSS

    .content-inner{margin-top:30px;}

    da sostituire a

    .content {margin-top:-5px !important;}

    Se non funziona prova con

    .content-outer {margin-top:30px;}


    RispondiElimina
    Risposte
    1. Unknown11 settembre 2012 alle ore 11:31

      grazie Ernesto, scusa se ti faccio impazzire... ma alla fine ho ri-cambiato il menù mettendo il mattblack (quello che tu avevi in precedenza), perchè questo multicolore mi dava dei problemi.
      c'è un modo per togliere la freccetta che indica il submenù di una voce? se non ricordo male tui l'avevi ovviata.
      grazie mille

      Elimina
    2. Ernesto Tirinnanzi11 settembre 2012 alle ore 11:39

      @GaiaVincenzi
      Leggi i commenti. La soluzione l'ha trovata una certa Giuliana che l'ha scritta in un commento al post

      Elimina
  4. Sarachiaro12 settembre 2012 alle ore 15:06

    Utilissimo. Grazie.

    RispondiElimina
  5. Tiziana18 settembre 2012 alle ore 15:10

    Mi piace molto l'effetto, però non tanto per la posizione. é possibile trasformare il menù normale, quello sotto l'intestazione per intenderci, in questo multicolore e livello?
    :)

    RispondiElimina
    Risposte
    1. Ernesto Tirinnanzi18 settembre 2012 alle ore 17:25

      @Tiziana+-+-+
      Prova a inserire il codice, l'ultimo, invece che nel modello in un elemento HTML/Javascript

      Elimina
  6. Andrea Sapuppo3 novembre 2013 alle ore 21:46

    Troppo bello questo menù. Per inserirlo come menù normale (intendo sotto l'intestazione) il codice dovete incollarlo per forza nel modello altrimenti non funziona ed esattamente prima della riga HEADER. Poi non so' perché ma per farlo funzionare dato che mi segnava errore ho dovuto eliminare alla quint'ultima riga il tag di chiusura LI. L'ho testato su un blog non personalizzato e coi codici presenti qui; incrocio le dita nella speranza che nel blog titolara abbia gli stessi risultati :)

    RispondiElimina
    Risposte
    1. Andrea Sapuppo4 novembre 2013 alle ore 10:16

      Mi ha funzionato sotto il logo solo nel blog di prova, 2 giornate sprecate -__-

      Elimina

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

Iscriviti a: Commenti sul post ( Atom )