Personaliza la sección de encabezado de tu blog de Blogger.com

Mayo 5, 2024

En el último tutorial, personalizamos la sección Enlaces para su Blogger^TM weblog Ahora, personalizaremos la sección Encabezado en la parte superior del blog. El encabezado contiene el título y la descripción de su blog. Vamos a cambiar el tipo de letra, o fuente, para el texto y agregar un fondo de color.

Como en el último tutorial, realizaremos estas mejoras cambiando algunas líneas del código HTML de la plantilla. Haga clic en la pestaña Plantilla en el menú en la parte superior de la página que lo llevará a la sección Editar plantilla actual. Encontrará el código HTML para la plantilla en el cuadro a continuación. Haremos algunos cambios al código de estilo CSS. (Para obtener más información sobre las hojas de estilo en cascada, siga el enlace a continuación). Desplácese hacia abajo por el código hasta llegar a la sección Encabezado dentro de la etiqueta de estilo CSS. Como puede ver, la etiqueta de estilo es muy larga y la sección Encabezado de la etiqueta de estilo tiene seis partes.

@media all
@media handheld
#Titulo de Blog
# blog-title a
# blog-title a: hover
#descripción

La primera parte del código (@media all) controla las características del encabezado, incluido el ancho, el margen y el tamaño del borde. La segunda parte (@media handheld) hereda estas características de la primera parte y también cambia el ancho del encabezado al 90 por ciento para los monitores de mano. Como queremos que el nuevo color de fondo sea el usado en ambas instancias, agregaremos una línea de código para el color de fondo en la primera parte (@media all). Esta nueva línea de código está en negrita a continuación. En el ejemplo a continuación, hemos usado un color gris claro, pero puede usar el color que desee.

@media all {
#header {
color de fondo: # EFE3EF;
...
A continuación, cambiaremos el tipo de letra del título a la fuente popular de estilo informal llamada Comic Sans MS. Por supuesto, puede usar cualquier fuente que desee. Las siguientes tres partes del código CSS de la plantilla (# blog-title, # blog-title a, # blog-title a: hover) controlan las características del título del blog. La primera parte controla las características generales y las otras dos partes controlan el aspecto del texto cuando funciona como un hipervínculo. Para establecer el tipo de letra del título, o la fuente, para todas las instancias, agregaremos el código CSS para la familia de fuentes a la primera parte (# blog-title). Como nuestro nombre de fuente contiene espacios, también deberá colocarse entre comillas ("comic sans ms").

#Titulo de Blog {
font-family: "comic sans ms";
...
Finalmente, trabajaremos en el código CSS para la descripción de su blog (#descripción). Esta es la última parte de los seis originales. Como puede ver a continuación, todo el código CSS que controla las características de la fuente para el texto descriptivo se enumera en una sola línea. Todo lo que tenemos que hacer es agregar "comic sans ms" al principio de la lista de fuentes, lo que hará que Comic Sans MS sea la fuente predeterminada para el texto descriptivo.

#description {
...
fuente: 78% / 1.4em "cómic sin ms", "Trebuchet MS", Trebuchet, Arial, Verdana, Sans-serif;
...
}

Cuando haya terminado, haga clic en el botón Vista previa para obtener una vista previa de los cambios y luego cierre la ventana del navegador para volver a la página web anterior. Haga clic en el botón Guardar cambios de plantilla. Cuando vea el mensaje de confirmación que indica que se guardaron los cambios, haga clic en el botón Volver a publicar. Para verificar que su blog ha sido actualizado, haga clic en la pestaña Ver blog en el menú en la parte superior de la página. Es posible que deba actualizar la página web de su blog para ver los cambios.

Capturas de pantalla reimpresas con permiso de Google Inc. Google^TMBlogger^TM y BlogSpot^TM son marcas comerciales registradas o marcas comerciales de Google Inc. en los Estados Unidos y / u otros países.

Instrucciones De Vídeo: Curso de Blogger Clase 4 Trabajando Nuestro Primer Gadget La Cabecera o Titulo del Blog (Mayo 2024).

Personalice la sección de encabezado de su Blogger.com Blog, HTML, cambie el título y la descripción de su blog Blogger, cambie el tipo de letra para la plantilla de Blogger, agregue un fondo de color a la plantilla de Blogger, cambie el código CSS para la plantilla de Blogger, agregue el código CSS al templage de Blogger , Fuente de plantilla de Blogger, Familia de fuentes de plantilla de Blogger, Etiquetas de estilo CSS

Artículo Anterior

Artículo Siguiente

Resolver irritaciones de Microsoft Vista

Mayo 2024

Ahora estoy en mi tercera semana de uso de Windows Vista y tengo que decir que el nuevo sistema operativo realmente está creciendo en mí. Hasta ahora no he tenido ningún problema importante y solo...

ordenadores

Hitman 2: Asesino silencioso

Mayo 2024

Hitman 2 es un juego de disparos en primera persona que recompensa el control y el sigilo por las explosiones completas. Los magníficos gráficos y el juego de forma libre lo hacen ideal para...