⬇️ Título desplegable

Componente temático
1

:mag: Resumen

Este componente de tema te permite añadir enlaces con texto, iconos y menús desplegables al encabezado nativo de tu sitio Discourse.

image
image1440×1024 123 KB

Se aceptan informes de errores, solicitudes de funciones y PR; el patrocinio permite que el equipo de Pavilion priorice el trabajo en este componente.

:computer: Código

Ver el repositorio de GitHub

:gear: Ajustes

Hay una variedad de ajustes que puedes configurar para personalizar el componente, incluyendo personalizaciones de enlaces, fuentes de iconos, adición de seguridad de enlaces, posicionamiento, etc.

Una lista de todos los ajustes y explicaciones detalladas sobre ellos se puede encontrar aquí.

:thinking: Cuándo Usar

Este componente es útil si deseas iconos, enlaces y enlaces desplegables en línea con el encabezado existente de Discourse. Es una excelente manera de tener muchos enlaces accesibles sin desorden innecesario o que la barra lateral se salga de control.

Si necesitas muchos enlaces desplegables, consulta Submenús del encabezado, que crea una fila de menú en el encabezado encima del encabezado original de Discourse.

Aunque este componente también admite la adición de enlaces solos sin los menús desplegables, si solo necesitas enlaces sin menús desplegables, no dudes en usar Enlaces de encabezado personalizados.

:clapper: Vista previa

Escritorio:

Desktop

Móvil:
Debido a la falta de espacio en el móvil, los enlaces se pueden activar tocando el botón de flecha hacia abajo.

Mobile
Mobile640×1292 48.5 KB

Instalar Componente de Tema

49 Me gusta
2

No estoy seguro de por qué, pero esto no parece funcionar para mí, tan pronto como se habilita mi encabezado desaparece, en un tema limpio sin otros componentes, también probé varios temas base.

<div id="ember7" class="d-header-wrap ember-view"><div></div></div>

2.9.0.beta4

(c99a6b10fb)

1 me gusta
3

Hola @Fma965, mis disculpas, he implementado algunas correcciones para pequeños errores, con suerte ahora debería funcionar para ti. Hazme saber cómo va.

3 Me gusta
4

¡Funciona muy bien ahora, gracias!

5

Una cosa a tener en cuenta es que, dado que estos no usan etiquetas a, no puedes hacer clic con el botón central del ratón en los enlaces como puedes hacerlo en el plugin de enlaces de encabezado, ¿hay alguna razón por la que no estés usando etiquetas a?

2 Me gusta
6

@Fma965

Hmm.. ese es un punto interesante. La razón por la que no usé etiquetas <a> es porque cada enlace es un widget que puede generar un menú desplegable si hay elementos desplegables presentes. Al usar el widget, también aprovecho el método click() que llama a: DiscourseURL.routeTo(this.attrs.url);.

Esto tiene algunos beneficios, como mantener el historial de dónde te encuentras en un tema. Por ejemplo, si haces clic en un enlace a un tema con una etiqueta de anclaje, siempre te lleva al principio del tema. Sin embargo, si ya has visitado el tema antes y estabas leyendo a la mitad del tema, el enfoque routeTo te llevará a esa misma posición en el tema.

Me pregunto si hay una manera de agregar funcionalidad de clic central a los clics de widgets… tendré que investigar eso, tal vez alguien del equipo de Discourse tenga una idea.

1 me gusta
7

Sí, supuse que estaría relacionado con esto, solo era algo que uno de mis moderadores me mencionó, pensé que lo plantearía aquí por si acaso :slight_smile:

1 me gusta
8

Hola Keegan, ¡gracias por crear este componente temático! Es el puente perfecto entre los componentes Custom Header Links y Header Submenu que había mirado antes.

¿Hay alguna posibilidad de añadir una opción ‘target’ (abrir en una nueva pestaña) a los enlaces que añadimos allí, como en los otros dos componentes temáticos?

1 me gusta
9

Estoy poblando manualmente los elementos del submenú desde una fuente externa y envío un par de solicitudes ajax dentro de un bucle para recuperarlos. Naturalmente, si hay muchos elementos. El componente se carga antes de que todas las solicitudes finalicen y faltan algunos elementos. ¿Es posible modificar la fuente para lograr esto?

