Mejora tu Sitio Web de Carrd.co con un Aviso de Cookies en Minutos

Mejora la funcionalidad de tu sitio web y su cumplimiento legal en solo unos minutos con nuestro código de aviso de cookies fácil de implementar para Carrd.co.

Actualizado 8 de julio de 2026Publicado 30 de mayo de 202310 min de lectura

Si tu sitio de Carrd usa Google Analytics, Facebook Pixel, vídeos de YouTube incrustados o cualquier otro script de terceros, necesitas un aviso de cookies. Las leyes de privacidad como el RGPD (UE) y la CCPA (California) exigen que los sitios web informen a los visitantes sobre el uso de cookies y, en muchos casos, obtengan su consentimiento antes de instalar cookies no esenciales.

Este tutorial te muestra cómo añadir un aviso de cookies sencillo y responsive a tu sitio de Carrd usando el elemento Embed. El código es gratuito, ligero y compatible con móviles.

¿Cuándo necesitas un aviso de cookies en Carrd?

Carrd en sí no instala cookies de rastreo. Pero si añades cualquiera de estos elementos a tu sitio, probablemente necesites un aviso de cookies:

Google Analytics — instala las cookies de rastreo _ga y _gid
Facebook Pixel — rastrea a los visitantes entre sitios para la segmentación de anuncios
Vídeos de YouTube incrustados — YouTube instala cookies cuando se cargan los vídeos
Widgets sociales incrustados — las incrustaciones de Twitter e Instagram pueden instalar cookies de rastreo
Herramientas de formularios de terceros — las incrustaciones de Typeform o Stripe pueden instalar cookies

Si tu sitio de Carrd es contenido puramente estático sin scripts de terceros, probablemente no necesites un aviso de cookies. Pero si no estás seguro, añadir uno es la opción más segura.

Plugins y Temas para Carrd

Qué necesitas

Plan Carrd Pro Standard (19 $/año) o superior — el elemento Embed no está disponible en los planes Free ni Pro Lite
Unos minutos para pegar el código y personalizarlo

Carrd Pro Standard desbloquea incrustaciones de código personalizado, dominios personalizados, formularios e integración con Google Analytics. Por 19 $/año (unos 1,58 $/mes), es el plan que la mayoría de usuarios de Carrd necesitan.

Tutorial en vídeo

Código del aviso de cookies para Carrd

Aquí está el código completo. Cópialo tal cual y luego personaliza los colores, el texto y la duración de la cookie para que coincida con tu sitio.

html

<div id="cookie-notice">
  <p>This website uses cookies to ensure you get the best experience. By continuing to browse, you agree to our use of cookies.</p>
  <button id="cookie-accept" onclick="acceptCookie()">Got it!</button>
  <button id="cookie-reject" onclick="rejectCookie()">No thanks</button>
</div>

<style>
  #cookie-notice {
    font-family: inherit;
    color: #fff;
    background: #596cd5;
    padding: 20px;
    position: fixed;
    bottom: 10px;
    left: 10px;
    max-width: 320px;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
    border-radius: 5px;
    margin: 0;
    display: none;
    z-index: 1000000;
    box-sizing: border-box;
  }
  #cookie-notice p {
    margin: 0 0 12px 0;
    font-size: 14px;
    line-height: 1.5;
  }
  #cookie-notice button {
    font-family: inherit;
    color: #fff;
    border: 0;
    padding: 10px 16px;
    margin-right: 8px;
    margin-top: 4px;
    cursor: pointer;
    border-radius: 3px;
    font-size: 14px;
  }
  #cookie-accept {
    background: #3842c7;
  }
  #cookie-reject {
    background: transparent;
    border: 1px solid rgba(255,255,255,0.4) !important;
  }
  @media only screen and (max-width: 600px) {
    #cookie-notice {
      max-width: 100%;
      bottom: 0;
      left: 0;
      border-radius: 0;
    }
  }
</style>

<script>
  function setCookie(name, value, days) {
    var expires = "";
    if (days) {
      var date = new Date();
      date.setTime(date.getTime() + days * 86400000);
      expires = "; expires=" + date.toUTCString();
    }
    document.cookie = name + "=" + (value || "") + expires + "; path=/";
  }
  function getCookie(name) {
    var nameEQ = name + "=";
    var ca = document.cookie.split(";");
    for (var i = 0; i < ca.length; i++) {
      var c = ca[i].trim();
      if (c.indexOf(nameEQ) === 0) return c.substring(nameEQ.length);
    }
    return null;
  }
  function acceptCookie() {
    setCookie("cookie_consent", "accepted", 365);
    document.getElementById("cookie-notice").style.display = "none";
  }
  function rejectCookie() {
    setCookie("cookie_consent", "rejected", 365);
    document.getElementById("cookie-notice").style.display = "none";
  }
  if (!getCookie("cookie_consent")) {
    document.getElementById("cookie-notice").style.display = "block";
  }
