¿Cómo insertar código JavaScript o scripts en mi sitio web?

¿Cómo insertar código JavaScript o scripts en mi sitio web?

¿Para qué sirve?

El Editor JS permite cargar Analytics, píxeles, chatbots o automatizaciones sin tocar el código base del sitio.

Pasos

1. Panel → Configuración → Editar sitio → Diseño → Personalizar diseño → Editor JS.
2. Pega tus scripts entre <script>...</script> (puedes dejar comentarios y separar por líneas).
3. Guarda y prueba en una pestaña aparte.

Base recomendada (pegar una sola vez)

<script>
(function () {
  window.NX = window.NX || {};
  NX.onReady = function (fn) {
    if (document.readyState === "loading") {
      document.addEventListener("DOMContentLoaded", fn);
    } else { fn(); }
  };
  NX.waitFor = function (selector, cb, opts) {
    opts = opts || {}; var timeout = opts.timeout || 12000; var interval = opts.interval || 200; var start = Date.now();
    var timer = setInterval(function () {
      var el = document.querySelector(selector);
      if (el) { clearInterval(timer); cb(el); }
      else if (Date.now() - start > timeout) { clearInterval(timer); }
    }, interval);
  };
  NX.observeRerun = function (fn) {
    var t;
    new MutationObserver(function () {
      clearTimeout(t);
      t = setTimeout(fn, 250);
    }).observe(document.documentElement, { childList: true, subtree: true });
  };
})();
</script>

Ejemplos frecuentes

<!-- GA4 -->
<script>
(function () {
  var GA_ID = "G-XXXXXXXXXX";
  var s = document.createElement("script"); s.async = true;
  s.src = "https://www.googletagmanager.com/gtag/js?id=" + encodeURIComponent(GA_ID);
  document.head.appendChild(s);
  window.dataLayer = window.dataLayer || [];
  function gtag(){ dataLayer.push(arguments); }
  gtag("js", new Date());
  gtag("config", GA_ID);
})();
</script>

<!-- Meta Pixel -->
<script>
(function(f,b,e,v,n,t,s){
  if(f.fbq) return; n=f.fbq=function(){ n.callMethod? n.callMethod.apply(n,arguments):n.queue.push(arguments); };
  if(!f._fbq) f._fbq=n; n.push=n; n.loaded=!0; n.version="2.0"; n.queue=[];
  t=b.createElement(e); t.async=!0; t.src=v;
  s=b.getElementsByTagName(e)[0]; s.parentNode.insertBefore(t,s);
})(window, document, "script", "https://connect.facebook.net/en_US/fbevents.js");
fbq("init", "PIXEL_ID"); fbq("track", "PageView");
</script>

Más ideas: Hotjar, TikTok Pixel, chatbots externos, botón “volver arriba”, guardar/copiar cupones, etc. Evalúa cada script individualmente y elimina los que no uses.

Buenas prácticas

• Documenta cada script con comentarios.
• Si un proveedor te da el <script>...</script> completo, pégalo tal cual (no lo dupliques).
• Prueba siempre en incógnito o en otra pestaña antes de dejarlo activo.
• Complementa con [Insertar CSS] cuando necesites ajustar estilos.