Característica de la página de inicio

Probablemente puedas hacerlo con algo de CSS.

Antes del último mensaje, probé lo siguiente. Solucionó el problema con el tamaño de fuente de la característica, pero hizo que el tamaño de fuente de la lista de temas del resto de la página de inicio fuera súper pequeño.

.featured-topic {
    font-size: 9px;
}

¿Te refieres a estos enlaces?
image

No veo ningún cambio en el resto de la página si cambio eso.

Puedes ver la lista de temas a continuación después de aplicar el código CSS anterior. El tamaño de la fuente se volvió bastante pequeño.

SNAG-0000

Eliminé el código CSS y el tamaño de fuente en la lista de temas volvió a la normalidad.

SNAG-0001

De acuerdo. Intenta esto:

.featured-topic h3 a {
  font-size: 9px;
}
1 me gusta

¡Gracias! ¡Funciona!

1 me gusta

Solicitud de característica: por favor, añadan la capacidad de mostrar un extracto del tema

¿Es posible que la función de etiqueta (Tag-Feature) tenga un error o se comporte de manera inesperada cuando se trabaja con un Grupo de Etiquetas restringido?
Creé un Grupo de Etiquetas con la siguiente restricción:

Las etiquetas son visibles para todos, pero solo los siguientes grupos pueden usarlas

  • Administradores, Moderadores

featured1
Añadí la etiqueta ‘featured’ de este componente a este Grupo.

Estas son las configuraciones de mi componente:

Cuando creo un tema como Administrador con la etiqueta ‘featured’, la etiqueta es visible para mí y para los moderadores, pero no para otros grupos de usuarios. Para otros usuarios registrados, solo se muestra exactamente así:

Etiqueta1, Etiqueta2,

Para los Administradores y Moderadores, la etiqueta ‘featured’ se mostrará correctamente:

Etiqueta1, Etiqueta2, featured

Otra cosa: si está oculta, creo que la coma no debería mostrarse. Esto confunde a los usuarios.
Además, no estoy seguro de si esto es relevante, pero los hilos están en categorías que solo son visibles para usuarios registrados, no para invitados.
Ah, y por cierto: ¡Gracias por el componente, es un trabajo increíble! Aparte de esa pequeña característica, funciona perfectamente para mí.

Jaja, encontré uno de mis propios temas antiguos mientras buscaba una pequeña molestia :slight_smile:

Así que acabo de darme cuenta (otra vez) de que las imágenes reales que se cargan son enormes en comparación con su tamaño real renderizado. En mi caso, se está cargando una imagen de 1000x1000px y renderizándolas a < 200px.

Revisé algunos datos y, si pudiera reemplazarlas por la versión de 400x400px, eso ahorraría alrededor del 83% en ancho de banda (para la fila destacada), o 1,6 MB en total. Sé que estas imágenes están en caché, pero esto definitivamente tendrá un impacto en la carga inicial de la página y supongo que tampoco ayudará a acelerar el renderizado de la página, ¿verdad? Estoy usando estas imágenes destacadas en cada página de mi foro, así que creo que el impacto es real.

¿Sería posible agregar una opción a la configuración del TC para que podamos elegir qué tamaño de imagen usar, para que todos podamos ajustarlo a su propio tema?

1 me gusta

¡Buena observación! Ha pasado un tiempo desde que revisé este componente, así que pude hacer una pasada de mejoras generales:

https://github.com/discourse/discourse-homepage-feature-component/pull/96

Esto actualiza las imágenes para usar srcset, de modo que se utiliza automáticamente la imagen apropiada para el contenedor. Los tamaños disponibles se pueden configurar mediante una nueva configuración featured_image_sizes.

También he corregido la configuración hide featured tag (no funcionaba, por lo que las etiquetas siempre estaban ocultas) y actualicé la configuración de tipo de etiquetas en lugar de la entrada de texto plano. Esto también significa que se pueden usar varias etiquetas si se desea.

1 me gusta

Genial, ¡gracias! Creo que esto también soluciona el problema con la etiqueta destacada que faltaba, lo cual era realmente desconcertante.

Una cosa, sin embargo: desde la actualización, esto ha iniciado MUCHOS trabajos de procesamiento de imágenes; ahora tengo más de 20.000 en cola. ¿Es eso de esperar? Parece bastante un desperdicio, ya que solo necesito realmente los últimos 5…

1 me gusta

Hmm, sí, buen punto. Desafortunadamente, no hay forma de evitar esto. Creo que probablemente vale la pena revertir esa parte por eso. Lo estoy haciendo aquí:

La realidad es que no puedo generar un subconjunto específico de imágenes de miniatura optimizadas de un tema de esta manera; tiene que ser todo o nada. Así que necesitaremos algún otro método para optimizar casos más limitados como este.

1 me gusta

Entendido. ¿Se eliminarán automáticamente los miniaturas no necesarias más adelante?

Y parece que mi tema ya tiene un montón de formatos de imagen diferentes que podrían funcionar bien, como los de 400x400 o 500x500. ¿Qué tal si hacemos que sean seleccionables? En comparación con los 1024x1024 que se usan actualmente, eso ya daría un buen ahorro de ancho de banda, sin ningún sobrecosto adicional de procesamiento/almacenamiento.

(ignore los de 300x300, 600x600 y 900x900 que fueron añadidos por la actualización de TC):

