Tengo un script de chat de Hubspot incrustado en el archivo index.html de mi aplicación React usando la etiqueta <script/> para la comunicación con el usuario.
Ahora, cuando se hace clic en un botón, quiero que se oculte el contenedor hubspot y luego, cuando se hace clic en otro botón, quiero que se muestre nuevamente.
No tengo control sobre el comportamiento del ícono de chat porque se agregó a la página a través de una etiqueta <script/> .
Pero después de investigar un poco, pude obtener la identificación del elemento, así que así es como intenté alternar la visibilidad del chat, pero no me funcionó.
const toggleHubspotContainer = (turnOn) => { let hubSpotContainer = document.getElementById("hubspot-messages-iframe-container"); if (turnOn) { hubSpotContainer.style.display = 'block'; return; } hubSpotContainer.style.display = 'none'; //The chat icon is not hiding even after this } Tenga en cuenta que la secuencia de comandos hubspot se agregó en el archivo index.html de esta manera
<script type="text/javascript" id="hs-script-loader" async defer src="//js-eu1.hs-scripts.com/adadadad.js"></script>¿Hay alguna manera de hacer esto correctamente?
Gracias.
Prueba esto, considera que tu script está en el encabezado
function hideHb() { var head = document.getElementsByTagName('head').item(0); var js = document.getElementById("hs-script-loader"); head.parentNode.removeChild(js); }