¿Cómo puedo ocultar el enlace de Badges en la barra lateral?

Imagino que la personalización de la barra lateral se añadirá a su debido tiempo, pero por ahora me gustaría eliminar el enlace “Insignias”, o al menos ocultarlo dentro de “Más…”.

¿Debería simplemente usar CSS para ocultarlo, por el momento?

No logro entender el CSS. Los divs que contienen los enlaces son de la clase sidebar-section-link-wrapper sin ningún id. Cuando intento ocultar la etiqueta a con a.sidebar-section-link-badges { display: none; }, no oculta nada.

2 Me gusta

Hola, en el menú hamburguesa he usado “nth-child” para hacer este tipo de cosas

https://www.w3schools.com/cssref/sel_nth-child.asp

1 me gusta

nth-child es muy útil para muchas cosas, sin embargo, en este caso, creo que es probablemente peligroso. Dado que se basa únicamente en números, para esto requeriría una garantía de que los Badges permanecerán en la misma posición.

Si se agrega/elimina/mueve algo más antes, la posición de los Badges cambiará, lo que podría llevar a que los Badges se revelen, algo más se oculte y eso podría pasar desapercibido.

:has() es ideal para esto, sin embargo, lamentablemente su soporte todavía es limitado, en particular está deshabilitado por defecto en Firefox y falta en muchos navegadores móviles.

Si ocultarlo no es crítico para ti, es decir, es aceptable ocultarlo donde sea posible para una mejor experiencia, mientras que sea visible en navegadores que aún no admiten :has(), puedes usar el siguiente selector:

sidebar-section-link-wrapper:has(a.sidebar-section-link-badges) { display: none; }
1 me gusta

Gracias por las ideas. Probablemente haré eso por ahora. Pero espero que se puedan agregar ids.

1 me gusta

Hola,

Puedes ocultarlo con esto. :slightly_smiling_face:

.sidebar-section-link-wrapper {
  .sidebar-section-link.sidebar-section-link-badges {
    display: none;
  }
}
6 Me gusta

¡Acabo de copiar y pegar esto en mi antiguo componente temático (que hizo lo mismo con el antiguo menú hamburguesa) y funcionó! Muchas gracias, y gracias de nuevo a todos los demás también.

3 Me gusta

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.

Lamentablemente, este CSS no parece funcionar con 2.9.0beta12… ¿alguna idea? :slight_smile:

Este todavía me funciona en la última versión.


¿Puedes compartir tu código?

1 me gusta

Me disculpo. Sí funciona. Lo había comentado porque había un error con el enlace “Más”.

Ese error es que el enlace se muestra incluso cuando no hay opciones de menú “Más”. Con la cantidad de opciones en mi foro, con la opción de Insignias presente, aunque no la quiera ahí, ¡al menos “Más” tiene algo que hacer! (El problema persiste… cuando estás en la página de Insignias, el enlace inútil “Más” está ahí). "More..." shows in sidebar when there is nothing more

Por alguna razón, la función “pegar url sobre texto para crear hipervínculo” no funcionó al editar esta publicación.

Entiendo. En realidad, creo que eso no es un error porque las opciones del menú Más están ahí pero ocultas, por lo que no está vacío. Pero si entiendo correctamente, ¿ocultas todo dentro del menú Más? Si este es el caso, ¿creo que ocultar toda la sección Más sería mejor?

Para ocultar el menú desplegable Más de todas las páginas:

// ocultar menú Más de todas las páginas
.sidebar-more-section-links-details {
  display: none;
}

Si deseas ocultarlo en una página específica, puedes usar la clase del cuerpo para apuntarla.
Puedes encontrarla aquí.

Por ejemplo, en la página de insignias se verá así:

// ocultar menú Más de una página específica (insignias)
body.badges-page {
  .sidebar-more-section-links-details {
    display: none;
  }
}

Esto ocultará el menú desplegable Más pero mostrará Insignias en la barra lateral.


Pero si usas el código anterior para ocultar Insignias, tampoco aparecerá.

// ocultar elemento del menú Más de insignias
.sidebar-section-link-wrapper {
  .sidebar-section-link.sidebar-section-link-badges {
    display: none;
  }
}

// ocultar menú Más de una página específica (insignias)
body.badges-page {
  .sidebar-more-section-links-details {
    display: none;
  }
}

1 me gusta

Lo veo como un error porque no creo que una opción de “Más” deba aparecer nunca a menos que haya más cosas y, por lo tanto, hacer clic en “Más” tenga algún efecto. El informe de error está aquí: "More..." shows in sidebar when there is nothing more

Este tema se cerró automáticamente después de 617 días. Ya no se permiten nuevas respuestas.