Ocultar etiquetas e emblemas do Hamburger apenas para convidados

Quiero que la interfaz de usuario de usuario desconectado sea lo más simple posible, así que me preguntaba si podría ocultar etiquetas e insignias del menú de hamburguesa solo para los invitados.

Sé que esto se puede hacer fácilmente con CSS desde esta publicación:

Pero, ¿cómo compruebo la condición de que el usuario es un invitado y luego oculto los elementos del menú? Probablemente necesite llamar a una función para verificar esto (al igual que WordPress), pero no tengo idea de cómo funcionaría eso en Discourse. ¿Alguien puede ayudar?

Los usuarios anónimos tienen una clase anon a la que puedes dirigirte, por lo que podrías usar algo como:

.anon {
.hamburger-panel .menu-panel {
  a.latest-topics-link,
  a.top-topics-link,
  a.badge-link,
  li a.categories-link { 
    display: none
   }
  }
} 

(Acabo de añadir la clase anon al ejemplo del otro tema. Necesitarías ajustarlo para ocultar las cosas específicas que quisieras)

3 Me gusta

Esto funcionó a la perfección. ¡Gracias! Lo único que queda por ocultar es el enlace de las etiquetas, pero no parece tener su propia clase. ¿Cómo lo apunto? Con la clase widget-link se ocultan los enlaces Acerca de, Preguntas frecuentes y Vista móvil.

1 me gusta

Esta parece prometedora:

1 me gusta

[quote=“Eliminar "Etiquetas" del menú hamburguesa con CSS, post:2, topic:160196”]
.menu-panel li a.widget-link[href=“/tags”] { display: none; }
[/quote]

Perfecto. Este es el código final que funcionó. También oculté la barra separadora. ¡Gracias Jammy!

/*ocultar enlace de etiquetas y insignias del menú hamburguesa para invitados */
.anon {
.hamburger-panel .menu-panel {
  a.latest-topics-link,
  a.top-topics-link,
  a.badge-link,
  li a.widget-link[href="/tags"],
  .menu-container-general-links
    {
    display: none
   }
  }
}
3 Me gusta

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