Pubblicato il 17/08/13 - aggiornato il  | 27 commenti :

Come creare un menù a tendina con le pagine statiche nei blog di Blogger a Visualizzazione Dinamica.

Come creare un menù drop down o a tendina con le pagine statiche di un blog di Blogger a Visualizzazione Dinamica o Dynamic Views.
I blog su Blogger da anni danno la possibilità di aggiungere delle pagine statiche che non finiscono nei normali feed del sito e che servono per creare delle gallerie di foto, delle pagine di info, delle raccolte di articoli o delle landing page particolari per i navigatori.

Queste pagine creano un menù orizzontale o verticale di default. Per effettuare la scelta si va su Pagine > Mostra pagine come. Le tre opzioni sono: Schede in alto, Link laterali e Non mostrare. Il menù orizzontale viene creato con la selezione di Schede in alto che è poi quella impostata come predefinita. Questa funzione è rimasta sostanzialmente la stessa anche nei modelli a Visualizzazione Dinamica. Ricordo che si possono creare fino a 20 pagine statiche per ogni blog. In taluni modelli un tale menù molto lungo si dispone su due file mentre in alti mostra solo i primi elementi.

Ho già pubblicato degli articoli su come personalizzare il menù nei normali template e su come aggiungere dei bordi di divisione. In questo post vediamo come sia possibile creare un menù verticale a tendina nei modelli Dynamic Views. Ecco uno screenshot esemplificativo

menù-pagine-statiche-dynamic-views

Il menù orizzontale sarà visualizzato a tendina in tutti e 7 i modelli a Visualizzazione Dinamica. Può essere una soluzione quando si abbiano molte pagine statiche e si voglia mantenere un layout compatto. Si va su Modello > Personalizza > Avanzato > Aggiungi CSS. Nel campo in alto a destra si posiziona il cursore subito dopo altro codice, se questo fosse presente, e si incolla il seguente CSS

#header.header .header-drawer #pages.tabs ul li{
margin: 99999px;
}

Si posiziona il cursore dopo l'ultima parentesi graffa e si clicca su Invio. Si va quindi in alto a destra su Applica al blog. Si dovrebbe vedere già l'anteprima in ogni caso si apre il sito per verificare che il menù sia diventato a tendina come nello screenshot precedente.




