1. Introducción.
Al activar la opción de usar HTML personalizado (que debe de hacerse de manera independiente para cada tipo de pantalla), se eliminan todas las personalizaciones por defecto de la página, pudiendo incluir los elementos individuales que componen la campaña y que detallamos en el tutorial Personalización avanzada con HTML propio.
Se mantiene una estructura básica de elementos HTML junto a un archivo de CSS básico, que controla el funcionamiento de los siguientes elementos comunes en todas las campañas: popups de login, bases legales, compartir campaña y mensajes de alerta.
2. Paso a paso.
Al activar HTML propio, nuestra plataforma te permite personalizar el contenido y los elementos que necesites para tu campaña, así como cargar librerías externas como es el caso del Framework Bootstrap.
Para incluir esta librería debes insertar, por un lado, el link para cargar el CSS después del código <!-- {{{ cool_tabs_head }}} --> y antes del cierre de la etiqueta </head> y, por otro lado, cargar el JavaScript de la misma antes de la etiqueta <!-- {{{ cool_tabs_body_end }}} -->
<!DOCTYPE html>
<html {{{ cool_tabs_html_attributes }}} >
<head>
<!-- {{{ cool_tabs_head }}} -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
</head>
<body {{{ cool_tabs_body_attributes }}} >
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous">
</script>
<!-- {{{ cool_tabs_body_end }}} -->
</body>
</html>
A partir de aquí, puedes incluir los elementos que necesites mediante nuestro sistema de {{handlebars}} y personalizarlos con tu propio CSS (o SCSS si lo prefieres).
En la página de Formulario, también puedes activar la opción de 'Incluir CSS básica en la pantalla del form' para cargar el CSS de nuestras campañas. Así conseguirás nuestra personalización por defecto del quiz y el formulario.
En resumen, si quieres cargar el framework Bootstrap, debes que incluirlo en todas las pantallas donde quieras usarlo, excepto en la pantalla de Formulario, ya que se carga por defecto, siempre y cuando elijas la opción Incluir CSS básica en la pantalla del form.
3. Otras especificaciones.
Si tienes dudas, puedes contactarnos en el email help@cool-tabs.com.
4. Contenido relacionado.
Personalización avanzada con HTML propio.
Cómo configurar la CSS personalizada de una campaña.
Comentarios
0 comentarios
Inicie sesión para dejar un comentario.