Obtener nombre de categoría usando JS

Desarrollador
1

Hola, quizás alguien pueda ayudar.
Necesito obtener el nombre de la categoría de la página actual.
Lo necesito en un script de JS que pueda agregar al pie de página o al cuerpo.
He probado varias soluciones, pero no logro que sea estable, especialmente con las transiciones de página del usuario.
Planeo pasar el nombre de la categoría resultante como un evento en Google Analytics para contar las visitas de cada categoría.

2

Podría haber una manera de hacerlo de forma consistente tanto en las páginas de temas como en las de categorías, pero he obtenido el ID de categoría de dos maneras diferentes… una para las páginas de categorías:

<script type="text/discourse-plugin" version="0.8">
const container = Discourse.__container__;
const controller = container.lookup('controller:navigation/category');

api.onPageChange((url, title) => {
  console.log(controller.get("category.id"));
});
</script>

y una forma similar para las páginas de temas:

<script type="text/discourse-plugin" version="0.8">
const container = Discourse.__container__;
const controller = container.lookup('controller:topic');

api.onPageChange((url, title) => {
  console.log(controller.get("model.category_id"));
});
</script>

En el ejemplo de la página de categoría, también puedes usar category.name o category.slug, pero con el modelo de tema solo está disponible el category_id, por lo que tendrías que hacer un poco más de trabajo allí para obtener el nombre. El ID podría ser una mejor opción de todos modos, ya que es consistente incluso si el nombre o el slug de la categoría cambian.

9 Me gusta
4

Logré obtener el ID de categoría para las páginas de Categoría y Tópico, pero cuando voy a la sección de Preguntas Frecuentes (FAQ) u otra página, también se muestra el ID de categoría de la página anterior. ¿Cómo puedo evitar esto?

Aquí está mi código; funciona, aunque no conozco JavaScript en general.

<script type="text/discourse-plugin" version="0.8">
const container = Discourse.__container__;

api.onPageChange((url, title) => {
    const topic = container.lookup('controller:topic');
    const topic_cat_id = topic.get("model.category_id");
    if(typeof topic_cat_id !== "undefined")
    {
        gtag('event', 'Categories Views Analytics', {
            'event_category': 'Topic Page',
            'event_label': topic_cat_id,
        });
        console.log("Topic " + topic_cat_id);
    } else {
        const category = container.lookup('controller:navigation/category');
        const category_cat_id = category.get("category.id");  
        
        if(typeof category_cat_id !== "undefined") 
        {
            gtag('event', 'Categories Views Analytics', {
                'event_category': 'Category Page',
                'event_label': category_cat_id,
            });  
            console.log("Category " + category_cat_id);
        } else {
            gtag('event', 'Categories Views Analytics', {
                'event_category': 'Other Page',
                'event_label': 'Other Page'
            });              
            console.log("Other");
        }
    }
});
</script>

Debo haber cometido algún error con las variables o necesito obtener un controlador de otro tipo de página.

1 me gusta