Come aggiungere un banner di consenso ai cookie su Blogger

Pubblicato: 2023-04-23

Durante la navigazione in Internet, probabilmente ti sei imbattuto in un banner di consenso ai cookie che ti chiede di accettare o rifiutare i cookie. Questi banner sono diventati una caratteristica standard sui siti Web a causa della crescente preoccupazione per la privacy dei dati e il tracciamento online.

Se sei un blogger che utilizza Blogger, è essenziale aggiungere un banner di consenso sui cookie al tuo sito per garantire la conformità a normative come il Regolamento generale sulla protezione dei dati (GDPR) e il California Consumer Privacy Act (CCPA).

Cos'è un banner di consenso ai cookie ?

Un banner di consenso ai cookie è una finestra pop-up o un banner che appare su un sito Web, che informa gli utenti sull'utilizzo dei cookie e richiede il loro consenso per memorizzare o accedere alle loro informazioni.

I cookie sono piccoli file di testo che vengono inseriti nel dispositivo di un utente quando visita un sito web. Vengono utilizzati per ricordare le preferenze dell'utente, tracciare l'attività del sito Web e fornire un'esperienza più personalizzata. Tuttavia, i cookie possono anche essere utilizzati per pubblicità o tracciamento mirati, motivo per cui gli utenti devono essere informati e avere la possibilità di accettarli o rifiutarli.

L'aggiunta di un banner di consenso ai cookie al tuo sito Blogger è un processo relativamente semplice che può essere completato in pochi passaggi. Nelle sezioni seguenti, illustreremo i passaggi per aggiungere un banner di consenso ai cookie su Blogger

Come aggiungere un banner di consenso ai cookie su Blogger

