italia / design-wordpress-theme

Tema di WordPress per la Pubblica Amministrazione che implementa Bootstrap Italia.
https://italia.github.io/bootstrap-italia/
GNU Affero General Public License v3.0
68 stars 49 forks source link

Megamenu e breadcrumbs #22

Open moritzpg opened 5 years ago

moritzpg commented 5 years ago

Ciao @marcogargano, complimenti per il lavoro svolto. Vorrei riscrivere il sito della mia scuola con Wordpress impiegando il tuo tema e vorrei sapere cortesemente se prevedi l'implementazione del Megamenu così come previsto dalle linee guida Bootstrap Italia. Analogo discorso per il breadcrumbs.

Grazie Mille!

megamenu

MarcoGargano commented 5 years ago

Ciao @moritzpg grazie per i complimenti 😊 Per quanto riguarda il megamenu, è mia intenzione integrarlo, ma devo trovare una soluzione semplice per riuscire a gestirlo in WordPress; non vorrei creare classi da poi dover far inserire all'utente, non tutti sono così skillati. Mentre i breadcrumbs, sono già integrati, soprattutto nei template DI.

Dimmi pure se qualcosa non ti torna.

moritzpg commented 5 years ago

Grazie @marcogargano per la risposta 😊. Sono alla prima esperienza con WP e sto cercando di entrare nella logica di questo CMS dopo aver lavorato per tanti anni con Joomla che ha un'impostazione totalmente diversa.
Circa i breadcrumbs vorrei mostrarli sempre, nella stessa posizione, subito dopo il main menu orizzontale, ma ho notato che compaiono di default solo nelle pagine degli articoli, non nelle pagine statiche e non sempre nella stessa posizione. Dalla demo che hai pubblicato, a titolo di esempio, ho riportato la pagina uffici che non ha il breadcrumb mentre le altre due pagine lo propongono ma in posizioni diverse. C'è la possibilità di riproporlo per tutte le pagine del sito (pagine statiche e articoli)?

Grazie!

bread_1

bread_2

bread_3

MarcoGargano commented 5 years ago

