Probablemente haya varias formas de abordar esto, pero intentemos hacerlo de la “manera correcta” utilizando los hooks de personalización adecuados.
Cuando agregas HTML a la sección del pie de página de un tema, Discourse realiza cierto procesamiento para evitar que se desplace entre transiciones de página o cuando se agregan más elementos con desplazamiento infinito.
Se agrega como un componente custom-html aquí.
Si revisas el código del componente, verás que dispara un evento de la aplicación cuando se renderiza.
Este es el hook que necesitas usar.
¿Cómo se usa?
Hay un método en plugin-api que te permite ejecutar código cuando se dispara un evento específico de la aplicación.
Como ya conocemos el nombre del evento, podemos usarlo de la siguiente manera:
api.onAppEvent("inserted-custom-html:footer", () => {
// realiza tu trabajo aquí
});
Dado que este es un método de plugin-API, debes cambiar el tipo de tu etiqueta script a text/discourse-plugin de la siguiente manera:
<script type="text/discourse-plugin" version="0.8">
api.onAppEvent("inserted-custom-html:footer", () => {
// realiza tu trabajo aquí
});
</script>
El fragmento anterior se ejecutará cada vez que se renderice el pie de página. Por lo tanto, ahora puedes hacer algo como esto:
<script type="text/discourse-plugin" version="0.8">
api.onAppEvent("inserted-custom-html:footer", () => {
$(".footer-div #footerNavDiv").click(function () {
console.log("evento de clic capturado");
// realiza tu trabajo aquí para el evento de clic
});
});
</script>
Puedes leer más sobre plugin-API aquí