Ho imparato a creare temi e a lavorare con i temi nelle ultime settimane, dato che siamo in quella fase della migrazione, o meglio, siamo pronti a concentrarci quasi esclusivamente su quello.
Ho fatto cose fantastiche e interessanti con i componenti dei temi, ma sto cercando di capire qualcosa che mi ha bloccato per tutta la sera.
Su mobile, come sposto l’elenco delle sottocategorie mostrato nella pagina delle categorie (usiamo le categorie con argomenti in primo piano come predefinite) sopra l’elenco degli argomenti e sotto il titolo della categoria.
Ci sono due modi per affrontare la questione: se devi cambiare l’ordine dell’HTML stesso… allora non c’è altra scelta che sovrascrivere il template. Questo non è l’ideale per la manutenibilità a lungo termine perché se cambiamo qualcosa su cui il template fa affidamento, questo potrebbe rompere la tua personalizzazione.
L’altro modo sarebbe con CSS, che dovrebbe essere più facile da mantenere. Non l’ho testato a fondo, quindi dovresti tenere d’occhio gli effetti collaterali… ma questo può riordinare le cose nel modo in cui stai cercando:
.mobile-view .category-list {
tbody {
display: flex;
flex-direction: column
}
.subcategories-list {
order: -1
}
tr:first-child { // questa è la sezione del titolo della categoria
order: -1
}
}
Questo converte il layout della tabella per utilizzare flexbox, che consente agli elementi fratelli di essere riordinati con order.
Questo è dove siamo arrivati finora. (Attualmente stiamo usando Graceful come template di base per tutte le nostre modifiche per cercare di avvicinarlo a ciò a cui gli utenti sono abituati). Usando la tua correzione, sono stato rapidamente in grado di cambiare anche l’ordine in cui apparivano le descrizioni delle categorie una volta visto cosa faceva il tuo codice sopra.