Este componente de tema está obsoleto en favor de Subcategorías con sangría en Discourse. Por favor, cámbiate a ese, es mucho más simple y fácil de usar. Este repositorio ya no se mantendrá y se archivará alrededor del 20 de febrero de 2026.
Resumen
Sangra/anida categorías o subcategorías seleccionadas en la barra lateral
Hay dos formas de usar este simple componente de tema: para seleccionar categorías o subcategorías para sangrar (o anidar) en la barra lateral; o para permitir sangrar todas excepto una lista seleccionada de categorías. La mayoría de las personas querrán sangrar solo las subcategorías, por supuesto, para que parezcan anidadas, pero puedes sangrar cualquiera de tus categorías listadas. Funciona tanto en la vista de escritorio como en la móvil, así como en el menú desplegable del encabezado. Gracias a @dax por parte del código.
Hay 3 configuraciones: usa solo la primera, o la segunda y la tercera, dependiendo de lo que necesites hacer.
Configuración
Descripción
indent only select categories
Lista de categorías o subcategorías seleccionadas para sangrar.
indent all categories except the following
Habilita esta configuración si quieres sangrar todas las categorías excepto las de la lista de configuración de abajo. La configuración de lista de arriba debe estar vacía.
categories not to indent
categorías que no se deben sangrar
Capturas de pantalla de la configuración y los resultados en la barra lateral
Nota: si deseas ocultar el icono de candado en las viñetas de las categorías para categorías privadas como en mis capturas de pantalla de arriba, puedes usar este componente.
Sin embargo, no satisface del todo la necesidad de mi instancia. Tengo muchas subcategorías y pocas categorías, y las subcategorías son bastante dinámicas.
Sería mejor para nuestra instancia si todas las categorías y subcategorías estuvieran indentadas por defecto y la lista fuera para las categorías que no deberían estar indentadas.
Hmm, déjame pensar en esto. Veo a qué te refieres. Voy a experimentar un poco, pero abordaré tu caso de uso de todos modos (con un componente separado o un par de configuraciones adicionales). También estaba pensando en incluir una configuración que permitiera formatear u ocultar las viñetas de la subcategoría.
He actualizado el componente para permitir la configuración de categorías indentadas de la manera opuesta: es decir, indentando todas excepto una lista seleccionada. Espero que esto ayude a tu caso de uso.
Por favor, actualiza este componente. Hice una pequeña actualización hoy para solucionar un problema en el que el botón “Todas las categorías” también se estaba aplicando sangría si se estaba utilizando la configuración indent all categories except the following.
¿Hay alguna forma de ajustar esto para que funcione también con Sub-Sub-Categorías?
Así habría 2 niveles de sangría disponibles.
Por ejemplo:
Tenemos la categoría de Aprendizaje, con las Sub-Categorías (Herramientas de Aprendizaje y Cómo hacer), las Sub-Sub-Categorías de Juegos y Mejores Prácticas.
(Aprendizaje - herramientas de aprendizaje - juegos) y (Aprendizaje - Cómo hacer - Mejores Prácticas)
Los ojos se preguntarán porque no hay líneas rectas. Por eso intentamos mantener el espaciado, etc. lo más uniforme posible en textos, barras de herramientas… Y al mismo tiempo, los iconos y los colores también cambian. El icono de la categoría principal tiene cierto valor informativo, otros no. Eso no facilita la navegación, sino todo lo contrario. Y todo eso es básicamente la razón principal por la que la anidación profunda es una mala idea, sin importar si hablamos de libros o de la web. Además, pierdes espacio valioso y los nombres de las categorías ya no son nombres.
Y si realmente tienes tal cantidad de temas específicos que debes usar varias categorías principales y al menos la misma cantidad de subcategorías, porque tienes muchas sub-subcategorías (y todo el tiempo las principales y las de primer nivel son solo encabezados que muestran otras categorías), eso conducirá a una barra lateral tan larga que absolutamente nadie la usará.
Odio decir esto en voz alta, pero parece exactamente lo mismo que los fragmentos de CSS donde las intenciones se usan para mostrar la estructura lógica de los pares { }. Nunca está destinado a la lectura.
Gracias por exponer tus ideas aquí, @Jagster. Realmente aprecio tus comentarios.
Haces muchos puntos excelentes, especialmente sobre no crear una barra lateral excesivamente larga y que los colores e íconos no combinen.
Ojalá pudiera expandir las categorías anidadas como un acordeón, entonces podríamos tener lo mejor de ambos mundos, una barra lateral corta, pero también una navegación rápida por el sitio.
Te recomendaría leer este tema, especialmente las publicaciones sobre el foro de Wix y la simplicidad de sus categorías.
También ten en cuenta que tus usuarios pueden personalizar sus propias secciones de la barra lateral de categorías.
Sinceramente, no veo cómo las sub-subcategorías funcionarían aquí con anidación; creo que crearía un poco de desorden visual. Ni siquiera estoy seguro de si es posible integrarlo en este componente…
Acabo de instalar esto en mi instancia y ninguna de mis subcategorías se está indentando…
Al menos eso es lo que pensaba. Lo configuré para que indente todo excepto las elegidas, y dejé la lista en blanco.
Al principio no me di cuenta de que estaba indentando todo, incluidas las categorías.
¿Hay alguna forma de actualizar esto con una casilla para simplemente “indentar todas las subcategorías”? Puedes agregar una lista de exclusión si quieres, pero en mi caso de uso, siempre quiero que las subcategorías se indenten y nunca que se indenten las categorías.
Para su caso de uso, ¿por qué no simplemente poner las categorías en el cuadro Categorías a no indentar?
Estoy de acuerdo, sería más agradable simplemente indentar subcategorías. Sin embargo, en el momento en que @Lilly desarrolló este TC, fue bastante difícil de lograr. Personalmente, encuentro que la solución anterior es muy factible a menos que sus categorías sean inusualmente dinámicas.
Ya que estoy aquí…
Solicitud de función: subcategorías expandibles/contraíbles
Esto se discute aquí:
Me pregunto si funcionaría como una extensión de este Componente de Tema.
Potencialmente podríamos tener algo de presupuesto para esto si alguien está interesado en unir fuerzas.
Como curiosidad, he descubierto que el JS que añadí (tuve que hacer más modificaciones que puedo compartir) funciona como una solución provisional, ya que básicamente solo pliega las subcategorías cuando la página carga y permite al usuario expandirlas o visitar las parentelas insertando un chevron. El único problema es que algunas interacciones vuelven a reescribir la navegación por completo, por lo que el JS tiene que volver a aplicar sus clases para mantener las subcategorías colapsadas (como al interactuar con el icono de hamburguesa en la parte superior, o en el móvil, por ejemplo).
Claro, eso es lo que estoy haciendo. Simplemente no lo “entendí” de inmediato.
Solo es un problema ahora mientras estoy construyendo un sitio nuevo, ya que sigo agregando categorías y subcategorías. Una vez que el desarrollo esté terminado, las cosas serán prácticamente estáticas.
Este componente de tema está obsoleto en favor de Discourse Indented Subcategories. Por favor, cambie a ese, es mucho más simple y fácil de usar. Este repositorio ya no se mantendrá y se archivará en un mes.
Este componente de tema está obsoleto en favor de Subcategorías con sangría en Discourse. Por favor, cámbiate a ese, es mucho más simple y fácil de usar. Este repositorio ya no se mantendrá y se archivará alrededor del 20 de febrero de 2026.
