26 de mayo de 2016

Modificación de una plantilla travel en Blogger

Cómo modificar la plantilla Travel en Blogger


Tras haber realizado diversos cursos sobre emprendimiento, aplicación y desarrollo de nuevas tecnologías, inicio las prácticas de mi aprendizaje por lo más básico y sencillo que es un gestor de contenidos.

Me decido por Blogger aunque otra opción muy interesante podría ser Wordpress.

En este blog voy a ir registrando a modo de apuntes, todos los pasos, problemas y logros en esta aventura en la que me he metido. Es una forma de guardar mis experiencias para consultas posteriores y si puede servir de ayuda a alguien o me pueden ayudar a mí, estupendo!

A pesar de la formación de estos meses me doy cuenta que no es suficiente y necesito consultar y consultar en muchas páginas especializadas, foros o blogs con información y tutoriales.

No detallo los pasos a seguir para abrir un blog porque hay infinidad de ayuda en la web.

Una vez registrado y configurado mi blog, me decido por una plantilla travel.
 
Aquí encuentro mi primer problema. Esta plantilla permite poner de fondo una imagen pero el resultado no me gusta porque el contenido del blog está sobre un fondo semi transparente oscuro, con base en un color gris llegando al negro.

La imagen de un blog es muy importante, si fatiga, cansa, distrae al usuario que accede a él, corremos el riesgo de perderlo con rapidez aunque el contenido del blog le pudiera resultar muy interesante.
Estamos más acostumbrados a leer sobre fondo blanco o claro y letra oscura que al revés, no resulta cómodo. Tal vez resulte impactante y atractivo un texto o imagen bajo este formato, pero no para mantener la audiencia más allá de unos pocos minutos. Es importante crear fondos claros y limpios para nuestros contenidos. 


Por este motivo he intentado modificar el fondo del contenido para suavizarlo un poco. A través de las opciones que permite Blogger no es posible así que después de pelearme mucho me rindo y decido de nuevo consultar en internet en busca de ayuda sobre esta cuestión.

Encuentro información pero solo para modificar y ajustar con las herramientas que proporciona Blogger, con lo cual no soluciono nada.

Después de mil vueltas encuentro información que me dirige a programación CSS.

Dentro de Plantilla-Personalizar-Avanzado, la última opción disponible es Añadir CSS. Aquí es donde añadiremos las líneas de código para modificar el aspecto del fondo de nuestro blog.

Dentro del panel añado las líneas de código CSS,

.content-inner {

background: transparent !important;

background-color: rgba(173,216,230,0.2) !important;

}

.main-inner .fauxcolumn-right-outer .fauxcolumn-inner {

background: transparent !important;

}

El último valor entre paréntesis (0.2) indica la opacidad del color, que va desde 0 (transparente) hasta 1 (opaco). Este valor se puede modificar. También se puede variar el color de fondo que puede ir de 255,255,255 que es blanco al 0,0,0 que es negro.
(RGB Color Codes puedes conseguir los valores para el color rgb decimal)

El resultado es el deseado, quedando el fondo principal transparente y el fondo de la entrada y de la columna lateral en tonalidad azul semitransparente con un grado de opacidad bajo que permite ver la imagen de fondo así como los contenidos.

Problema solucionado.