Reordenar menú lateral de Discourse

[Lilly]

	Resumen	Permite reordenar las secciones predeterminadas y personalizadas del menú de la barra lateral
	Vista previa	https://discourse.theme-creator.io/theme/Lilly/discourse-sidebar-menu-reorder
	Repositorio	https://github.com/Lillinator/discourse-sidebar-menu-reorder
	Guía de instalación	Cómo instalar un tema o un componente de tema
	¿Nuevo en los temas de Discourse?	Guía para principiantes sobre el uso de temas en Discourse

Instalar este componente de tema

Introducción

He observado varias solicitudes de administradores de Discourse que desean reordenar las secciones del menú de la barra lateral, incluidas las secciones personalizadas globales. Dado que actualmente no es muy intuitivo ni sencillo para la mayoría de las personas hacerlo con CSS, y que hacerlo puede ser difícil de gestionar y modificar, he creado un componente de tema que facilita mucho esta tarea en la interfaz de administración.

Descripción general

Este componente de tema de Discourse permite a los administradores reordenar las secciones del menú de la barra lateral de su foro en la interfaz de administración de usuarios, incluidas todas las secciones predeterminadas, así como cualquier sección personalizada visible globalmente.

El componente funciona tanto para las vistas de la barra lateral en escritorio como en móviles, así como para el modo de menú desplegable en la cabecera (aunque idealmente está diseñado para el modo de barra lateral).

---

Instalación & Configuración

• Instale este componente de tema siguiendo la Guía para principiantes sobre el uso de temas en Discourse.
• La sección community se refiere a la sección superior predeterminada de la barra lateral: el menú con el encabezado Temas e incluye el submenú desplegable Más; se recomienda no mover más de una o dos secciones (predeterminadas o personalizadas) por encima de la sección community.
• No elimine ninguna de las secciones predeterminadas en la configuración, ya que quedarán desordenadas (siempre puede volver a añadirlas o restablecer la configuración).
• La mejor manera de configurar este componente es tener la pantalla de administración del componente con la configuración de la lista de reordenación en una ventana del navegador, y la vista de la barra lateral del foro como usuario de prueba en otra ventana junto a ella; recargue la página después de cada cambio en el orden de las secciones del menú en la lista.

---

Configuración

Configuración

Descripción

Orden del menú de la barra lateral

Una configuración de lista que contiene las secciones predeterminadas del menú. (community es la sección superior predeterminada en la barra lateral e incluye el submenú desplegable Más). Reordene las secciones del menú con las flechas arriba y abajo situadas a un lado. También se pueden añadir secciones personalizadas visibles globalmente: utilice el slug del nombre del menú (por ejemplo, para un menú personalizado titulado “Menú de prueba”, añada test-menu en la configuración).

El componente de tema tiene inicialmente la configuración predeterminada. Los administradores deben añadir cualquier sección de menú personalizada global que deseen incluir en la lista de ordenación y, a continuación, reordenarla junto con las secciones predeterminadas.

captura de pantalla de la configuración predeterminada del componente

---

Capturas de pantalla

Las capturas de pantalla siguientes muestran la sección community y dos secciones de menú personalizadas de ejemplo llamadas “Enlaces de desarrollo” (dev-links) y “Caja de herramientas” (toolbox) tal como aparecen en el panel de administración del componente a la izquierda y para un usuario normal a la derecha. Las flechas para mover una sección del menú hacia arriba y hacia abajo en la configuración del administrador del componente se muestran en el pequeño recuadro rojo.

---

Aquí, la configuración está configurada para mostrar la sección predeterminada categories por encima de la sección community (en modos colapsado y expandido):

A continuación, un ejemplo con dos secciones personalizadas: una llamada dev-links que se encuentra por encima de la sección predeterminada community, y otra llamada toolbox que está situada por debajo de la sección predeterminada tags.

Además, observe la sección llamada inbox-section en la captura de pantalla del administrador anterior: se trata de la sección Mensajes que el componente Sección de mensajes para la barra lateral inserta en la barra lateral (debajo del menú personalizado toolbox anterior), lo que demuestra que este componente también puede utilizarse para moverla.

Además, este componente de tema puede utilizarse junto con los componentes Menús de barra lateral por grupos y Subcategorías con sangría (véase en la captura de pantalla anterior).

