Header Categories Navbar è un semplice componente che aggiunge un menu di link alle categorie principali all’intestazione del sito, con scorrimento orizzontale del contenuto in eccesso aggiunto se e quando necessario.
Questo è davvero fantastico, Kris! Si combinerà magnificamente con il sidebar, permettendo ai gatti principali in alto e una breve selezione personalizzata sulla barra.
Ho notato due piccoli problemi di UX che potrebbero davvero migliorarlo se affrontati:
UX: Evidenziazione della selezione della categoria
Quando ci si trova in un elenco di categorie, la categoria corretta ha un bel sottile sottolineato.
Tuttavia, questo non persiste se si entra in un argomento o in una sottocategoria.
Sarebbe bello se persistesse in entrambe le situazioni.
UX: scorrimento / overflow su mobile
C’è un bel piccolo dissolvenza / freccia sottile visibile quando c’è overflow delle categorie sul desktop.
L’overflow è molto più probabile su mobile, ma sul mio dispositivo (Chrome / Android) questi sottili indizi non sono presenti e non è chiaro che lo scorrimento sia possibile.
Potrebbe anche aiutare rendere la barra delle categorie un po’ più alta su mobile per facilitare lo scorrimento.
Inoltre, la categoria selezionata non viene automaticamente visualizzata - ciò significa che non è evidente che sia selezionata a meno che l’utente non scorra la barra di navigazione. Questo è davvero fondamentale.
Solo desktop?
Mi chiedo se non sia ancora pronto per il mobile e sarebbe molto utile avere un’impostazione per applicarlo solo al desktop (almeno per ora).
Brillante: molto felice di dare un feedback quando viene ascoltato! Ho notato che hai dovuto apportare diverse aggiunte.
Lo prenderò come un bel piccolo regalo di Natale l’uno all’altro .
Hai risolto questo problema quando è stata inserita una sottocategoria: meraviglioso!
Tuttavia, non si applica quando viene inserito un argomento: è intenzionale? Personalmente, credo che avrebbe senso se la categoria rimanesse evidenziata mentre l’utente è “dentro” di essa, il che include gli argomenti e non solo le visualizzazioni di scoperta delle categorie.
Inoltre, quando entro in un’altra pagina (come /admin), la categoria rimane selezionata. Sarebbe meglio se in questo caso non venisse selezionata alcuna categoria.
Ora vedo lo sfumare sul cellulare, ma non una freccia/chevron. Se possibile, questo sarebbe molto utile poiché lo sfumare è piuttosto sottile:
Desktop:
Mobile:
Richiesta #1 - UX
Nascondi la barra di navigazione durante lo scorrimento di un argomento. Diventa un po’ troppo affollato!
Inoltre, potrebbe essere meglio sul desktop posizionare la barra di navigazione dove si trovano il breadcrumb/tag nell’immagine invece che sotto di essi.
Richiesta #2 - Funzionalità
Potresti aggiungere una classe CSS a ciascuna Nav Pill in modo che sia facile nasconderne alcune se necessario?
Lo chiedo perché ho un paio di categorie padre (private) che sono solo genitori per abilitare le sottocategorie e ingombrano la navigazione generale in modo indesiderato.
Per ora le ho nascoste usando il loro href, ma ovviamente è piuttosto rischioso!
Richiesta #3 - UX
Un’opzione per ordinare le categorie della barra laterale alfabeticamente.
Mentre implemento questo, ho rimosso le categorie padre dall’elenco predefinito delle categorie della barra laterale. Ciò significa che i miei utenti ora hanno solo un elenco di 1-5 sottocategorie che sono rilevanti per loro.
Tuttavia, sono un po’ disordinate e senza un ordine logico poiché l’ordine su /Categorie per le sottocategorie non ha molto senso. Sarebbe molto utile che queste sottocategorie fossero in ordine alfabetico per aiutare in questo!
Ciao! Prima di tutto, vorrei sottolineare che questo è un componente molto utile dell’argomento e ti ringrazio per il lavoro svolto
Nella mia istanza, questo componente ha causato un errore, ho verificato la compatibilità con altri plugin e componenti del tema e a questo punto non ho ancora trovato un conflitto. Il componente stesso potrebbe essere la causa?
Abilitare questo componente distorce la presentazione del contenuto.
Ecco un video:
Per rilevare un errore, è necessario fare clic su qualsiasi post dalla pagina degli ultimi post /latest, il post si aprirà in modalità standard, quindi è necessario tornare alla pagina degli ultimi post.
Ho notato che il testo nella barra di navigazione delle categorie dell’intestazione è cambiato improvvisamente in font-up-1 (mentre penso che prima fosse font-down-1). Questo è piuttosto stridente e sgradevole, poiché è lo stesso di tutte le altre pillole di navigazione.
L’ho sovrascritto con questo CSS, che è molto più gradevole:
// corregge la dimensione del testo della barra di navigazione dell'intestazione
.custom-categories-navbar .nav-pills > li > a {
font-size: var(--font-0);
}
Preferisco in realtà font-0 perché è sufficientemente diverso e un po’ più facile da usare.
Ciao, ho appena notato un bug che puoi riprodurre così. Su mobile:
1- Clicca su una categoria nell’intestazione
2 - Clicca su un post nella categoria e scorri fino alla fine
3 - Clicca sulla stessa categoria nell’intestazione
Tutta l’intestazione della categoria scomparirà. L’ho appena provato sul mio forum e sulla demo
MODIFICA:
è lo stesso se vai in una categoria e aggiorni (f5) la pagina. Tutte le categorie scompariranno.