El CSS es un lenguaje muy usado en el diseño web, dado que se logran grandes resultados y efectos con el y Blogger no es la excepción.

Pero antes de seguirnos adentrando en lo que representa el CSS en Blogger miremos un poco que es el CSS:

«El nombre hojas de estilo en cascada viene del inglés Cascading Style Sheets, del que toma sus siglas. CSS es un lenguaje usado para definir la presentación de un documento estructurado escrito en HTML o XML (y por extensión en XHTML). El W3C (World Wide Web Consortium) es el encargado de formular la especificación de las hojas de estilo que servirán de estándar para los agentes de usuario o navegadores.
La idea que se encuentra detrás del desarrollo de CSS es separar la estructura de un documento de su presentación.
La información de estilo puede ser adjuntada como un documento separado o en el mismo documento HTML. En este último caso podrían definirse estilos generales en la cabecera del documento o en cada etiqueta particular mediante el atributo «<style>».

Cita tomada de Wikipedia»

El CSS en Blogger

 

Ahora veamos como podemos añadir el CSS en Blogger.

Forma 1

La forma más usada a la hora de agregar el CSS en Blogger es agregarlo entre las etiquetas <b:skin><![CDATA[/* ]]></b:skin> de forma similar al siguiente ejemplo :

 <b:skin><![CDATA[/*.jump-link {float: right;]]></b:skin>

Siendo el  CSS propiamente dicho el que va en le medio de las dos etiquetas.

Forma 2

Otra forma posible de agregar el CSS en Blogger es agregarlo justo antes de </head> pero para añadirlo aqui el CSS debe ir encerrado en la siguentes condicionales:

<style type='text/css'>CSS AQUI</style>

Agregandose el CSS justo en el medio de las condicionales «style».

Siendo el resultado final de esta forma similar al siguiente ejemplo :

 <style type='text/css'>
.jump-link {
float: right;
</style></head>

Forma 3

La tercera y ultima forma es agregandolo desde el diseñador de plantilla de Blogger.

Para abri el diseñador debes estar en Diseño, Diseñador de Plantillas ( en la parte superior), Avanzado, Añadir CSS, ya estando alli puedes añadir toda clase de atributos CSS y para guardar los cambios deberas dar click en Aplicar al blog.

Espero que les haya sido de utilidad este pequeño tutorial, si tienen alguna duda solo comenten que con gusto resolvere sus inquietudes.


23 comentarios

Anonymous · diciembre 17, 2012 a las 7:09 pm

Esta bien, pero creo que pudo haber estado un poco más elaborado.

¡Saludos!

    Hayder Juvinao · diciembre 17, 2012 a las 9:48 pm

    Pues amigo es algo basico, porque como ves muchos lectores del blog no son expertos en Diseño Web.

    Tal vez en un proximo tutorial explique más a fondo el tema del CSS en Blogger.

    tuxavier · diciembre 11, 2013 a las 7:13 am

    ;-( exacto

Facundo Trillo · diciembre 18, 2012 a las 4:17 pm

Hola amigo, se que esto no tiene nada que ver con tu articulo pero en mi blog tengo un pequeño problema, en las entradas el texto se ve mal por ejemplo en el articulo «personalizar gadget de etiquetas» el texto se ve así «Anteriormente les explique como…. y todo así con mucho espacio.

Si entras al articulo se ve bien, pero en la home se ve mal, sabes como arreglarlo?

Gracias!

Matcoma · diciembre 19, 2012 a las 8:31 pm

Muy buen tutorial. Las posibilidades que entregan plataformas como la de blogger son para todos los gustos e intereses. Gracias por la info

    Hayder Juvinao · diciembre 20, 2012 a las 9:42 pm

    Si amigo tienes razon Blogger es una excelente plataforma 😛

    Facundo Trillo · diciembre 20, 2012 a las 9:54 pm

    Mucha razón tenes, la diferencia entre Blogger y WordPress es simple, en Blogger tenes ventajas en cuanto que es gratis e ilimitado, en WordPress tenes Gadget hechos en Blogger no pero lo puedes hacer tu mismo, yo creo que Blogger es mejor

    Hayder Juvinao · diciembre 24, 2012 a las 1:00 am

    Facundo es muy cierto pero eso es comparandolo con WordPress.com no WordPress.org ya que la .org es infinitamente superior a la .com

    Saludos….

leiva · diciembre 21, 2012 a las 4:04 am

hay diferencias. YO uso ambas herramientas y he tenido que migrar muchas veces porque blogger no me da los recursos que necesito mi blog. Quiza un proyecto mas serio y diseño responsive,entre otras cosas de optimizacion – y no es que blogger no posicione- es mejor wordpress. No dudo que Blogger es excelente, pero no podemos decir que otra herramienta no es buena.

    Hayder Juvinao · diciembre 24, 2012 a las 12:58 am

    leiva yo varias vecen tambien he pensado en migrar a WordPress pero me he enamorado de Blogger y es muy dificil dejarla.

    Saludos…

Posicionamiento SEO · diciembre 24, 2012 a las 1:57 am

Blogger tiene mas facilidad de uso y es mas amigable y sencillo de utilizar comparando con otros cms o blogs desde el comienzo y sigue siendo la mas optada por mas que esta no se actualice ni realice algunos cambios o actualizaciones

Gui Lòpez · julio 30, 2013 a las 4:55 pm

muy bueno, muchas gracias

Gui Lòpez · julio 30, 2013 a las 4:58 pm

muy bueno!

juani · agosto 26, 2013 a las 11:03 pm

Hola,
Me sirvió de mucho, gracias!

MJ · febrero 14, 2014 a las 4:59 pm

Aprovecho para compartir una guía que escribimos sobre CSS. También presenta conceptos básicos con algunos ejemplos. Espero que les sea de ayuda sobre todo a aquellos que están comenzando.

http://www.glidea.com.ar/blog/guia-basica-de-css

María A. Marín · julio 20, 2014 a las 10:45 am

Hola Hayder.
Te sigo desde hace mucho y aprendo de ti.
Hoy traigo una duda de novata, creo:
Me gustaría saber qué hacer para que mi blog no tarde tanto como dicen los amigos que tratan de leerlo en los móviles.
He intentado hacerlo desde la configuración para móviles del propio blogger pero yo lo veo igual.
¡Qué pega estoy!

Saludos desde Chipiona

    Hayder Juvinao · julio 20, 2014 a las 5:06 pm

    Maria puedes hacer responsive el diseño de tu blog, si no sabes como con mucho gusto publicaré un tutorial sobre eso, pero espérame unos días.

    Saludos

Roberto · abril 11, 2016 a las 9:50 pm

(sobre blogger): yo necesito saber como aplicar css a una sola parte en concreto de una pagina en concreto dentro de mi blog. y me explico: si yo tengo el frame de un reproductor en una pagina x y quiero que se aplique el css a ese reproductor de esa página y no a otros reproductores que tengo en otras páginas, ¿como lo debo de hacer?
Gracias

    Juvinao · abril 13, 2016 a las 8:01 pm

    Hola Roberto, en ese caso debes insertar el css directamente en la página que tienes el reproductor y ya 😀

Responder a Anonymous Cancelar la respuesta

Marcador de posición del avatar

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *