Consentl w Webflow

Dodaj skrypt ładujący Consentl do kodu Head całej witryny Webflow, przekaż wybór do Webflow Analyze i dowiedz się, co oznacza „nie pierwszy w head” w Webflow.

Skrypt ładujący jako pierwszy w <head>
Nie — prosimy zapoznać się z ograniczeniami

Czy skrypt ładujący może być pierwszy w <head>? Nie. Webflow wstawia kod Head code całej witryny na końcu <head>, po własnych tagach meta, CSS i małych skryptach wbudowanych. Kod poszczególnych stron znajduje się po kodzie całej witryny. Zob. Ograniczenia.

Wymagania

  • Płatny Site plan albo przestrzeń robocza Core, Growth, Agency lub Freelancer. W bezpłatnej witrynie Starter karta Custom code jest widoczna, ale nie można jej zapisać.
  • Klucz witryny Consentl, dostępny na stronie Konfiguracja witryny w panelu. W polu Domeny należy dodać każdą nazwę hosta, pod którą działa witryna (własną domenę i adres your-site.webflow.io); www. i domena bez www liczą się jako ta sama witryna, więc nie trzeba osobno dodawać www..

Co obejmuje Państwa plan Consentl

  • Free: baner, rejestr zgód i tylko ręczne blokowanie.
  • Pro: dodaje Google Consent Mode v2.
  • Business: dodaje automatyczne blokowanie znanych narzędzi śledzących i reguły blokowania dodane w panelu.

W planach Free i Pro wstrzymywane są tylko tagi oznaczone ręcznie.

Instalacja

  1. W Webflow należy otworzyć witrynę → Site settings → Custom code.

  2. W polu Head code należy wkleić w pierwszym wierszu, powyżej istniejącego kodu:

    <script src="https://api.consentl.com/v1/loader.js?k=SITE_KEY&l=en"></script>

    Należy zastąpić SITE_KEY oraz en językiem witryny (zob. Witryny wielojęzyczne). Jeżeli witryna korzysta również z szablonu Consentl GTM, należy dodać &gcm=ext do adresu URL, aby polecenia Consent Mode wysyłał tylko szablon.

  3. Należy kliknąć Save changes, a następnie Publish w domenie webflow.io lub własnej domenie.

  4. Opcjonalnie: w stopce należy dodać link „Ustawienia plików cookie”: blok Link z adresem URL #consentl. Linki, których adres URL kończy się na #consentl lub #consentl-preferences, oraz każdy element z atrybutem data-consentl-open otwierają preferencje.

  5. Opcjonalnie: na stronie polityki plików cookie należy dodać element Embed z deklaracją plików cookie:

    <div data-consentl-declaration data-api="https://api.consentl.com" data-key="SITE_KEY" data-locale="en"></div>
    <script src="https://api.consentl.com/v1/blocks.js" defer></script>

    Dla formularza wniosku dotyczącego danych osobowych lub unijnego formularza odstąpienia od umowy należy zamiast tego użyć data-consentl-request lub data-consentl-withdrawal. Formularz odstąpienia od umowy wymaga planu Pro lub wyższego i musi zostać włączony w panelu; w przeciwnym razie pozostaje pusty.

Sprawdzenie działania

Należy otworzyć opublikowaną witrynę w oknie prywatnym: pojawia się baner. Własny kod nie działa na kanwie Designer. Działa natomiast w trybach Preview i Comment, więc baner może pojawić się również tam; wiarygodnym testem jest opublikowana witryna.

Region odwiedzającego jest ustalany na podstawie jego adresu IP: Consentl ustala kraj w pamięci przy każdym wyświetleniu strony (nic nie jest zapisywane) i stosuje do niego Państwa regułę z panelu. Stany USA nie są rozróżniane: odwiedzający z USA otrzymują Państwa regułę dla całych USA lub, jeżeli jej nie ma, pierwszą regułę dla stanu USA. Nieznany kraj otrzymuje regułę dla nieznanych regionów (domyślnie opt-in).

