MattBlackManu multilivello per Blogger e personalizzabile completamente
Ho presentato diversi menù per la precedente generazione di template di Blogger. Con l'avvento del Designer Modelli, alcuni di questi non sono più visualizzati correttamente. Mi ripropongo di ripresentarli in una versione universalmente funzionante in un prossimo futuro.
Adesso illustro il procedimento per l'installazione di un menù a beneficio di blogger che hanno l'esigenza di collegare molte pagine in home page. E' molto simile al menù multilivello e ne ricalca in qualche modo la struttura. Ci sono una serie di titoli principali al di sotto dei quali possono essere inserite delle voci secondarie su più livelli
Se si interagisce con il mouse ecco come si presenta il menùAdesso illustro il procedimento per l'installazione di un menù a beneficio di blogger che hanno l'esigenza di collegare molte pagine in home page. E' molto simile al menù multilivello e ne ricalca in qualche modo la struttura. Ci sono una serie di titoli principali al di sotto dei quali possono essere inserite delle voci secondarie su più livelli
Ho inserito quattro livelli ma se ne possono mettere di meno o anche di più. Andate su Design > Modifica HTML e cercate la riga </head>. Subito sopra incollate questo codice
<!--MattBlackMenù Inizio-->
<link href=' .... /ddlevelsmenu-base.css' rel='stylesheet' type='text/css'/>
<link href=' .... /ddlevelsmenu-topbar.css' rel='stylesheet' type='text/css'/>
<script src=' .... /ddlevelsmenu.js' type='text/javascript'>
/***********************************************
* All Levels Navigational Menu- (c) Dynamic Drive DHTML code library (http://www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/
</script>
<noscript><a href='http://goo.gl/QaxXO' target='_blank'>Inserisci Menù</a></noscript>
<!--MattBlackMenù Fine - www.ideepercomputeredinternet.com-->
Al posto dei tre file con estensione CSS e del file javascript inserite l'URL dei file di questo archivio che ho caricato su SugarSync. Tale file ZIP va scompattato e occorre caricare ciascun file della cartella su DropBox o SugarSync per ottenerne il link diretto. <link href=' .... /ddlevelsmenu-base.css' rel='stylesheet' type='text/css'/>
<link href=' .... /ddlevelsmenu-topbar.css' rel='stylesheet' type='text/css'/>
<script src=' .... /ddlevelsmenu.js' type='text/javascript'>
/***********************************************
* All Levels Navigational Menu- (c) Dynamic Drive DHTML code library (http://www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/
</script>
<noscript><a href='http://goo.gl/QaxXO' target='_blank'>Inserisci Menù</a></noscript>
<!--MattBlackMenù Fine - www.ideepercomputeredinternet.com-->
Se si vogliono personalizzare i colori, si possono scaricare i file di estensione CSS, aprirli con Notepad++ e modificare il codice dei colori o altri parametri. Successivamente potranno essere caricati nuovamente su un servizio di hosting che li supporti come DropBox. Se non lo avete ancora fatto ecco il modulo di iscrizione a DropBox. I colori da cambiare sono #FDBCB7, #FFEAE9, #003366, white e black. Come è noto i colori possono essere indicati con il loro nome in inglese oppure con un codice esadecimale (vedi i codici dei colori).
Dopo aver salvato il modello si passa alla realizzazione del menù vero e proprio. Ho pubblicato in rete un
La prima sezione è relativa alle voci principali che possono essere in un numero indefinito. Se vogliamo che abbiano dei collegamenti secondari, dobbiamo inserire nel collegamento rel="ddsubmenuX" dove X è il numero progressivo del sottomenù. A seguire incolleremo il codice dei collegamenti per ciascun sottomenù. Saranno del tipo seguente con un numero di voci indefinito
<ul id="ddsubmenuX" class="ddsubmenustyle">
<li><a href="URL COLLEGAMENTO">Titolo 1</a></li>
<li><a href="URL COLLEGAMENTO">Titolo 2</a></li> </ul>
Quando si vuole inserire un nuovo livello bisogna incollare un nuovo elenco in mezzo ai due tag evidenziati di viola. Ecco un esempio
<ul id="ddsubmenuX" class="ddsubmenustyle">
<li><a href="URL COLLEGAMENTO">Titolo 1</a></li>
<li><a href="URL COLLEGAMENTO">Titolo 2</a></li>
<li><a href="#">Titolo 3</a> <ul>
<li><a href="URL COLLEGAMENTO">Titolo 3.1</a></li>
<li><a href="URL COLLEGAMENTO">Titolo 3.2</a></li>
<li><a href="URL COLLEGAMENTO">Titolo 3.3</a></li>
<li><a href="URL COLLEGAMENTO">Titolo 3.4</a></li>
</ul> </li> </ul>
Sono stati evidenziati di viola i due tag in mezzo ai quali è stato inserito il nuovo livello che ha il codice colorato di blu. Il titolo del nuovo livello può anche essere lasciato senza collegamento inserendo un cancelletto (#) al posto dell'URL. Dopo aver terminato l'operazione si va su Design > Aggiungi un gadget > HTML/Javascript e si incolla in Sezioni del sito. Quindi si posiziona con il mouse nel punto desiderato.
Il codice funziona benissimo con Firefox e Chrome ma ha delle lentezze con Internet Explorer, la cosa non è del resto una novità.
Aggiornamento: Dato il troppo successo di questo menù, è stato superato il limite di banda di DropBox. Coloro che lo desiderano possono reinstallare il menù seguendo le nuove istruzioni.
Fonte | Dynamic Drive -
il mio! ^_^
RispondiEliminaHai scelto questo poi? Con IE lascia un po' a desiderare...
RispondiEliminaParsifal grazie, ci provo e ti faccio sapere ^-^
RispondiEliminaInserito devo solo personalizzarlo ora!in ogni caso funziona!grazie!!
RispondiEliminaCiao,
RispondiEliminami interessa questo menu, ma non riesco a personalizzare la barra di navigazione superiore, i menu a discesa invece si.
Ho modificato nel file CSS i colori di sfondo e del testo e le dimensioni del testo, ma con risultati insoddisfacenti. Bisogna modificare anche il file .js?
Grazie per aver indicato Notepad++, è utilissimo.
@sonia
RispondiEliminaAdesso non mi ricordo dove si deve operare. Ma se non hai avuto risultati con il file CSS prova con il javascript. Mi fa piacere che anche tu apprezzi Notepad++
Ciao Parsifal,
RispondiEliminasto lavorando per mettere sul mio blog questo tipo di menù: sto già iniziando a modificare i colori a mio piacimento; vorrei solo sapere che "1px" devo eliminare (e dove sopratutto :P) per poter eliminare il bordino grigio sottostante e lungo tutta la barra del menù (non mi piace).
Credo di averci capito qualcosa, però non sono sicuro che "1px" eliminare; ti incollo qui i 2 codicini(ottenuti dal terzo link "css"), se mi aiuti mi faresti un gran favore:
.markermenu ul{
list-style-type: none;
margin: 5px 0;
padding: 0;
border: 1px solid #9A9A9A;
}
.markermenu ul li a{
background: #FFEAE9 url(bulletlist.gif) no-repeat 3px center; /*light gray background*/
font: bold 13px "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, sans-serif;
color: #00014e;
display: block;
width: auto;
padding: 3px 0;
padding-left: 20px;
text-decoration: none;
border-bottom: 1px solid #B5B5B5;
}
Ovvio, le mie sono solo congetture di un dilettante, magari il mio ragionamento non è giusto :P: a te la parola :)!
P.S.
Ovviamente prima di mettermi al lavoro, ho provato a salvare i codici del tuo menù insieme al codice da inserire nel modello HTML: così da poter vedere come sarebbe stato il menù e sopratutto se si sarebbe visto all'interno del mio blog :P (mi è già capitato di mettermi a smanettare con HTML vari e poi alla fine aver lavorato per nulla perchè non si vedeva una cippa -.-!Come si dice: impara l'arte e mettila da parte :))
Un caro saluto e grazie in anticipo
Marco Michele C.MI
@Marco Michele C.MI
RispondiEliminaSe non ti piacciono i bordi elimini questa riga
border: 1px solid #9A9A9A;
e poi quest'altra
border-bottom: 1px solid #B5B5B5;
Poi eventualmente le puoi reinserire
@Ernesto T.
RispondiEliminaGrazieeee mille Parsifal :), sei stato celerissimo!!!
Comunque i tuoi lavori sono molto belli e ben fatti: peccato che alcune cose a me non si vedono (come le etichette a nuvola, le ho provate in tutte le salse ma nulla, non ce nè una che si veda: ti inventerai presto qualche modifica a proposito :P!)
Un caro saluto
Marco Michele C.MI
ciao, scusa se forse sembro (e forse lo sono) assolutamente spaesata ma dove posso scaricare il css di questo menù in modo da modificarlo per il mio blog? grazie e compliementi per il tuo lavoro!
RispondiElimina@Annarita Gargiulo
RispondiEliminaCi sono tre CSS che riguardano il menù in modo generico, messo in orizzontale e nella sidebar. Puoi incollare questi URL nel browser e cliccare su Invio
http://dl.dropbox.com/u/2574553/MattBlackMenu/ddlevelsmenu-base.css
http://dl.dropbox.com/u/2574553/MattBlackMenu/ddlevelsmenu-topbar.css
http://dl.dropbox.com/u/2574553/MattBlackMenu/ddlevelsmenu-sidebar.css
@Ernesto T.
RispondiEliminaGRAZIE! riprovando con tenacia sono riuscita a fare un menu semplice che mi soddisfacesse...ora è tempo di pensare al "contenuto"! grazie ancora per la tua disponibilità!
Ciao Parsifal, finalmente sono riuscita a concludere qualcosa, i tuoi consigli sono preziosi..ma il problema è la mia incapacità col pc..ti chiedo un consiglio ho istallato questo menù sul mio blog, ti chiederei di dare un occhio se puoi, perchè sotto al menù (precisamente sotto a home)compare questa cosa qua: > (scusa ma non ricordo come si chiama..che ignoranza la mia!!!)
RispondiEliminacome posso eliminarla? Forse ho sbagliato qualcosa nel comporre il mio codice menù.il mio blog: /http://fattidicarte.blogspot.com
Altra cosa, riguardo alla modifica dei colori (questa operazione la vedo per me parecchio complicata)
Nel codice che tu hai dato da inserire in html del blog, qual'è la riga che corrisponde al colore dei caratteri, e quale a quella del fondo. Così com'è non va bene per il mio blog. C'è un'operazione più semplificata per poter modificare i colori? grazie mille!Sei il mio angelo del web!! ;)
@FattiDiC'Arte Hai lasciato il simbolo del maggiore > subito sopra a
RispondiEliminaTop Drop Down Menu 2
nel gadget HTML, devi toglierlo, meno male che ti funziona lo stesso.
Per i colori lo so che è complicato ma non c'è un modo più semplice
#FDBCB7; è il colore dello sfondo delle voci del menù
940F04; è il colore quando ci si passa sopra con il mouse.
Devi scaricare i file
http://dl.dropbox.com/u/2574553/MattBlackMenu/ddlevelsmenu-base.css
http://dl.dropbox.com/u/2574553/MattBlackMenu/ddlevelsmenu-topbar.css
aprirli con Notepad++
http://www.ideepercomputeredinternet.com/2009/12/notepad-per-modificare-modelli.html
modificarli e ricaricarli su DropBox
http://www.ideepercomputeredinternet.com/2010/11/dropbox-per-condividere-file-con-piu.html
Acquisire il link diretto e sostituirlo a quelli del codice.
@Ernesto T. Grazie Ernesto!!! Sei stato velocissimo! Ho già risolto il problema, da sola non l'avrei mai capito..mi ci è voluta una vita per comporre quel menù! Per i colori mi rendo conto che mi ci vorrà un'altra vita..passo ad un'altro giorno. Grazie ancora e buona giornata! ;)
RispondiEliminaCi sono riuscita...questo è il mio menù...funzionerà con gli altri brouser?
RispondiElimina@Petra
RispondiEliminaNon ti resta che provare comunque nell'articolo c'è scritto di sì quindi vuol dire che l'ho già provato io anche se ogni modello fa storia a sé.
Ciao Ernesto, e scusami già dall'inizio la grande ignoranza, ma i codici CSS dove vanno inseriti? Cioè, dopo aver cambiato colori ecc. ai codici, dove vanno messi?
RispondiElimina@Nintendo
RispondiEliminaI file con estensione CSS e JS, dopo che sono stati modificati vanno caricati su Google Sites
http://www.ideepercomputeredinternet.com/2010/05/come-caricare-file-javascript-e-css-su.html
oppure su DropBox
http://www.ideepercomputeredinternet.com/2010/11/dropbox-per-condividere-file-con-piu.html
I nuovi URL vanno sostituiti a quelli vecchi nei codici di installazione.
Grazi Ernesto.... finalmente ho capito qualcosa! xD
RispondiElimina@Nintendo
RispondiEliminaCon questo menù è meglio usare DropBox.
Si, infatti sto proprio utilizzando DropBox.... è ottimo! Grazie come sempre!
RispondiEliminaUltimo commento che faccio: ma su questo tipo di menù si può utilizzare il tatget="_blank?
RispondiEliminaErnesto, solo tu mi puoi aiutare! Il menù mi esce, dopo un bel pò di tempo che c'è l'ho, verticale e senza il multi livello. è successo tutto oggi! Come devo fare?
RispondiElimina@Nintendo
RispondiEliminaNon ho potuto guardare il tuo blog quindi non ho capito di cosa parli.
Ernesto, ti chiedo perdono, ma io sono un neofita nel vero senso della parola. Veniamo al problema. Ho realizzato, un blog con i nuovi modelli e la barra degli strumenti come è in questo tutorial. La barra funziona perfettamente, pur avendo molti più etichette (con argomenti e sottoargomenti) più complessa e articolata di quella che ci mostri tu in questo tutorial. Ora il mio problema e che quanto scrivo un nuovo post, esso va a finire sulla home page, e non riesco a collocarlo nell'etichetta o nell'argomento che mi interessa... lo so che queste cose le hai spiegate, e io le ho lette, ma io non riesco a venirne a capo... tant'è che sto pensando di rinunciare a tutto...puoi darmi qualche consiglio?
RispondiEliminaTi ringrazio
@Emilio
RispondiEliminaTemo di non aver capito. Per inserire un post in una etichetta basta mettere l'etichetta in basso dell'editor prima di pubblicarlo. Se ne possono inserire fino a 20 (mi pare) separandole con delle virgole. Non so se avevi chiesto proprio questo :)
Ernesto, scusami se ti rispondo in ritardo, ma ho avuto qualche contrattempo familiare...
RispondiEliminaDunque, ho seguito il tuo consiglio, ma ancora non va bene...
o meglio non è come speravo...
Cercherò di spiegarmi meglio con parole semplici senza terminologia informatica in quanto non ne sono capace.
Come scritto in precedenza, ho creato una barra di navigazione (il menù) come da tutorial, con sette pulsanti principali; quest'ultimi hanno dei sottopulsanti (sottoargomenti) che a loro volta ne contengono altri: proprio come il menù che porti ad esempio nel tuo tutorial. Ora, questo menù, che ha vari argomenti, annidati gli uni negli altri, in pratica io li chiamo pulsanti, o come ho detto nella prima missiva, ''etichette''. E' forse lì che è nata la confusione, ovvero, io mi riferivo al fatto che mi interessa, una volta creato un post, mettere il collegamento nella voce apposita del menu, ovvero collegarlo a un pulsante-argomento, quello che io chiamavo ''etichetta'' ,forse impropriamente...quindi le classiche ''etichette'' che si trovano nella home pege non mi interessano, altrimenti che senso avrebbe creare una barra di menù?
Ma forse ce la, ma ciò che io intendo realizzare e il collegamento post-pulsante menù. In effetti proprio come funziona il tuo blog con gli innumerevoli argomenti che tratti cliccandoci sulla tua barra dei menù.
A proposito, il mio blog non è in rete ma potrei farti accedere come amministratore se vuoi dargli un'occhiata...
Ciao a presto
@Emilio
RispondiEliminaPer mettere il collegamento tra un pulsante e un articolo basta che tu acquisisca l'URL del post dalla barra degli indirizzi del browser e lo incolli nel Menù. In questo menù si chiama URL del collegamento
Grazie Ernesto, è quello che io sospettavo. Quindi nella voce del pulsante che mi interessa dovrò fare copia e incolla del'indirizzo (l'url per l'appunto) e scrivere a fianco ''collegamento''. Quanto prima ti farò sapere...
RispondiEliminaGrazie tantissimo
Ernesto, sei MITICO!!!
RispondiEliminaCi sono riuscito, grazie a te!
Ho pubblicato due post fittizi per prova collegati ad un argomento attraverso un pulsante ''annidato'' nella barra del menù. Però questi due post fittizi compaiono anche nella home page, e chiaramente vorrei eliminarli. Tra l'altro nella home page vorrei scrivere un post di benvenuto e gli argomenti che verranno trattati nello stesso blog. Ti prego se puoi darmi questa dritta. Grazie di cuore.
@Emilio
RispondiEliminaI due post non li puoi eliminare ma li puoi retrodatare andando su Opzioni post e scegliendo come data di pubblicazione per esempio il primo di Gennaio 2011. Puoi farlo con tutti i post che vuoi.
Ernesto, ho fatto come mi hai consigliato, ma niente da fare: i due post fittizi rimangono sempre sulla home page. Cosicchè li ho eliminati, ho cancellato anche la cache del blog. Poi ho di nuovo realizzato due post fittizi con la data retrodata al 2010 sin dall'inizio, e funzionano benissimo attraverso il pulsante menù da me scelto. Purtroppo questi due nuovi post fasulli continuano anche in questo caso a comparire sulla home page, oltre naturalmente nella sua pagina di collegamento da me scelto. Accidenti, le sto provando tutte, ma niente... a pensare che questo è uno dei motivi che mi sta impedendo per andare in rete...
RispondiElimina@Emilio
RispondiEliminaFrancamente non capisco. Non è che dopo non hai pubblicato altri post? Perché spariscono dalla home proprio perché sostituiti da altri articoli più recenti. Certo che se hai postato solo quelli ...
Caro Ernesto, quello che intendevo io, e che pur pubblicando 5- 10- 15 post, e così via, la home page rimanesse sempre libera,invece contiene sempre gli ultimi cinque post pubblicati in ordine cronologico; nel mio caso l'ho impostato a cinque post per pagina, mi sembra di capire che così è anche per il tuo blog... se non si può fare niente, non fa nulla, non è un grande danno. Sono molto soddisfatto grazie a te. Non mi resta che studiare gli altri trucchi e sistemi che presenti nel tuo blog...intanto, mano mano che procedo, mi faccio delle copie di sicurezza del mio blog, perchè non credo di andare in rete per il 31 luglio, e non vorrei che google me lo cancelli...
RispondiEliminaCiao
@Emilio
RispondiEliminaI blog sono come dei diari, funzionano così. Se volevi fare un sito con la home fissa dovevi sceglierti un altro CMS e comprarti un dominio. Comunque ci sono molti trucchi per diverse esigenze
Imparare un altro cms? Nooo...
RispondiEliminaOrmai mi sono affezionato a blogger e sto diventando un esperto grazie a te! Per il dominio penso che lo comprerò a fine anno quando tutto ''girerà'' a meraviglia.
A proposito, quando finirò questo mastodontico progetto, dedicherò una pagina intera alla tua persona con una recensione al tuo blog. Mi sembra il minimo, visto che stai lontano e non posso avere il piacere di offrirti una cena.
Ciao
ciao ernesto, sono felicissima, sono riuscita ad installare correttamente questo menu! unico problema: il colore della freccetta. è possibile modificarlo? grazie mille :)
RispondiElimina@sara b
RispondiEliminaPuoi editare nuovamente questo file
http://dl.dropbox.com/u/2574553/MattBlackMenu/ddlevelsmenu.js
con Notepad++
http://www.ideepercomputeredinternet.com/2011/02/notepad-strumento-indispensabile-per.html
devi sostituire l'immagine della freccia che punta in basso (downarrow) che ha questo URL
https://lh3.googleusercontent.com/_nT13UtBmmiU/TVVXSrlLe_I/AAAAAAAAR2k/iLKLTNUFehQ/arrow-down.gif
con un altra a tua scelta. Dopo aver salvaqto il file. Lo carichi su DropBox
http://www.ideepercomputeredinternet.com/2010/11/dropbox-per-condividere-file-con-piu.html
nella cartella Public e ne acquisisci l'URL che poi sostituisci nel codice a quello originario.
capito! grazie mille :)
RispondiEliminasperiamo che almeno questo mi funzioni...
RispondiEliminaF U N Z I O N A missione compiuta :)
RispondiElimina@bizzo
RispondiEliminaAlla faccia del pessimismo ;)
Ciao Parsifal, ho installato questo menù sul mio blog personalizzandolo! Funziona perfettamente ma ho il problema della freccetta rossa: con firefox se ne visualizza una, con explorer due! Per par condicio ma anche per questioni estetiche vorrei eliminarla! Ho provato a eliminare l'indirizzo dell'icona nel file js ma rimane il quadratino dell'immagine mancante! Mi puoi aiutare? Ciao e grazie
RispondiElimina@Giuliana
RispondiEliminaIn altri modelli è stato notato questo stesso tuo problema. Anche nella Demo se la apri con IE vedrai due frecce. Onestamente non so come si potrebbe ovviare.
In compenso, se può servire a qualcuno, sono riuscita a eliminare definitivamente la freccetta! Basta sostituire nel file js dopo il link del downarrow i numeri 11 e 7 con 0 e 0. E la freccetta sparisce. Grazie ancora
RispondiElimina@Giuliana
RispondiEliminaOttima idea quella di mettere le dimensioni della immagine uguali a zero.
Cavolo, ho fatto una prova con il tuo codice esempio per vedere se questo tipo di menù funziona sul mio blog e FUNZIONA! Quanto ti voglio bene :)
RispondiEliminaTi chiedo ancora un paio di cose e poi ti giuro che non ti rompo più le scatole per un po' (anche perchè mi ci vorranno ore, giorni, forse decenni per mettere in pratica quanto sopra; come ti sarai accorto, sono un po' dura di comprendonio).
- Che articolo devo andare a leggermi per imparare a personalizzare i colori scaricando i file di estensione CSS? Non ho idea di come si faccia :p
- E' possibile modificare anche la lunghezza della barra? Perchè quella del codice che hai riportato come esempio risulta un p' cortina per il mio blog. Devo farlo sempre tramite Notepad ++?
- Una volta pronta e installata, la barra si posizionerà automaticamente dove dovrebbe o sono io che devo assegnare dei margini in base a quello che ho nell'header?
Grazie, grazie mille, grazie di cuore!
Giuliana
@Dieta e Dintorni
RispondiEliminaLe tue non sono domande sono richieste enciclopediche!!!
Per personalizzare i colori leggi questo
http://www.ideepercomputeredinternet.com/2008/12/come-conoscere-il-codice-numerico-dei.html
e questo
http://www.ideepercomputeredinternet.com/2010/02/tabella-interattiva-in-italiano-dei.html
La lunghezza del menù dipende da quante voci ci inserisci (e dalla lunghezza del testo). Io per brevità ne ho messe solo qualcuna.
Il menù lo devi inserire in Layout > Aggiungi un gadget e posizionarlo sotto l'header. Il menù si posizionerà sulla sinistra e arriverà fino a dove gli serve in funzione delle voci che hai inserito. Per modificare i file devi usare Notepad++
http://www.ideepercomputeredinternet.com/2009/12/notepad-per-modificare-modelli.html
quindi caricarli nuovamente su DropBox
http://www.ideepercomputeredinternet.com/2010/11/dropbox-per-condividere-file-con-piu.html
e sostituire l'URL nel codice.
Grazie Ernesto, grazie davvero! Stasera mi metto all'opera, ci sentiremo nel 2013 quando forse avrò terminato (sperando che il mondo non finisca prima, se no sai che gran lavoro per niente!).
RispondiEliminaMi sa che quell'antipixelino così piccino che ho messo nel mio blog per ringraziarti non basta a ripagarti di tutto l'aiuto che mi hai dato, ci vorrebbe un mega banner, altro che! Per fortuna che con la parte grafica ho quasi finito, anche se scommetto che quando uno si addentra nel misterioso mondo dell'html difficilmente riesce a venirne fuori...
Un caro saluto, e ancora grazie di cuore
Giuliana
@Giuliana
RispondiEliminaQuando ci si prende un po' di pratica queste cose sono molto più semplici e rapide di come si crede all'inizio
Ernesto, è successa una cosa strana: quando provo ad entrare negli indirizzi css per modificare i colori, mi compare un messaggio che dice:
RispondiEliminaError (509) This account's public links are generating too much traffic and have been temporarily disabled!
E guardando nel mio blog, dove avevo inserito il tuo esempio per poter visualizzare i colori da modificare, la barra si è disgregata e adesso appare come un elenco di link.
Inoltre, se guardi sopra, nel riquadro rosa dove hai messo il codice da inserire sopra alla voce "head", è sparita una parte degli indirizzi!
A quanto ho capito c'è un qualche tipo di sovraccarico o qualcosa del genere, e quindi gli indirizzi sono stati bloccati. C'è modo di risolvere la cosa?
(A questo punto mi viene da pensare che se riuscirò in qualche modo ad entrare nei link, mi conviene comunque modificarli e salvarli per conto mio da qualche altra parte, in modo da evitare in futuro questo genere di problemi; sbaglio?)
@Dieta e Dintorni
RispondiEliminaSei stata la goccia che ha fatto traboccare il vaso ;) Leggi qui
http://www.ideepercomputeredinternet.com/2012/01/problemi-con-i-widget-effetti-e-menu.html
e aspetta tre giorni per riprovare
Ernesto... Ci ho messo ore e ore (un po' per seguire bene le istruzioni, un po' per capire come funzionano DropBox e Notepad ++, un po' per capire dove metter mano per personalizzare i colori, un po' per correggere gli errori che facevo), ma alla fine ce l'ho fatta!!!! Grazie mille, sono proprio contenta: tutto funziona perfettamente e ho risolto il problema delle due righe di menù. Vieni a vederlo, se vuoi :)
RispondiEliminaOra provo a inserire una freccetta di mia scelta, come da tue istruzioni a Sara.
Ti chiedo solo una cosa:
- E' possibile cambiare il colore della barra lunga, quella che compare sotto le varie voci? Non ci sono riuscita, la trovo forse nel file .js? Perchè provando a modificare tutti colori degli altri 3 file non è cambiata.
Grazie ancora, un caro saluto
Giuliana
P.s. Belli i programmi Dropbox e Notepad ++, proprio utili!
Per la freccina niente da fare, come dicevano anche altri utenti se ne visualizzano due ed è brutto esteticamente.
RispondiEliminaVedrò se riesco a risolvere la, altrimenti non la metto proprio :(
@Dieta e Dintorni
RispondiEliminaSi può risolvere facilmente il problema della freccia verticale. Leggiti il commento numero 46 di Giuliana. Nel javascript metti dimensioni 0 per la freccia downarrow e salvi il file. Si vede quindi solo quella orizzontale che non raddoppia. Per i colori onestamente in questo momento non mi ricordo il codice ma dovrebbero esserci tutti e quindi essere modificabili.
a me non compaiono le sottosezioni dopo aver fatto tutto neanche copiando il tuo codice.
RispondiEliminaE' già è il secondo su due dei tuoi che non va.
Scusa io, apposta del colore di sfondo "rosa" dei bottoni principali posso mettere un immagine?
RispondiElimina@Manager
EliminaPuoi mettere il colore che ti pare modificando il file CSS. Se vuoi mettere una immagine al posto di
background:#FDBCB7; o background:#FFEAE9; metti
background:url(URL_IMMAGINE);
dove al posto di URL_IMMAGINE incolli l'indirizzo dell'immagine che avrai precedentemente caricato su Picasa.
Ciao Ernesto,
RispondiEliminaa proposito dello splendido Matt Black menù, avrei una domanda specifica.
Ho inserito due sottomenù sotto una delle voci, e com'è giusto che sia spuntano lateralmente, alla destra della voce cui si riferiscono. Ho visto però che con Explorer non si può cliccarci sopra, perchè come si sposta il mouse a destra si chiudono. Se non sbaglio per risolvere il problema basta modificare il bordo o i margini delle caselle del sottomenù, ma non ricordo esattamente a quale file dei tre file CSS bisogna mettere mano e quale voce bisogna andare a modificare. Un aiutino? ^^
@GiulianaMosetti
EliminaI problemi con IE sono noti. Non so a che livello siano i tuoi ma in genere la freccia verticale viene mostrata doppia e quindi provoca delle difficoltà. Per ovviare a questo problema si può usare il sistema adottato da Giuliana nel commento numero 46 che ha messo uguale a zero le dimensioni della freccia verticale che quindi non si visualizza. Alternativamente si può inserire la riga display:none; nel CSS relativo a detta icona ma è meno immediato.
No, allora non mi sono spiegata bene ^^
EliminaIl problema delle frecce l'avevo già risolto.
Intendevo che se uno fa scendere la tendina di un menù e poi prova a cliccare su una delle finestrelle secondarie che spuntano a destra, questa si chiude prima di riuscire a cliccarci sopra col mouse.
@GiulianaMosetti
EliminaCon IE bisogna essere veloci e precisi :) in altre parole non c'è nulla da fare
Ciao Ernesto!
RispondiEliminaVolevo chiederti ancora due cose per quanto riguarda il Matt Black menù, che funziona benissimo (tranne le rare volte in cui Dropbox impazzisce, non so se ci hai fatto caso ultimamente ;)
1) Pensavo di allungare la striscia del menù fino a coprire tutto lo schermo del pc. Mi chiedevo se devo impostare la lunghezza in pixel (quanti, per essere sicura di soddisfare anche il più largo dei monitor?) oppure se è meglio utilizzare una lunghezza in percentuale che si adatti automaticamente al monitor (del tipo 100%), e in questo secondo caso se sai che stringa di codice devo inserire nel file .js.
2) Se allungo la striscia del menù, come posso impostare i margini affinchè le varie voci del menù rimangano al centro così come sono ora?
Ti ringrazio tanto :)
Giuliana
@Giuliana
EliminaIl menù prende naturalmente tutto lo spazio disponibile nel layout, non devi fare assolutamente nulla. Devi solo stare attenta a inserire un numero adeguato di voci e di calibrare al meglio la lunghezza dei caratteri.
P.S. Dropbox ha dei problemi, d'altra parte fin che non c'è nulla di meglio :(
Capisco. Però io ho la larghezza del layout impostata a 980px, e infatti la striscia del menù è proprio di quella lunghezza. Allora ti chiedo:
Elimina- A quanti pixel dovrei impostare la larghezza perchè il layout prenda tutto lo schermo (per essere sicura di accontentare anche i monitor più grandi).
- Dopo aver effettuato l'operazione di cui sopra, mi si allargherà anche tutto il contenuto sotto il menù (area post, widgets, ecc.)?
Infatti, se allargo il layout è vero che la striscia del menù si allunga e adatta, ma si allarga anche tutto il contenuto sotto al menù, mentre io vorrei che rimanesse al centro della pagina. Non c'è modo di allargare il layout e di impostare dei margini affinchè tutto il contenuto del blog al di sotto del menù rimanga al centro?...
Elimina@DietaEDintorni
EliminaAdesso non ho sottomano i codici dei javascript e dei CSS del menù ma mi pare che non ci siano parametri su cui operare per diminuire la larghezza del menù che occupa in modo naturale il 100% dell'elemento pagina
@Giuliana
EliminaTi avevi risposto dal cellulare. Adesso ho aperto il file ddlevelsmenu-base.css . C'è questo codice
.ddsubmenustyle, .ddsubmenustyle ul{ /*topmost and sub ULs, respectively*/
font: normal 13px Verdana;
margin: 0;
padding: 0;
position: absolute;
left: 0;
top: 0;
list-style-type: none;
background: white;
border: 1px solid black;
border-bottom-width: 0;
visibility: hidden;
z-index: 100;
}
Potresti provare a modificarlo in questo modo
.ddsubmenustyle, .ddsubmenustyle ul{ /*topmost and sub ULs, respectively*/
font: normal 13px Verdana;
margin-left:80px;
margin-right:80px;
padding: 0;
position: absolute;
top: 0;
list-style-type: none;
background: white;
border: 1px solid black;
border-bottom-width: 0;
visibility: hidden;
z-index: 100;
}
dove al posto di 80px potresti mettere il valore più adatto.
No, questa volta si vede che non mi sono spiegata bene.
EliminaIo vorrei che il menù occupasse in larghezza tutta la pagina, ma che il contenuto del blog (cioè l'area post e il footer) rimanesse centrato in mezzo, senza allargarsi.
Come se tu allungassi al massimo la tua barra rossa del menù, ma lasciassi invariata la larghezza di tutto quello che c'è sotto.
@Giuliana
EliminaProva a metterlo in un gadget più largo, sotto l'header
http://www.ideepercomputeredinternet.com/2011/01/come-visualizzare-aggiungi-un-gadget-in.html
Ma temo di non aver capito neppure stavolta :) Il fatto è che voi donne non siete mai contente :D
Hai ragione Ernesto, noi donne siamo proprio così! Ma è questo il bello, altrimenti voi uomini vi annoiereste ;)
RispondiEliminaHo trovato un paio di esempi da mostrarti:
http://www.medscape.com/
http://www.triworks.it/category/news/medical-news/
Vedi che la parte dell'header e del menù occupa tutta la pagina ma quella sotto invece no?
Forse che si tratta di impostare del margini al corpo del blog?...
@Giuliana
EliminaAppunto dovresti inserire il codice del menù in un elemento pagina largo come l'header. Se in Layout non lo trovi prova a vedere se ti riesce di crearlo con il metodo linkato nel commento 60.g. Non si può però inserire un elemento pagina più largo del "content" del blog.
Il codice del menù l'aveno già inserito nello stesso elemento pagina dell'header.
EliminaQuello che ho capito è che se il mio blog è lungo 980px anche il menù, l'header e il content sono di questa lunghezza, e quando allungo il layout a 1600px si allargano tutte le aree del blog, e non solo l'header e il menù.
Io pensavo che fosse possibile fare una cosa di questo tipo: allungare il layout ad esempio a 1600px, e poi impostare al corpo del blog (quindi all'area dei post, alla sidebar e al footer) dei margini, affinchè menù e header rimangano larghi al massimo e il resto del contenuto invece si centri e distanzi dal bordo. Ma forse non si può.
Non credo, sarebbe troppo complicato ammesso si possa fare.
EliminaOk, Ernesto, ti ringrazio e ti auguro una buona domenica! ^^
EliminaCiao Ernesto,
RispondiEliminaho un problemino con il matt black menù: è da qualche ora che con Firefox non funziona più, mentre con Google Chrome e Internet Explorer le tendine scendono regolarmente.
Ho fatto delle modifiche ad alcuni gadgets nella sidebar sinistra e al font delle voci nel menù, perciò pensavo fosse dovuto a quello, pensavo magari di aver cancellato per sbaglio qualche pezzo di codice. Però il fatto che funzioni con gli altri browser mi fa credere che non sia quello, e inoltre ho anche provato a fare il backup del template prima di fare le modifiche, e ugualmente non funziona.
Hai un'idea di cosa potrebbe essere?... Grazie.
@DietaEDintorni
EliminaIl tuo menù funziona perfettamente anche con Firefox, guarda qui
http://i.minus.com/ibdbIT91BZhb8D.png
Se non funziona con il tuo browser dipende da un problema passeggero di cookie. In genere capita che per esempio non si visualizzino gli annunci per qualche ora o qualche giorno. Si sono create delle "contraddizioni" tra i cookie. La cosa si dovrebbe risolvere da sola comunque basta che tu con quel browser navighi un po' a caso o in alternativa tolga i dati di navigazione compresi i cookie però in quel caso devi accedere nuovamente a tutti gli account.
Ernesto, ne sai sempre una più del diavolo! ;)
RispondiEliminaAvevi proprio ragione, cancellando i cookie e la cronologia ho risolto il problema con il mio browser. Se penso che ci stavo impazzendo, pensando che fosse colpa mia! Che poi, questo genere di cose mi capita sempre mentre sto facendo delle modifiche, così ogni volta penso "O no, cosa avrò combinato?..." ^^
Grazie mille, un bacione!
@DietaEDintorni
EliminaEsperienza. Lo sai le volte che queste cose sono capitate anche a me, mi ci sono arrovellato e poi era una ca****a di questo tipo :D
Ciao Ernesto, quando inserisco il codice nella sezione del sito, al posto del menù mi viene fuori la scritta: Contatti ddlevelsmenu.setup("ddtopmenubar", "topbar") //ddlevelsmenu.setup("mainmenuid", "topbar"). Sono tornato all'interno del codice e la parte iniziale non riportava più la prima parte del codice da me inserita, ma una sua trasformazione con diverse parti sparite e cioè: (minore)div id="ddtopmenubar" class="mattblackmenu">
RispondiElimina(minore)ul>
(minore)li>Contatti(minore)/li>
(minore)li>
ddlevelsmenu.setup("ddtopmenubar", "topbar") //ddlevelsmenu.setup("mainmenuid", "topbar"),
Per favore hai idea di cosa possa aver sbagliato, visto che lo guardo e lo riguardo e mi sembra tutto ok? i 4 file sono caricati su google sities
@ViviTaranto
EliminaHai probabilmente incollato male gli URL dei file. La modifica del codice da parte di Blogger è normale perché viene convertito in XML quindi per esempio le virgolette diventano "
Prova a ripetere l'installazione
Ernesto grazie, sei sempre preziosissimo, finalmente ho capito di cosa si trattava, credo fossero gli httpS...ci ho sbattuto la testa ma alla fine è andata! C'è un modo per aprire le pagine del menù in altre schede?
RispondiEliminaA proposito, ho allineato l'inizio del menù dal css della topbar modificando il margine left, però notavo che è variabile a seconda dello schermo, ho sbagliato a cercare di centrare le scritte del menù da lì?
RispondiElimina@ViviTaranto
EliminaPer aprire i link in un altra scheda devi aggiungere al collegamento questo tag target=_blank" in questo modo "URL COLLEGAMENTO" target=_blank">
Non è venuto bene è target='_blank' con le doppie virgolette "
Eliminafatto è perfetto, grazie come sempre
Eliminaho il menù a tutta pagina e va benissimo, ma le scritte sono allineate a sinistra, è possibile centrarle? con l'allineamento dei margini dal file css della topbar si allineano sia sfondo che scritte, ma cmq slittano a seconda della grandezza dello schermo e del browser..c'è un modo per centrarlo per bene? ho cercato fra le risp date a Giuliana ma temo di non aver capito
RispondiElimina@ViviTaranto
EliminaNon lo so se sia possibile. Prova a usare Firebug o Firebug lite
http://www.ideepercomputeredinternet.com/2011/05/firebug-e-una-estensione-di-firefox-per.html
http://www.ideepercomputeredinternet.com/2012/07/firebug-chrome-blogger-css-html.html
Ciao Ernesto, come sempre mi hai risolto la vita! ho inserito il menu nel mio blog, sono riuscita a personalizzarlo senza problemi ma... quando ci si passa con il mouse sopra le voci secondarie del primo titolo ("lo que hago/lo que soy"), compare a sinistra il submenu della secondo titolo... proprio strano.. per il resto funziona benissimo, se riesci a farmi capire dov'è il problema ti faccio erigere un monumento..
RispondiElimina@marivitrombeta
EliminaQuesto menù è uno di quelli che hanno minori problemi di adattabilità con i vari modelli masi vede che con il tuo non va. Il problema non è di facile soluzione perché si potrebbe agire su tutto l'insieme dei submenù ma non su un singolo submenu.
grazie Ernesto, ho risolto, era semplicemente un errore nel codice (tutti le chiusure "ul" erano alla fine del codice)Grazie per la tua disponibilità e la risposta sempre pronta!
RispondiEliminaFico finalmente un menù come lo cercavo,GRAZIE!
RispondiEliminal'ho messo oggi e intravedo la luce,
mi fa un gioc strano dropbox, nel senso che se metto il link diretto a dropbox accessibile a chiuque non funziona, se invece metto il link al documento in dropbox quando lo apro con il mio account funziona, ma ovviamente solo sul mio PC!!!
Come posso fare?
Grazie ciao
D
@DavideFacheris
EliminaHai un vecchio account di Dropbox o uno recente? Se hai uno vecchio devi caricare i file js e css nella cartella Public. Se invece hai un nuovo account, tale cartella non c'è più per questioni di politica della Privacy. Allora va creata dall'utente e i file vanno caricati lì. Poi si clicca sul destro del mouse e si sceglie Get Public link. Sarà il link diretto e permetterà a tutti di vedere il menù. Se hai dubbi incolla l'URL in una scheda del browser per la navigazione in incognito per controllare che si veda la pagina con il file, in sostanza si deve vedere del testo.
Perfetto risolto grazie. Immaginavo fosse una questione di accesso pubblico al link ma avendo clikkato su "condividi linK" pensavo fosse già una condivisione pubblica, invece no.
RispondiEliminaFunziona tutto a meraviglia, mi rimane un problema con i colori
perchè nel designer modelli, personalizza, avanzato,
dove solitamente si possono cambiare i vari colori del blog, i link, il titolo, etc...
succede che io cambio i colori e salvo ma non non funziona più!!!
Ne sai qualcosa?
Altra domanda, visto la tua esperienza e la tua disponibilità che mi pare costante, tu sei disposto anche a fare modifiche e impostazioni ai blog a livello professionale, pagato?
Rispondimi pure in privato a capramagra@yahoo.it
ciao grazie
Davide
D
@DavideFacheris
EliminaNon faccio consulenze provate. Il Designer Modelli va usato solo la prima volta poi le modifiche è bene farle dal codice del template perché altrimenti si possono perdere le altre.
OK mi limiterò a godere delle tue consulenze gratuite:)
RispondiEliminaPer le modifiche del codice intendi andare nell'HTML del modello?
Bene, sono sì uno "smanettone" d'indole e di solito me la cavo,
ma sono molto apprendista e questo codice è pieno di righe con un sacco di diciture e codici colore.
Dove posso trovare i riferimenti almeno delle voci principali indicate nel designer modelli? (titoli, link ...)
Oppure puoi indicarmele tu???
Grazie grazie ciao ciao
D
La mia domanda è: come riconoscere le linee da modificare e a cosa fanno riferimento??? Grazie
EliminaD
@DavideFacheris
EliminaSu Modello > Modifica > HTML ci puoi andare quando vuoi invece su Modello > Personalizza si rischia di perdere le modifiche già fatte. Il codice da modificare ovviamente dipende dal tipo di modifica :)
Sì ho capito grazie mille!
EliminaPer ora avanzo un attimo con i contenuti e poi per ora i colori sono riuscito ad intonarli,
poi se avrò bisogno mi farò vivo.
Grazie mille di nuovo ciao ciao.
P.S. mi spieghi cos'è l'antipixel? E' un link o qualcosa del genere al tuo sito ? non capisco bene il nome
@DavideFacheris
EliminaL'antipixel andava di moda qualche tempo fa. Ora un po' di meno
http://www.ideepercomputeredinternet.com/2008/09/strumenti-per-creare-antipixel.html
http://www.ideepercomputeredinternet.com/2009/08/creare-e-mostrare-nel-blog-il-codice-di.html
ciao Ernesto, ti seguo da quando ho aperto il mio blog: http://homemade-ideas.blogspot.it/
RispondiEliminaVorrei inserire un menu orizzontale a tendina ed ho letto decine di tuoi post a riguardo e provato codici su codici senza trovarne uno compatibile.
In questo caso, ad esempio, compare una lista semplice di menu e sottomenu.
E' veramente una missione così impossibile??
Help
@ Home Ma.Id
EliminaE' veramente difficile trovarne uno che funziona. Lo è tanto di più quando si parte da un modello non ufficiale di Blogger che si scarica da internet. In questo caso molte personalizzazioni sono pressoché impossibili.
il modello è di blogger...ma non credo possa risolvere cambiando modello, giusto?
Eliminauffff dovrò rinunciare all'idea di avere un menù a tendina, vero?
@ HomeMa.Id
EliminaSe il modello è di Blogger allora dovresti prendere in considerazione l'ipotesi che tu abbia sbagliato qualche passaggio. Sarebbe la prima volta che questo menù non funziona in un modello di Blogger senza altri javascript
Ernesto,
RispondiEliminaho notato che la tua barra menù non sballa più in concomitanza con i tilt di "Dropbox", a differenza di tutti i miei javascript: è perché l'hai caricata su qualche altro host? Posso chiederti di quale si tratta? Grazie,
Giuliana
@# Uso Google Code
Eliminahttp://www.ideepercomputeredinternet.com/2011/01/come-caricare-i-file-javascript-su.html
Ciao Ernesto, voglio modificare l'altezza delmenù, cioè delle schede, come posso fare?
RispondiEliminaPier
@# Prova a editare il CSS ddlevelsmenu-base.css
EliminaDovresti trovare delle righe del tipo
width: 160px; /*width of menu (not including side paddings)*/
sotto metti una riga del tipo
height:80px;
salva il file,caricalo su Dropbox e sostituisci l'URL. Al posto di 80px puoi mettere un altro valore
Questo commento è stato eliminato dall'autore.
RispondiEliminaCiao Ernesto,
RispondiEliminac'è una cosa che non capisco: ho un blog che è identico al mio come modello, layout, widgets e misure; ho installato il Matt Black menù mantenendolo invariato, eppure risulta troppo corto e spostato verso sinistra. Però dovrebbe essere ben compatibile, visto che il modello Blogger è esattamente lo stesso. Tu hai idea del perché succeda questo?
Ti ringrazio,
Giuliana
Fa parte di quelli che sono i misteri inspiegabili di Blogger :)
Elimina@#
:D
EliminaCiao, sai se è possibile integrare una casella di ricerca all'interno del primo menù orizzontale?
RispondiEliminaIn teroria tutto è possibile però si tratterebbe di un lavoro lungo. Dovresti analizzzare i due file CSS per poi aggiungerci un altro elemento magari con il sistema usato in quest'altro menù
Eliminahttp://www.ideepercomputeredinternet.com/2014/07/drop-down-menu-blogger-search-social-network-icons.html
@#
Grazie, vedo un pò che riesco a fare basandomi su quel menù. Nel caso ti faccio sapere :)
EliminaCi sono riuscito, è stato più facile del previsto: è bastato aggiungere un elemento div alla topbar come se fosse un'ulteriore voce del menù, incollandoci dentro il codice della barra di ricerca presente nel css dell'altro menù al link che mi hai fornito ;)
EliminaCiao! volevo semplicemente AGGIUNGERE TRE LIVELLI IN UNA DELLE PAGINE CHE HO DEL MENU' BASE DEL TEMA..che devo guardare? perchè tutti fin'ora mi aggiungevano un altro menù al mio..
RispondiEliminaGrazieee!
Avrei capito anche se avessi scritto in minuscolo :)
EliminaOgni menù fa storia a sè. Se un menù è a un solo livello non se ne possono aggiungere altri ma al massimo si può cambiare con un altro
@#