Ciao @moritzpg i breadcrumbs li ho integrati solo nei post, nelle pagine non so se possano essere così utili. Per i post, puoi scegliere il template da usare (trovi la selezione nell'editor del post), quelli che hai postato sono screenshot di due template diversi: il primo sviluppato da poco e in linea con i prototipi di Design Italia, il secondo una versione più semplice. Non ho voluto sovrascrivere il template di default, per non modificare quanto già utilizzato da chi ha installato il tema in precedenza.

Una possibilità sarebbe creare diversi template per diversi utilizzi, per esempio con o senza breadcrumbs, però finirebbe in fondo alla lista delle cose da fare 😅

moritzpg commented 5 years ago

Ciao Marco, a mio parere i breadcrumbs sono sempre utili per dare il massimo livello di usabilità e fornire una navigazione coerente in tutto il sito. A titolo di esempio, in ambito scolastico, immaginiamo una serie di pagine statiche gerarchiche : Home/Offerta formativa/Indirizzi di studio/Servizi Informativi Aziendali. In qualsiasi momento l'utente saprebbe a quale contesto fa riferimento l'ultima pagina visitata e potrebbe risalire la gerarchia delle pagine (per consultare ad esempio gli altri indirizzi di studio) senza operare sui menu. Vantaggio ancora più evidente nella versione mobile.

Mi rendo conto che non è fra le priorità e proverò a trovare una soluzione accettabile. Grazie di nuovo per la risposta e buon lavoro 😊.

ignazios commented 5 years ago

Ciao Marco, sto cercando di personalizzare il tuo tema per l'amministrazione per cui lavoro attraverso un child e mi interesserebbe molto l'implementazione del MegaMenu. A che punto sei nello sviluppo di questo componente?

Grazie

MarcoGargano commented 5 years ago

Ciao @ignazios lo sto finendo di sviluppare, in settimana spero di rilasciarlo.

ignazios commented 5 years ago

Grazie Marco

MarcoGargano commented 5 years ago

@ignazios ho rilasciato il mega-menu, ho fatto anche un post sulla demo con un minimo di spiegazione. Se vuoi provarlo e dirmi se trovi qualche bug... grazie 😁

ignazios commented 5 years ago

Grazie dell'ottimo lavoro fatto. lo ho provato e funziona bene.

moritzpg commented 5 years ago

Ciao @marcogargano, ho provato la modifica in locale e funziona perfettamente. Riorganizzerò i menu in funzione del Megamenu e pubblicherò l'aggiornamento. Questo è il sito in corso di allestimento: http://www.itcsatta.edu.it .

Grazie mille per il lavoro svolto!

ignazios commented 4 years ago

Ciao Marco, scusa il disturbo, ho implementato il mega menu che hai realizzato e su display di grande dimensioni non ci sono grossi problemi se non per il fatto che il menu si apre al passaggio del mouse, forse sarebbe meglio aprirlo chiccandoci sopra per evitare aperture indesiderate. Il grosso problema lo riscontro su dispositivi mobili, l'apertura del menu è pogo usabile, sarebbe meglio aprire il menu in un blocco in primo piano esterno alla pagina come avviene nella maggior parte dei Burger Menu di questo tipo image

Credi che sia possibile?

PAPPOMN commented 4 years ago

Buongiorno Marco il Megamenù con il browser Microsoft Edge ha dei problemi. Prova a controllare

MarcoGargano commented 4 years ago

Ciao @ignazios attualmente non ho integrato alcuna libreria js nel tema e per ottenere il risultato ottimale devo lavorarci un po'; il menu è generato da WP e quindi bisogna intercettarlo mentre lo costruisce. Al momento ho integrato una versione CSS only (tenendo cmq conto dei device touch). Ci sono ancora diverse cose che vorrei integrare, ora mi sto occupando dei template di pagina.

@PAPPOMN grazie per la segnalazione, devo andare in cerca di un Edge 😅

rambo1986 commented 4 years ago

Ciao @marcogargano , seguo questo post per capire se c'è modo di sistemare il mega menu con Edge. DI fatto non è utilizzabile con quel browser e (purtroppo) qualcuno che lo usa c'è :-)

MarcoGargano commented 4 years ago

Ciao @rambo1986 anche questa è sicuramente una questione che devo affrontare 😅 Tra l'altro non capisco neanche più a che versione sono arrivati, ma soprattutto l'ultimo è basato su Chronium!?!?! 😱 Cercherò di capire come fare...

rambo1986 commented 4 years ago

Ciao @rambo1986 anche questa è sicuramente una questione che devo affrontare 😅 Tra l'altro non capisco neanche più a che versione sono arrivati, ma soprattutto l'ultimo è basato su Chronium!?!?! 😱 Cercherò di capire come fare...

Ciao @marcogargano, se può aiutare per il momento ho risolto il problema con edge mettendo a 0px le voci

border-top-left-radius: 0px; border-top-right-radius: 0px;

La visualizzazione e l'estetica di fatto non ne risentono.

Spero di essere stato utile.

Ciao e buon lavoro!

ignazios commented 4 years ago

Ciao Marco, ci siamo sentiti qualche volta per quanto riguarda i megamenu, adesso sono implementati e funzionano abbasanza bene, se non fosse che si attivano al passaggio del mouse e questo di per se non è un grosso problema, ma mi sono accorto facendo test di accessibilità che non sono navigabili da tastiera. Mi spiego con il tasto tab si seguono i link ma non viene visualizzato il menu.

Come si può risolvere il problema? magari togliendo l'Hover della visualizzazione e riportando il menu attivabile con il click come avviene sul sito di Bootstrap Italia, si risolverebbe il problema.

Grazie per l'attenzione che mi dedicherai.

MarcoGargano commented 3 years ago

Ciao @ignazios è un'evoluzione che vorrei integrare nel tema. Al momento l'utilizzo di js è veramente al minimo e per garantire questo funzionamento dovrei integrarlo ...lo metto nella lista 😉