Ana içeriğe geç
TRDS Türkiye Kamu Tasarım Sistemi

Kimlik · Cookie banner

Çerez bildirimi

İsteğe bağlı çerezler için izin ister. Kabul ve ret eşit büyüklüktedir. Tercih saklanır.

CSS
kararlı
JavaScript
tercih saklama
React
kararlı
Vue
kararlı

Örnekler

Temel Canlı örnek · tam genişlik

Bu sitede çerez kullanıyoruz

Zorunlu çerezler siteyi çalıştırır. İsteğe bağlı çerezler kullanımı ölçer ve hizmeti iyileştirir.

Çerezleri görüntüle
HTML kodunu göster
<div class="trds-cerez" role="region" aria-label="Çerez tercihi" data-trds="cerez" data-hep-goster>
  <div class="trds-kap">
    <div class="trds-cerez__soru">
      <h2 class="trds-cerez__baslik">Bu sitede çerez kullanıyoruz</h2>
      <p class="trds-govde">Zorunlu çerezler siteyi çalıştırır. İsteğe bağlı çerezler kullanımı ölçer ve hizmeti iyileştirir.</p>
      <div class="trds-button-grubu"><button class="trds-button" type="button" data-cerez="kabul">İsteğe bağlı çerezleri kabul et</button><button class="trds-button" type="button" data-cerez="ret">İsteğe bağlı çerezleri reddet</button><a class="trds-link" href="#">Çerezleri görüntüle</a></div>
    </div>
    <div class="trds-cerez__onay" hidden>
      <p class="trds-govde"><span data-cerez-metin></span> Tercihinizi <a class="trds-link" href="#">çerez sayfasından</a> değiştirebilirsiniz.</p>
      <button class="trds-button trds-button--ikincil" type="button" data-cerez-gizle>Mesajı gizle</button>
    </div>
  </div>
</div>

Ne zaman kullanılır

Erişilebilirlik

Karşılanan WCAG 2.2 ölçütleri 1.3.12.4.33.2.2

Kaynak

Benzer bir bileşen şu ülkelerin tasarım sistemlerinde de var: UK, FR, DK, BR, CH, IT.