Per aggiungere un banner o un popup di consenso ai cookie in Blogger, procedi nel seguente modo.

  1. Apri la dashboard di Blogger e vai alla sezione del tema.
  2. Ora fai clic sulla sezione Modifica HTML dal menu a discesa sul lato destro del pulsante Personalizza.
  3. Ora cerca il tag Body di chiusura (</body) che generalmente è la penultima riga del codice del tuo tema.
  4. Ora incolla il codice appena sopra di esso e salva il codice per aggiungere il banner di consenso ai cookie al tuo sito web di Blogger.
 <div class='cookie-box'> <div class='cookie-row'> <div class='cookie-img'><svg viewBox='0 0 97.93 97.93' xmlns='http://www.w3.org/2000/svg'><path d='M44,23.76a2.47,2.47,0,1,0,.91,3.37A2.47,2.47,0,0,0,44,23.76Z'></path><path d='M25.9,40.32a2.47,2.47,0,0,0,0,4.93h0a2.47,2.47,0,1,0,0-4.93Z'></path><circle cx='32.08' cy='65.86' r='2.47'></circle><path d='M56.38,69.91a2.47,2.47,0,1,0,1.14,1.49A2.47,2.47,0,0,0,56.38,69.91Z'></path><path d='M72,52.68a2.47,2.47,0,0,0-2.38,1.83,2.44,2.44,0,0,0,.25,1.87,2.47,2.47,0,0,0,4.52-.59,2.44,2.44,0,0,0-.25-1.87A2.47,2.47,0,0,0,72,52.68Z'></path><path d='M89.51,52.86A14,14,0,0,1,81,47.2,14.09,14.09,0,0,1,61,35.68,14.09,14.09,0,0,1,49.49,15.73a14,14,0,0,1-5.66-8.55,44,44,0,0,0-21.09,6.15A44.26,44.26,0,0,0,71.46,87.08,44.24,44.24,0,0,0,89.51,52.86ZM28.28,43.42a2.47,2.47,0,0,1-2.38,1.83h0a2.47,2.47,0,1,1,2.38-1.83Zm3.8,24.9a2.47,2.47,0,1,1,2.47-2.47A2.47,2.47,0,0,1,32.08,68.32ZM44.92,27.13A2.47,2.47,0,1,1,44,23.76,2.47,2.47,0,0,1,44.92,27.13ZM57.28,73.27a2.47,2.47,0,1,1-.9-3.36,2.47,2.47,0,0,1,.9,3.36ZM74.42,55.79a2.47,2.47,0,1,1-.25-1.87A2.45,2.45,0,0,1,74.42,55.79Z' fill='#7577a9'></path><path d='M97.93,48.52v-.2A2.35,2.35,0,0,0,95.7,46a9.37,9.37,0,0,1-8-5.45,2.35,2.35,0,0,0-3.49-.93,9.51,9.51,0,0,1-5.44,1.72A9.4,9.4,0,0,1,69.39,31.1a2.35,2.35,0,0,0-2.55-2.55c-.28,0-.57,0-.85,0a9.39,9.39,0,0,1-7.68-14.81,2.35,2.35,0,0,0-.93-3.49,9.37,9.37,0,0,1-5.45-8A2.35,2.35,0,0,0,49.61,0H49a49,49,0,1,0,49,49C97.93,48.82,97.93,48.67,97.93,48.52ZM71.46,87.08A44.26,44.26,0,0,1,22.74,13.33,44,44,0,0,1,47.53,4.72a14,14,0,0,0,5.66,8.55A14.09,14.09,0,0,0,64.71,33.22,14.09,14.09,0,0,0,84.66,44.75a14,14,0,0,0,8.56,5.66A44.3,44.3,0,0,1,71.46,87.08Z'></path></svg></div> <div class='cookie-content'> <p>Our website uses cookies to improve your experience. <a href='https://policies.google.com/technologies/cookies' target='_blank' title='Learn more'>Learn more</a></p> <button class='cookie-buttons'>Accept!</button> </div> </div> </div> <style> .cookie-box.hide{display:none} .cookie-box { position: fixed; width: 90%; margin: 20px; max-width: 400px; min-height: 100px; background-color: #ffffff; box-shadow: 25px 12px 25px 12px rgb(30 30 30 / 4%); z-index: 990; border: 2px solid lightgrey; border-radius: 6px; bottom: 15px; right: 0px; padding: 15px; } .cookie-row { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; text-align: left; align-content: center; justify-content: center; align-items: center; } .cookie-img{padding-right:20px} .cookie-img svg{fill:#333;width:60px;height: 60px;} .cookie-content p { position: relative; width: 100%; display: inline-block; font-size: 15px; color: #666666; margin-top: 0!important; } .cookie-content pa{text-decoration:underline;} .cookie-buttons { position: relative; width: 100%; margin-top: 10px; float: left; background-color: #7577a9; font-family: inherit; font-size: 14px; color: #ffffff; text-decoration: none; opacity: 1; border: none; cursor: pointer; font-weight: 500; padding: 5px; border-bottom: 2px solid rgba(0,0,0,0.1); border-radius: 6px; } </style> <script>//<![CDATA[ cookieChoices = {}; const cookieBox = document.querySelector(".cookie-box"), acceptBtn = cookieBox.querySelector("button"); acceptBtn.onclick = ()=>{ document.cookie = "CookieByKey2Blogging; max-age="+60*60*24*30; if(document.cookie){ cookieBox.classList.add("hide"); }else{ alert("Cookie can't be set! Please unblock this site from the cookie setting of your browser."); } } let checkCookie = document.cookie.indexOf("CookieByKey2Blogging"); checkCookie != -1 ? cookieBox.classList.add("hide") : cookieBox.classList.remove("hide"); //]]></script>

Questo codice rimuoverà la notifica predefinita dei cookie di Blogger e aggiungerà un banner di consenso ai cookie personalizzato oppure puoi dire popup al tuo sito Web di blogger.

Questo codice è completamente ottimizzato e utilizza i codici SVG, quindi non devi preoccuparti della velocità del sito sul sito Web di blogger.

In conclusione, l'aggiunta di un banner di consenso sui cookie al tuo sito Blogger è essenziale per garantire la conformità alle normative sulla privacy dei dati e fornire trasparenza ai tuoi utenti.

Spero che questo articolo ti aiuti ad aggiungere un widget personalizzato per il consenso ai cookie al tuo sito web di blogger. Se hai problemi con questo codice, fammelo sapere nella sezione commenti.

A proposito, puoi assumermi per ottimizzare la velocità di caricamento del tuo Blogger. Consulta la nostra pagina dei servizi per saperne di più.