---

Notas

• Tras añadir nuevas secciones personalizadas globales a la configuración sidebar_menu_order, los usuarios del foro verán el nuevo orden correcto del menú cuando recarguen su navegador o colapsen/expandan la barra lateral.
• Crear nuevas secciones de menú personalizadas globales mientras este componente está habilitado puede dar lugar a secciones duplicadas temporales para el administrador hasta que la barra lateral se vuelva a renderizar, ya sea con una actualización de la página o colapsando y expandiendo.
• Las secciones de menú personalizadas creadas por los usuarios siempre aparecerán en la parte inferior de la barra lateral para ese usuario, pero no se verán afectadas de otro modo.
• Si la configuración Admin -> Todos los ajustes del sitio -> Modo de barra lateral separado para el chat está establecida en Siempre, el botón de chat aparecerá como de costumbre en la parte inferior, y el componente ignorará las secciones predeterminadas del menú de chat (chat-dms, chat-channels y chat-search).

---

Consulta mi otro material de Discourse

[David_Ghost]

Es genial. Realmente me gusta usar la configuración de categorías (1) y luego chat (2). Muchas gracias por tu buen trabajo, Lilly.

[R23D_Printing]

¿Esto todavía es compatible? Intenté instalarlo y obtuve el siguiente error. Intenté desde aquí y también usando las instrucciones manuales.

[Moin]

Sí lo es. El enlace en el botón “instalar este componente de tema” está desactualizado, pero el enlace en la parte superior sigue siendo correcto y puedes usarlo para instalar el componente manualmente.

O prueba este botón:

Instalar este componente de tema

[nathank (Nathan Kershaw)]

Acabo de arreglar el enlace en el botón de instalación en el OP, así que todo bien ahora.

[nathank (Nathan Kershaw)]

He encontrado un pequeño error, donde el orden especificado no funciona cuando tengo una pantalla de escritorio inusualmente estrecha.

Así es como quiero que se vea:

   

Cuando tengo una pantalla de tamaño extraño (es decir, mi teléfono plegable, parece ser un ancho de 640-820 más o menos), pierdo el orden:

Pero en el in

[Lilly]

Dios mío, el regreso de la barra lateral de 2 columnas. ¿Pensé que esa cosa se había ido? Voy a echar un vistazo…

[nathank (Nathan Kershaw)]

¡En efecto, fui yo siendo un poco tonto! Estaba usando el componente antiguo y ni siquiera me di cuenta.

Sin embargo, he notado una cosa: lo que se llamaba community ahora se llama the-forum. Aquí hay un PR para arreglar eso en los valores predeterminados:

Update settings.yml (#3)

[Moin]

@nathank

lo que se llamaba community ahora se llama the-forum en su lugar

En mi foro todavía se llama community y aquí en Meta también.

Me pregunto cómo lo cambiaste.

[nathank (Nathan Kershaw)]

¡Eso es realmente extraño! Recuerdo haber cambiado el texto en algún momento ahora que lo pienso. ¡Pero no estoy seguro de cómo terminó eso en el HTML!

Retiraré ese PR y me romperé un poco más la cabeza. ¡Podría tener que seguir siendo una ‘peculiaridad’ de mi sitio!

[Lilly]

deberías poder ejecutar algunos comandos de rails para cambiarle el nombre de vuelta. si tu sección se llama realmente the-forum, entonces creo que esto debería funcionar desde la consola de rails:

cd /var/discourse
./launcher enter app
rails c

section = SidebarSection.find_by(title: 'the-forum', public: true)
if section
  section.update!(title: 'community')
  puts "Hecho: renombrado a 'community'."
else
  puts "Sección no encontrada."
end

definitivamente haz una copia de seguridad primero.

[nathank (Nathan Kershaw)]

Acabo de (por fin) probar esto. Sin embargo, no encontró la sección:

Creo que esto simplemente tendrá que permanecer como una peculiaridad del sitio, ¿verdad?

[Lilly]

(publicación eliminada por el autor)

[Lilly]

Nota: acabo de implementar algunas correcciones móviles para este componente: había comenzado a renderizar las líneas horizontales entre las secciones de la barra lateral, las cuales solo deben mostrarse en vistas de escritorio o tableta.