¿Cómo agrego el banner de consentimiento de Termly a mi sitio de Website Builder?

Con el Termly add-on, puedes actualizar tu banner de consentimiento para personalizar su configuración y apariencia, y acceder a muchas otras funciones útiles que pueden ayudar a tu sitio web a cumplir con las leyes de privacidad.

A continuación, veremos los pasos para agregar el banner de consentimiento actualizado a tu sitio de Website Builder con el componente Código.

¿Te gustaría ver un video en su lugar?
Tenemos un video tutorial paso a paso sobre cómo usar el panel de control de Termly y agregar el banner de consentimiento a tu sitio de Website Builder: ver en YouTube.

• Antes de empezar
• Paso 1- Desactiva el banner de consentimiento en el panel de control de Website Builder
• Paso 2 - Inicia sesión en el panel de control de Termly
• Paso 3 - Escanea tu sitio web en busca de cookies
• Paso 4 - Personaliza tu banner de consentimiento
• Paso 5 - Copia el código HTML del banner de consentimiento
• Paso 6 - Elige el componente de Código en Website Builder.
• Paso 7 - Inserta el código del banner de consentimiento en tu sitio web
• Paso 8 - Cambia la configuración del componente Código
• Paso 9 - Inserta el código del centro de preferencias en tu sitio web.
• Paso 10 - Ajusta la ubicación y el estilo del enlace de tu centro de preferencias.
• Paso 11 - Guarda y publica tu sitio web

Antes de empezar

Para agregar el banner de consentimiento actualizado a tu sitio de Website Builder, necesitas una Suscripción a Termly y acceso al componente de Código de Website Builder. El componente de Código está incluido en los planes Website Builder Premium y Negocio + E-commerce. 

Paso 1- Desactiva el banner de consentimiento en el panel de control de Website Builder

Si ya estás usando el banner de consentimiento básico de Website Builder (que también proporciona Termly), desactívalo antes de incrustar el banner de consentimiento actualizado en tu sitio web.

1. Abre el panel de control de Website Builder desde el panel de control de one.com.
2. Haz clic en Configuración del sitio web y selecciona Banner de consentimiento en el menú de la izquierda.
3. Asegúrate de que el banner de consentimiento no esté habilitado - el selector debe verse en gris. Si el banner de consentimiento está activo, desactívalo haciendo clic en el selector.
4. Publica tu sitio web.

#step-2Paso 2 - Inicia sesión en el panel de control de Termly

1. Inicia sesión en el Panel de control de one.com y haz clic en Termly debajo de Configuración avanzada.

   

2. Haz clic en el botón azul Ir a Termly. Si aún no tienes una Suscripción a Termly, puedes comprarla en esta página.

   

3. Ingresa tu correo electrónico y contraseña de Termly, y haz clic en el botón Inicia sesión para acceder al panel de control de Termly.

Paso 3 - Escanea tu sitio web en busca de cookies

1. En el panel de control de Termly, haz clic en Gestión del consentimiento > Cookies en el menú de la izquierda.
2. Haz clic en Escanear ahora.

Paso 4 - Personaliza tu banner de consentimiento

1. En el menú de la izquierda, haz clic en Gestión del consentimiento > Banner de consentimiento. En esta página, puedes ajustar la configuración y la apariencia de tu banner.
2. Cuando estés listo, haz clic en Guardar en la parte inferior de la página.

Para más información sobre las opciones de personalización, consulta nuestra guía.

Paso 5 - Copia el código HTML del banner de consentimiento

1. En la página del banner de consentimiento, haz clic en el botón Instalar que se encuentra en la parte superior.
2. En la ventana emergente que se abre, puedes ver el estado del escaneo de cookies y los próximos pasos para instalar el banner. Haz clic en Insertar en el Paso 2.
3. En la siguiente ventana, haz clic en HTML sin formato.
4. Ahora puedes ver el script que debes agregar al componente de Código de Website Builder. También puedes elegir si quieres activar la función de bloqueo automático. Copia el código haciendo clic en Copiar en el portapapeles.

Paso 6 - Elige el componente de Código en Website Builder.

1. Ve a tu editor de Website Builder.
2. En el menú de la izquierda, haz clic en Más y elige Código.

Paso 7 - Inserta el código del banner de consentimiento en tu sitio web

1. En la ventana emergente, elige Antes de cerrar </head> como la Ubicación del código.
2. Pega el script del banner de consentimiento en el campo y haz clic en Guardar.

Paso 8 - Cambia la configuración del componente Código

1. Ahora puedes ver el componente de código en la parte superior de tu página en el editor. Haz clic en él para abrir su configuración.
2. En la configuración del componente de Código, haz clic en Colocación y marca la casilla de verificación en Aplicar a todas las páginas, para que el banner de consentimiento se pueda mostrar en todas las páginas de tu sitio web.

Paso 9 - Inserta el código del centro de preferencias en tu sitio web.

Además del banner de consentimiento, te recomendamos agregar un enlace al centro de preferencias en tu sitio web. Al hacer clic en él, tus visitantes pueden cambiar sus preferencias de cookies.

1. En el editor de Website Builder, crea otro componente de código haciendo clic en Más y luego en Código en el menú de la izquierda.

2. En la ventana emergente, selecciona Normal como la colocación del código.

3. Copia y pega el siguiente código en el campo y haz clic en Guardar:

<a href="#" class="termly-display-preferences" style="color:#000000;">Preferencias de consentimiento</a>

Paso 10 - Ajusta la ubicación y el estilo del enlace de tu centro de preferencias.

1. Arrastra el componente de código del centro de preferencias hasta donde quieras colocar su enlace en tu sitio web. Te recomendamos ponerlo en el pie de página, así será visible en todas las páginas.

2. Puedes cambiar la apariencia del enlace ajustando su código con estilos CSS. Haz clic en el componente de Código, selecciona Editar código y agrega los estilos CSS que quieras.
   En el siguiente ejemplo, hemos establecido el color del enlace como negro y hemos eliminado el subrayado:

<a href="#" class="termly-display-preferences" style="color:#000000; text-decoration: none;">Consent Preferences</a>

Paso 11 - Guarda y publica tu sitio web

Guarda y publica tu sitio web para que los cambios sean visibles en línea.

Para comprobar que el banner de consentimiento funciona, abre tu sitio web en modo incógnito. Si no puedes ver el banner de consentimiento, intenta borrar las cookies y comprueba que has completado todos los pasos anteriores.

Artículos relacionados:

• Primeros pasos con Termly
• ¿Necesito un banner de consentimiento en mi sitio web?