¿Cómo agregar JS en el After Header?

Hola!

Quiero añadir un script a “After Header” en mi componente de tema, pero no funciona.

código:

<button type="button" class="btn btn-outline btn-small" id="Send">Enviar</button>

<script>
var btn = document.querySelector('#Send');

btn.addEventListener('click', function(e) {
  e.preventDefault();
  
  this.disabled = true;
  
  setTimeout(function(){ btn.disabled=false; }, 10000);
});
</script>

El código funciona en otros bloques (Head, Body), pero necesito añadirlo en After Header.

¿Me pueden ayudar, cómo puedo hacerlo?

Quizás añadir el script en el encabezado y el botón después del encabezado.

Intento agregar un botón en after header y el código con el script lo agrego en header. Veo el botón, pero el script no funciona.

Solo funciona si agrego todo el código (botón + script) en head_tag, en otras secciones no funciona, necesito agregarlo en after_header :frowning:

Esto simplemente no es posible. Tenga en cuenta que la guía para desarrolladores menciona que solo tiene tres opciones para que se activen las etiquetas de script:

¿Hay alguna razón en particular por la que necesites el código en after_header? Puede haber otros enfoques que puedas tomar para lograr lo que necesitas.

Cuando intentaste separar el script en el head y el botón en el after_header, ¿estás seguro de que el script no se está activando en absoluto, o es que no puedes seleccionar el botón? Puede deberse a la forma en que funciona el Ember runloop.

Quizás puedas intentar envolver tu script en un

<script type="text/discourse-plugin" version="0.8" >
api.onPageChange(() => {
   var btn = document.querySelector('#Send');

   btn.addEventListener('click', function(e) {
     e.preventDefault();
  
    this.disabled = true;
  
     setTimeout(function(){ btn.disabled=false; }, 10000);
   });

});
</script>
3 Me gusta

Encontré la solución en: Add custom content that only appears on your homepage

Gracias :slight_smile:

2 Me gusta