1 me gusta
11

Componente increíble. Gracias por compartirlo :heart:.

12

¡Hola! Gracias por este fantástico componente :slight_smile:

Parece que falta un margen a la derecha cuando no se está conectado en el foro. Así es como se ve:
Capture d’écran 2022-12-05 à 16.22.20

Sin embargo, si estoy conectado, está bien.

Espero que ayude a mejorarlo.

13

¿Hay alguna posibilidad de que haya:

  1. ¿Enlaces a URLs eternas?
  2. ¿Enlaces de destino para abrir en nuevas pestañas como se mencionó anteriormente?

Estamos configurando una nueva instancia en los servidores de Discourse e intentamos que nuestro menú de Discourse coincida lo más posible con nuestro sitio de WP.

Gracias

1 me gusta
14

Acabo de instalar este componente para reemplazar los componentes “Custom Header Links” y “Easy Footer”.

¡Y me encanta este componente, es genial!

Funciona para mí. ¿Te refieres a un _blank target o algo así o a URLs externas en general (que funcionan para mí)?

Noté una cosa: en dispositivos móviles no puedo desplazarme hacia abajo. Parece que tengo demasiados menús. :wink: ¿Se puede ajustar esto?

2 Me gusta
15

Acabo de hacer una PR para ese problema:

Si revisas el enlace de arriba, puedes ver que el CSS ajustado funciona como debería. :slight_smile:

3 Me gusta
16

Hola, ¡gracias por este gran componente!
Sin embargo, he notado que cuando hago clic en un enlace, todos los textos e íconos se reemplazan con los del último elemento.

También noté que si hago clic en el logo, los textos e íconos de los enlaces cambian.

Adjunto un breve ejemplo en video:

El enlace de la página es: https://oii.francescomancuso.it/forum/

¿Cómo puedo solucionarlo? ¡Muchas gracias de antemano!

17

¡Gran tema-componente! :chefs_kiss:

Sería aún mejor si también pudiéramos configurarlo para que los enlaces se abrieran en una nueva pestaña, en lugar de en la misma pestaña como ahora. :+1:

18

Hola Francesco :wave:

Me gustaría echarle un vistazo, pero cambiaste el diseño y aparentemente ya no usas el componente para mostrar enlaces.

No puedo reproducir el problema en mi foro de prueba.

Si, por casualidad, puedes echarle otro vistazo y decirnos si sigues teniendo el problema, no dudes en hacerlo. :slight_smile:

Si se implementara dicha función, ¿crees que debería anular las preferencias de los usuarios con respecto a los enlaces externos (configuración Abrir todos los enlaces externos en una nueva pestaña)?

image

2 Me gusta
22

Hola, muchas gracias por tu respuesta.

Decidí cambiar los diseños para crear un gráfico uniforme en todas las áreas de mi plataforma.
Después de realizar una migración de dominio, verificaré si el error se resuelve.

Que tengas un buen día :smiley:

2 Me gusta
23

Creo que debería seguir las preferencias de los usuarios. A menos que haya sido anulado por un administrador o moderador :+1:

24

Entonces… Acabo de implementar este componente temático y ya hemos recibido comentarios bastante válidos de algunos de nuestros miembros más antiguos.

Así que, básicamente, si yo:

  • (1) hiciera clic primero en el botón de búsqueda en la cabecera y luego
  • (2) pasara el ratón sobre la cabecera desplegable.
    → La cabecera desplegable aparecería debajo del cuadro de búsqueda, que no es lo que buscamos. Lo ideal sería que la barra de búsqueda desapareciera antes de que apareciera el menú desplegable.

Mientras que si pasara el ratón sobre la cabecera desplegable primero y luego hiciera clic en el botón de búsqueda, se comportaría como esperaba, es decir, (1) el menú desplegable desaparece y (2) aparece la barra de búsqueda.

Otro miembro también se quejó de cómo se ve en el móvil, ¿hay alguna manera de habilitar este componente temático solo en el escritorio?

Gracias :+1:

1 me gusta