Witryny wielojęzyczne (Webflow Localization)

Od 26 czerwca 2026 r. Webflow Localization pozwala ustawiać własny kod Head i Footer dla każdej wersji językowej. Skrypt ładujący należy dodać do kodu Head każdej wersji językowej z jej językiem w &l= (na przykład &l=de dla wersji niemieckiej). Każda strona ładuje wtedy jeden adres URL skryptu ładującego, taki sam na każdej stronie danej wersji językowej.

Jeżeli wolą Państwo jeden fragment kodu dla wszystkich wersji językowych, można pominąć &l=…: baner używa wtedy domyślnego języka witryny ustawionego w panelu.

Webflow Analyze / Optimize

Własna analityka Webflow ma osobny przełącznik zgody:

  1. Należy ustawić Insights → Settings → Tracking na Don't track by default, a następnie opublikować witrynę. Ustawienie zaczyna obowiązywać dopiero po publikacji.

  2. Wybór Consentl należy przekazać, dodając poniższy kod do Footer code. Stosuje on bieżący wybór przy każdym załadowaniu strony i uwzględnia późniejsze zmiany:

    <script>
      (function () {
        function sync(c) {
          if (!c || !window.wf) return;
          wf.ready(function () {
            var want = c.analytics ? "allow" : "deny";
            if (wf.getUserTrackingChoice() === want) return;
            if (c.analytics) wf.allowUserTracking({ activate: true });
            else wf.denyUserTracking();
          });
        }
        if (window.Consentl) sync(window.Consentl.get());
        document.addEventListener("consentl:change", function (e) { sync(e.detail); });
      })();
    </script>

Ograniczenia

  • Nie jest pierwszy w head. Wszystko, co Webflow renderuje powyżej Head code, uruchamia się przed Consentl. Dotyczy to też natywnych integracji w Site settings → Apps & integrations (Google Analytics, Meta Pixel), które mogą być wstrzykiwane przed nim. Należy usunąć te integracje i ładować te same tagi przez Google Tag Manager z Consent Mode (plan Pro i wyższe) lub jako tagi ładowane przez kod w Head code poniżej wiersza Consentl. Consentl wstrzymuje rozpoznane narzędzia śledzące ładowane po nim (plan Business i wyższe); w planach Free i Pro wstrzymywane są tylko tagi oznaczone ręcznie.

  • Tagi zapisane na stałe. <script src>, piksel <img> lub <iframe> zapisane w kodzie Head/Footer lub w elemencie Embed są pobierane przez przeglądarkę, zanim jakikolwiek skrypt może je zatrzymać, nawet jeżeli Consentl uniemożliwia ich uruchomienie. Takie tagi należy oznaczyć ręcznie, a piksele <noscript> usunąć:

    <script type="text/plain" data-consentl="marketing" src="https://ads.example.com/tag.js"></script>
    <iframe data-consentl="marketing" data-src="https://www.youtube-nocookie.com/embed/ID" title="Video"></iframe>
    <img data-consentl="marketing" data-src="https://tracker.example.com/pixel.gif" alt="" width="1" height="1">

    Tagi ładowane przez kod (GTM, skrypt ładujący JavaScript piksela) są wstrzymywane bez żądania, gdy włączone jest automatyczne blokowanie.

  • Każde pole własnego kodu przyjmuje do 50 000 znaków; skrypt ładujący to jeden wiersz.

  • Webflow nie ma wbudowanego banera cookie, który trzeba by wyłączyć. Należy usunąć każdą inną aplikację banera.

  • Content Security Policy. Witryny Enterprise mogą ustawiać nagłówki odpowiedzi, w tym content-security-policy, w Site settings → Publishing → Custom headers. Jeżeli taki nagłówek jest ustawiony, należy zezwolić na https://api.consentl.com w sposób opisany w poradniku dla stron internetowych. Bez własnego nagłówka CSP nie trzeba nic zmieniać.

Potrzebują Państwo pomocy? Prosimy pisać na adres support@consentl.com — odpowiadamy po angielsku w dni robocze.