¿Es posible insertar un código HTML, CSS o JS?

En este artículo aprenderás a insertar código HTML, CSS y JS en las páginas creadas con systeme.io.

Necesitarás:

  • Una cuenta en systeme.io
  • Un código HTML, CSS o JS

¿Por qué agregar código personalizado en tus páginas?

Al agregar código HTML a tus páginas, es posible agregar estilo, funcionalidad o estructura personalizada al contenido de imágenes, textos, enlaces, etc.

Por ejemplo: 

  1. Para personalizar el estilo, puedes agregar código CSS.
  2. Para agregar animaciones a una página o elementos individuales (por ejemplo cuando se pasa el mouse o al hacer clic en un botón) agrega código JS.
  3. Para agregar títulos o texto en general, crear tablas, partes y divisiones en tu página, agrega código HTML.

Notas importantes:

Al agregar código personalizado en las secciones código de encabezado, código de pie de página, código de seguimiento o código HTML, no incluyas ninguna de las siguientes etiquetas:

  • <head> </head>     
  • <footer> </footer>  
  • <html> </html>  
  • <body> </body>  

Al agregar un video usando un iframe, no se requieren etiquetas adicionales.

Incorrecto:

<div> 
    <iframe src="link to your video"></iframe>
</div>

Correctao:

<iframe src="enlace a tu video"></iframe>

1. Agregar código en la sección código de seguimiento:

Para insertar el código de seguimiento de Meta, ve al túnel de ventas de la página donde quieres insertar el código.

Selecciona a la izquierda la página de túnel y haz clic en Editar página.

Luego, clic en Configuración, arriba a la izquierda y desplázate a la sección Seguimiento. 

1.1 Códigos a insertar en la sección encabezado 

En esta sección, debes pegar cualquier código que deba estar dentro de las etiquetas  <head> y </head> de una página.

1.2 Códigos a ser insertados en la sección pie de página

En esta sección, agrega cualquier código destinado al Document Object Model (DOM).

2. Agregar código en la configuración de los túneles de ventas:

Algunos códigos (como el código de seguimiento) deben ser agregados a todos tus túneles.

Para evitar repetir el proceso de pegar el código en cada página de cada túnel, puedes aplicarlo globalmente a los túneles automáticamente.

Para hacerlo, ve a tu foto de perfil, haz clic en Configuración y luego clic a la izquierda en Túneles de ventas. Pega el código de seguimiento en la casilla Código de seguimiento y haz clic en Guardar.

3. Agregar un elemento Código HTML a la página:

También es posible insertar cualquier código HTML directamente en una página desde el editor.

1. Agrega el elemento Código HTML arrastrándolo a la parte deseada de tu página.

2. Haz clic en el elemento para mostrar su configuración (1).

En el panel izquierdo, haz clic en Editar código para desplegar la ventana emergente en donde puedes pegar tu código (2).

Agrega el código HTML en la casilla de texto (3), luego clic en Guardar (4).

Asegúrate de guardar tus cambios antes de salir. Una vez los cambios se hayan guardado, la versión anterior de la página no podrá ser restaurada.

Nota: el código HTML no aparece en el modo de vista previa. Solo será visible en la página publicada.