27 commenti :

  1. Ho un quesito per le pagine statiche. Tempo fa ho inserito in html un codice che mi permettesse di avere le immagini dei post ,tutte della stessa grandezza. Oggi però ho un problema nelle pagine statiche cioè non posso inserire piccole immagini perchè fanno riferimento al comando da me modificato. Vedi link pagina statica (http://www.diemmemakeup.com/p/collaborazioni_19.html) C'e' un modo per ovviare a questo problema? Spero di aver spiegato bene. Grazie di esistereeeeeee

    RispondiElimina
    Risposte
    1. Un modo c'è. Leggi questo post nella sua parte finale
      http://www.ideepercomputeredinternet.com/2014/01/how-to-resize-blogger-images.html
      dove ci sono i casi particolari. In sostanza nelle immagini che non vuoi ridimensionare devi inserire width height con il tag !important
      @#

      Elimina
  2. Ciao Ernesto. Non trovo queste impostazione per le pagine del mio blog. Da che dipende?? Vorrei aggiungere il menu a tendina

    RispondiElimina
    Risposte
    1. Nel post non si parla di impostazioni ma solo di aggiungere un codice in quello che viene chiamato Designer Modelli e che si apre andando su Modello -> Personalizza
      @#

      Elimina
  3. Ciao Ernesto, il tuo blog è molto molto interessante.
    Ma per i modelli semplici, o travel, quindi non statici, non è possibile fare niente per creare un menù a tendina, oppure, se non a tendina, degli argomenti con le sottosezioni, non importa se rimangono statiche.
    Esempio: nel mio blog vorrei creare delle sezioni con: viaggi, pensieri, curiosità ecc. con i vari post elencati sotto, così che rimanga ben organizzato e comprensibile. E' possibile? mille grazie

    RispondiElimina
    Risposte
    1. Il tuo blog è questo?
      http://iosonoilmiobuddha.blogspot.it/
      Non è un modello dinamico quindi puoi scegliere uno di questi menù
      http://www.ideepercomputeredinternet.com/2011/03/i-migliori-menu-per-blogger.html
      Guarda un po' quello che è migliore per le tue esigenze e poi prova a installarlo
      @#

      Elimina
    2. Grazie vado subito a vedere, il mio blog che mi interessa al momento è un altro, ma fatto simile. Ti ringrazio moltissimo!!!

      Elimina
    3. Ernesto ho guardato i menù e per me è troppo complicato applicarli, ho provato ma non mi riesce. Il blog che voglio modificare è www.ilgustodellanima.blogspot.it, In pratica vorrei che le etichette di sinistra fosse: Viaggi e sotto tutti i titoli, anche non a scomparsa. Pensieri e sotto i titoli ecc Esiste un menù per super inesperti come me? :-) mille grazie

      Elimina
    4. Il più semplice credo sia questo
      http://www.ideepercomputeredinternet.com/2011/06/menu-orizzontale-semplice-ma.html
      provaci :)
      @#

      Elimina
    5. grazie lo provo subito! :-)

      Elimina
    6. Ernesto alla fine ho scelto la soluzione più semplice, cioè ho creato delle pagine e inserisco manualmente i titoli che mi interessano per avere un indice organizzato... :-) molto rudimentale lo so, ma ti ringrazio lo stesso moltissimo per i tuoi consigli, scusa se ci ho messo tanto a darti un feedback ma non trovavo più questa pagina!

      Elimina
  4. Per tornare alla vecchia impostazione senza tendina?
    Ho tolto il css ma rimane invariata
    http://www.giorgioschimmenti.com/

    RispondiElimina
    Risposte
    1. Oltre a toglierlo devi anche andare su Applica al blog
      @#

      Elimina
  5. Ciao Ernesto,
    ho una domanda non inerente a questo tuo articolo sui menu, ma riguarda la Visualizzazione Dinamica.
    Nel tuo elenco di articoli per VD non ho trovato niente inerente.
    Siccome nella barra laterale destra non si può inserire il Modulo Contatti, volevo metterlo in una pagina statica nella barra di navigazione.
    Secondo te è possibile questo? Come?
    Grazie per la tua attenzione.

    RispondiElimina
    Risposte
    1. Ho testato ed è possibile come potrai vedere in questo post anche con uno screenshot
      http://www.ideepercomputeredinternet.com/2015/03/blogger-modulo-contatto-post-pagina-statica.html
      @#

      Elimina
    2. Grazie Ernesto, come al solito sei... super.
      Vedo che alcune soluzioni per il template classico vanno bene anche per il DV, c'è sempre da azzeccare quella giusta e provare...

      Se mi permetti avrei un'altra domanda:
      si possono mettere le icone affianco ai titoli, fatti come menu, delle pagine statiche?

      in effetti quello che chiediamo sono cose che dovrebbero sistemare e ampliare quelli di Google che hanno sviluppato il programma DV e altro....mah????

      Elimina
    3. Modificare i modelli DV è sempre una impresa. In teoria potrebbe anche essere possibile. Al massimo si possono modificare le icone dei widget
      http://www.ideepercomputeredinternet.com/2014/08/dynamic-views-icone-social-network-pagine-widget.html
      @#

      Elimina
    4. Salve Ernesto,
      le istruzioni di questo tuo articolo sono valide per TUTTE le voci (pagine statiche) di menu che sono nella barra;
      mentre per fare una tendina SOLO di una voce-pagina statica (per esempio "autori dei post") come si deve fare?
      Grazie per la tua attenzione e dedicazione.

      Elimina
    5. In questo momento non ti so dire. Prova a andare sul widget Pagine e vedi se è possibile selezionare solo la pagina che hai intenzione di vedere. Non so se nei template DynView sia disponibile quel widget
      @#

      Elimina
    6. Grazie per la risposta,
      ma forse non mi sono spiegato bene.
      Nella barra di menu ho diverse pagine statiche, oltre la home page, in una di queste pagine (titolata: Autori dei posts) ho inserito HTML un elenco degli autori.
      E' proprio questo elenco che voglio fare vedere a tendina, già nella barra del menu, favorendo così la scelta dell'autore SENZA aprire la pagina.
      Puoi dare un'occhiata al blog in blogspot con nome iesurun.
      Grazie ancora.

      Elimina
    7. Nel codice precedente prova a sostituire
      #pages.tabs ul li
      con
      #pages > ul > li:nth-child(6) > a
      o con
      #pages.tabs > ul > li:nth-child(6) > a
      Il codice l'ho ricavato con questo tool
      http://www.ideepercomputeredinternet.com/2015/07/ispeziona-elemento-chrome-selettore-univoco-css-html.html
      Non so se funzionerà ma puoi provare anche tu a trovarlo
      @#

      Elimina
    8. Grazie per la risposta.
      Neanche così va bene.
      La seconda possibilità, poi, mette TUTTE le voci in tendina, mentre a me interessa SOLO la voce n.6.
      Cioè mettere in tendina solo l'elenco "interno" alla pagina, ovvero mostrare nella voce di menu autori una tendina con tutti gli autori.

      Elimina
  6. Non è che posso avere la soluzione per tutto 😐
    @#

    RispondiElimina
    Risposte
    1. Certamente, ma lo stesso fai tantissimo per noi profani.
      Grazie ancora.

      Elimina

Non inserire link cliccabili altrimenti il commento verrà eliminato. Metti la spunta a Inviami notifiche per essere avvertito via email di nuovi commenti. Se ti ho aiutato con il post o con le risposte ai commenti condividi su Facebook o su Twitter. Grazie.