</script>

Qué hace este código

El aviso aparece como un banner fijo en la esquina inferior izquierda. En móviles (menos de 600 px), se extiende a todo el ancho en la parte inferior de la pantalla. Tiene dos botones:

Got it! — instala una cookie llamada cookie_consent con el valor accepted que dura 365 días
No thanks — instala la misma cookie con el valor rejected

Una vez que el usuario hace clic en cualquiera de los botones, el banner desaparece y no vuelve a mostrarse durante un año. El aviso usa display: none por defecto, así que solo aparece para los visitantes que aún no han elegido una opción.

Opciones de personalización

Color de fondo — cambia #596cd5 por el color de tu marca
Color del botón — cambia #3842c7 para el botón de aceptar
Duración de la cookie — cambia 365 en las llamadas a setCookie (365 = 1 año, 30 = 1 mes)
Texto — edita el contenido del <p> para que coincida con el tono de tu sitio
Posición — cambia bottom: 10px; left: 10px para colocarlo en otro lugar (p. ej., bottom: 0; left: 0; right: 0; max-width: none; border-radius: 0 para una barra de pie de página a todo el ancho; sin max-width: none, la caja sigue limitada a 320 px)

Cómo añadir el aviso de cookies a Carrd

Paso 1: Añade un elemento Embed

En el editor de Carrd, haz clic en Add Element y selecciona Embed. Pon el Type en Code y el Style en Hidden, con la ubicación establecida en Body End. Dale una etiqueta como “Cookie Notice” para poder identificarlo después.

El aviso flota sobre la página con position: fixed, así que no necesita un lugar en tu diseño. Body End también lo mantiene funcionando en sitios con varias Sections: una incrustación Inline vive dentro de una sola sección, y Carrd oculta esa sección (y tu aviso con ella) cada vez que un visitante cambia a otra.

Configuración del elemento Embed de Carrd con Type establecido en Code

El elemento Embed requiere Carrd Pro Standard (19 $/año) o superior. No está disponible en los planes Free ni Pro Lite.

Paso 2: Pega el código

En el campo Code, pega el bloque de código completo de arriba. Puedes personalizar los colores, el texto y la duración de la cookie antes de pegarlo, o editarlo después.

Paso 3: Publica y prueba

Carrd no muestra una vista previa del código incrustado en el editor. Necesitas publicar el sitio para ver el aviso de cookies. Después de publicar:

Abre tu sitio en una ventana de incógnito/privada del navegador
Debería aparecer el aviso de cookies
Haz clic en “Got it!” o “No thanks” — el banner debería desaparecer
Recarga la página — el banner debería permanecer oculto
Borra tus cookies y recarga — el banner debería reaparecer

Prueba Carrd Pro Gratis durante 7 Días

Limitaciones de este enfoque

Esto es un aviso de cookies sencillo, no una plataforma de gestión del consentimiento (CMP) completa. Esto es lo que hace y lo que no hace:

Lo que hace:

Informa a los visitantes de que tu sitio usa cookies
Registra si aceptaron o rechazaron
Oculta el banner después de que elijan una opción

Lo que no hace:

Bloquear scripts de terceros antes del consentimiento (Google Analytics sigue cargándose)
Ofrecer controles granulares por categoría de cookie
Registrar el consentimiento para fines de auditoría
Escanear automáticamente tu sitio en busca de cookies

Para la mayoría de los sitios de Carrd, un aviso sencillo es suficiente. Si ejecutas campañas publicitarias en la UE o procesas grandes cantidades de datos de usuarios, considera un CMP dedicado como Cookiebot, CookieYes o CookieScript — algunos tienen planes gratuitos.

Cumplimiento estricto del RGPD

Bajo una interpretación estricta del RGPD, deberías bloquear las cookies no esenciales hasta que el usuario acepte. Esto es difícil de hacer en Carrd porque el elemento Embed carga los scripts inmediatamente. Si el cumplimiento estricto es importante para tu negocio, considera:

Usar un CMP de terceros que gestione el bloqueo de scripts
Cambiar a analítica sin cookies como Plausible o Fathom (no necesitan consentimiento)
Consultar a un profesional de privacidad para tu situación específica

Tutoriales de Carrd relacionados

Consigue Carrd Pro Standard