Al día de hoy están exigiendo para que todos los sitios web informen sobre el uso de cookies  que se emplean en dicha página, he buscado información de como implementar una barra de información de políticas de cookies. En muchos artículos lo implementan utilizando  librerías JS y creando cookies con JavaScript lo cual es muy engorroso.

Pero de tanto buscar encontré una manera sencilla y funcional de hacerlo con la función de almacenamiento local localStorage de JavaScript, lo cual te enseñare como implementarlo en este articulo.

HTML

<!DOCTYPE html>
<html lang="es">
 <head>
  <meta charset="UTF-8">
  <title>Barra de política de cookies</title>
 </head>
<body>
 <!-- Contenedor principal del mensaje de uso de cookies -->
 <div class="politicas-cookie">
  <p class="info-cookie">
  Utilizo cookies personales y de terceros, al continuar navegando acepta la <a class="link-politica-cookie" href="#">política de cookies</a> de mi Blog. <a class="boton-cookie js-boton-cookie" href="javascript:void(0)">ok</a>
  </p>
 </div>

 <!-- jQuery (Importante)-->
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
</body>
</html>

CSS

.boton-subir,
.politicas-cookie{
 position: fixed;
}

.politicas-cookie{
 display: none;
 background: #0F2027;
 background: linear-gradient(to right, #2C5364, #203A43, #0F2027);
 right: 0;
 bottom: 0;
 left: 0;
 padding:  10px;
}
.info-cookie{
 display: flex;
 align-items: center;
 flex-wrap: wrap;
 justify-content: center;
 color:  #fff;
 font-size: 1.2em;
 margin-bottom: 0;
 margin-top: 0;
}
.link-politica-cookie{
 color: #fff;
 margin:  0 5px;
}
.boton-cookie{
 display: flex;
 color: #fff;
 background: #FF91A6;
 border-radius: 15px;
 margin-left: 5px;
 padding: 4px 10px;
 text-decoration: none;
 transition: .5s;
}
.boton-cookie:hover{
 background: #F95977;
}

JavaScript

//POLÍTICA DE COOKIES
//Evento clic de la etiqueta con la clase (.js-boton-cookie)
$('.js-boton-cookie').click(function() {
 //Almaceno los datos en localStorage (clave, valor)
 localStorage.setItem('luismasDEV', 'Luis Rene Mas Mas');
 //Oculto la barra que muestra la información de política de cookies
 $('.politicas-cookie').css('display', 'none');
 //Muestro un mensaje en consola
 console.log('Haz aceptado nuestra política de cookies. ☺️');
});

//Creo la variable "dev" que almacena el valor asignado que seria (Luis Rene Mas Mas)
var dev = localStorage.getItem('luismasDEV');
//Realizo una condición si el valor obtenido de la variable "dev" es diferente (null) quiere decir que el usuario a aceptado nuestra política de cookies
if(dev != null){
 $('.politicas-cookie').css('display', 'none');
}else{//De lo contrario muestro la información
 $('.politicas-cookie').css('display', 'block');
}

Demo

See the Pen Barra de información sobre políticas de cookies by Luis Rene Mas Mas (@luismasDEV) on CodePen.

Bueno amigos espero haber ayudado en algo, muchas gracias por visitar mi blog.