Cuando se crea un blog en un sitio como Blogger, es común que se desee personalizar el mismo con detalles a gusto del autor. Uno de esos posibles cambios es la de poner una imagen de fondo en el header (a modo de banner) y también la de contar con un título específico para todo el sitio.
El definir la imagen de fondo, así como el título, es relativamente sencillo. Lo que no lo es tanto (dependiendo de la plantilla seleccionada), es la de centrar el título. Por ejemplo, para la plantilla Fantástico, S.A. , el título por defecto se ubica en la parte superior izquierda del banner.
Para centrarlo, se pueden seguir los siguientes pasos (existen muchas formas de hacerlo, lo acá mostrado es solo una de muchas posibilidades):
1. Inspeccionar el elemento que se desea centrar, en este caso del título, con la ayuda de un navegador moderno, como Chrome o Edge.
2. Determinar cual o cuales son las clases CCS que afectan al elemento. En este caso en particular, el título de la plantilla se ve afectado por las clases titlewrapper y title.
3. Ir al editor HTML de la plantilla. La ruta para llegar a él es Plantilla y después se da clic en el botón Editar HTML.
4. Incluir en la sección CSS de la plantilla los selectores y propiedades necesarios para que nuestra sitio cambie según lo que deseemos. Para este ejemplo en particular, solo es necesario agregar las siguientes líneas:
.titlewrapper{
margin-top: 10em;
}
margin-top: 10em;
}
.titlewrapper .title{
text-align: center;
}
text-align: center;
}
5. Para finalizar, se da clic en el botón guardar plantilla y se validan los cambios en el blog.
Es posible editar tanto el HTML y el CSS de nuestro blog directamente en el editor (es decir, empezar desde el punto 3) pero es más sencillo primero visualizar la disposición final de los elementos por medio de un navegador, para posteriormente editar estrictamente lo necesario en la plantilla y así evitar dañarla.