Personaliza el Aviso de las Coockies

queridísimos CrazyLovers!! 

Continuamos con los Tutos en el Blogee y hoy aprenderemos a personalizar el Aviso de las Coockies

 Os dejo una imagen de referencia aquí abajito.

Así pues, comencemos...

1. Bien, nos vamos a Plantilla.
2. Expandimos el botón personalizar.
3. Seleccionamos Copia de seguridad.
4. Clic en Descargar y clic en Guardar (así tendremos nuestra plantilla descargada por si saliese algo mal)
5. Una vez más expandimos el botón personalizar.
6. Ahora seleccionamos Editar HTML.
7. Damos un Clic dentro de la Plantilla.
8. Presionamos las teclas Ctrl F.
9. Nos aparecerá un buscador en la parte superior de nuestra plantilla.
10. Copiamos el primer código (que se encuentra más abajo) presionando las teclas Ctrl C o clic derecho Copiar.
11. Una vez copiado el primer código lo pegamos en el buscador presionando las teclas Ctrl V o haciendo clic derecho Pegar.
12. Primer Código: </b:skin>
13. A continuación presionamos la tecla Enter que nos localizará nuestro código.
14. Una vez localizado nuestro código vamos a copiar el segundo código (que se encuentra más abajo) presionando las teclas Ctrl C o clic derecho Copiar.
15. Y justo encima/arriba del primer código pegamos el segundo código que se encuentra aquí debajo.

Segundo Código

/* Color de fondo del aviso y espaciado */

#cookieChoiceInfo {background-color:#ffaaab; padding:7px 0 10px;} 

/* Tamaño, color, margen y estilo del texto del aviso */

.cookie-choices-info .cookie-choices-text {font-size:14px !important; color:#bf5265 !important; font-family:lemonada !important; margin:7px 18px !important;} 

/* Para poner los enlaces como botones */

.cookie-choices-info .cookie-choices-button {padding:4px 6px !important; background-color:#ff7a7b; border-radius:8px; font-size:12px; font-family:trebuchet !important;} 

/* Color del primer enlace */

a.cookie-choices-button:nth-child(1) {color:#8a4243} 

/* Color del primer enlace al pasar el ratón */

a:hover.cookie-choices-button:nth-child(1) {color:#02cafc} 

/* Color del segundo enlace */

a#cookieChoiceDismiss {color:#8a4243} 

/* Color del segundo enlace al pasar el ratón */

a:hover#cookieChoiceDismiss {color:#ff7a7b}

  

 Ahora bien, todos los códigos en negrita son personalizables.

Vamos con los Tecnicismos

• background-color: Color del fondo.
• padding: Espacio del Aviso de Coockies y de los Botones.
• font-size: Tamaño de la o las fuentes.
• color: Color de la o las fuentes.
• font-family: Tipo de la o las fuentes.
• margin: Margen del texto.
• border-radius: Redondeado de los bordes del Aviso de Coockies y los Botones. (mientras más alto sea el número más redondos serás los bordes, mientras más bajo sea el número menos redondeados serás los bordes).

 Una vez tengamos todo a nuestro gusto damos clic al botón Guardar que se encuentra en la parte superior derecha del todo y listo! 

Bien esto es todo por este tuto ♥

por leerme. 

      

Recuerda seguirme en mis Redes Sociales     .