-rw-r--r-- 1 1000 www-data 723K Jun 23 21:32 80c77ac08d5671a1dc6d2a15ddea28e6d56f98c9_2_1000x1000.jpeg
-rw-r--r-- 1 1000 www-data 757K Jun 23 21:32 80c77ac08d5671a1dc6d2a15ddea28e6d56f98c9_2_1024x1024.jpeg
-rw-r--r-- 1 1000 www-data  30K Jun 23 21:32 80c77ac08d5671a1dc6d2a15ddea28e6d56f98c9_2_200x200.jpeg
-rw-r--r-- 1 1000 www-data  68K Jun 23 21:32 80c77ac08d5671a1dc6d2a15ddea28e6d56f98c9_2_300x300.jpeg
-rw-r--r-- 1 1000 www-data 118K Jun 23 21:32 80c77ac08d5671a1dc6d2a15ddea28e6d56f98c9_2_400x400.jpeg
-rw-r--r-- 1 1000 www-data 185K Jun 23 21:32 80c77ac08d5671a1dc6d2a15ddea28e6d56f98c9_2_500x500.jpeg
-rw-r--r-- 1 1000 www-data 263K Jun 23 21:32 80c77ac08d5671a1dc6d2a15ddea28e6d56f98c9_2_600x600.jpeg
-rw-r--r-- 1 1000 www-data 417K Jun 23 21:32 80c77ac08d5671a1dc6d2a15ddea28e6d56f98c9_2_750x750.jpeg
-rw-r--r-- 1 1000 www-data 470K Jun 23 21:32 80c77ac08d5671a1dc6d2a15ddea28e6d56f98c9_2_800x800.jpeg
-rw-r--r-- 1 1000 www-data 595K Jun 30 22:18 80c77ac08d5671a1dc6d2a15ddea28e6d56f98c9_2_900x900.jpeg
1 me gusta

No creo que sea así, porque las imágenes originales siguen en uso y estas son versiones optimizadas. No hay ningún daño real, aparte de ocupar algo de almacenamiento.

Podrías limpiarlas desde la consola de Rails; esto cubre los tamaños que se incluyen por defecto para la configuración, y no eliminará imágenes generadas desde un modificador en otro lugar.

# 1. Ver qué existe realmente frente a lo que sigue registrado legítimamente
still_needed = Topic.thumbnail_sizes +
  ThemeModifierHelper.new(theme_ids: Theme.pluck(:id)).topic_thumbnail_sizes

TopicThumbnail.group(:max_width, :max_height).count

# 2. Eliminar los tamaños no deseados (archivos + registros)
[[300, 300], [600, 600], [900, 900]].each do |w, h|
  next if still_needed.include?([w, h]) # no tocar tamaños que otra cosa siga usando

  TopicThumbnail
    .where(max_width: w, max_height: h)
    .find_each { |tt| tt.optimized_image&.destroy! }

  # los registros de intentos sin imagen optimizada no hacen cascada
  TopicThumbnail.where(max_width: w, max_height: h).delete_all
end

Ah, sí, buena idea — puedo comprobar qué miniaturas existen ya y, si hay alguna, usar el mejor tamaño. Si solo están disponibles los originales, siempre funcionarán como alternativa.

Haciendo esto aquí:

2 Me gusta

Genial, ¡lo probaré esta noche!

Y acabo de volver aquí para volver a mencionar una vieja petición mía: ¿sería posible añadir una opción para ordenar la fila destacada por fecha de etiquetado? Nuestro orden de destacados no está determinado por la fecha de creación de un tema NI por la última actividad - para nosotros es el momento en que aplicamos la etiqueta lo que debería determinar el orden. No me había dado cuenta antes, pero nuestra fila destacada es un poco un desastre ahora mismo :wink:

1 me gusta

Lamentablemente, no creo que eso sea posible… no tenemos una forma de ordenar la lista de temas por la fecha en que se añadió una etiqueta. Una forma de solucionarlo sería editar la marca de tiempo del tema.

1 me gusta

Sin problema. Por ahora lo estoy solucionando con un poco de cinta adhesiva: he bifurcado tu TC y creado una consulta en Data Explorer para obtener los temas destacados, ordenados por fecha de etiquetado e incluyendo las URLs de las imágenes. Un pequeño script web externo carga y almacena en caché estos datos y devuelve el JSON al TC. Funciona como un encanto, aunque sea un poco feo :wink:

Estoy encantado de compartir mi código y consulta si alguien lo necesita.

2 Me gusta

Actualización: Vale, me di cuenta de que esto solo era la mitad de mi problema. También usamos el componente de características de la página de inicio (Homepage Feature TC) para mostrar una galería de las obras destacadas. Y el orden de clasificación de la galería ya no coincidía con el de nuestra fila de destacados, lo que confundía a los visitantes (y me molestaba a mí). Así que la galería también tenía que clasificarse por fecha de etiquetado, no solo por fecha de creación del tema o última actividad.

Y aquí es donde me puse travieso y recurrí a Claude Code para que me ayudara. Primero, le pedí que creara un pequeño plugin para añadir una opción que permitiera clasificar las listas de etiquetas por fecha de etiquetado, como /tag/featured?order=tag_date.

Una vez que funcionó, extendí la opción de clasificación en el componente de características de la página de inicio añadiendo tag_date. También cambié el widget de casillas de verificación a un menú desplegable:

¡Y voilá! Ahora tengo una fila de destacados que se comporta como quiero (y, francamente, como creo que debería :wink: ), Y una galería que coincide:

Si alguien quiere probarlo, aquí está mi código:

Puedes verlo en acción en https://blenderartists.org/

Advertencia: todo esto es trabajo de Claude Code. Revisé lo que pude, pero en última instancia no soy un experto en esto. Actualizaré estos elementos según sea necesario, ya que son una parte clave de nuestra comunidad de gráficos 3D.

¡Disfrutadlo!

1 me gusta