El CSS en Blogger

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.

0
Shares

23 thoughts on “El CSS en Blogger

  • diciembre 17, 2012 en 7:09 pm
    Permalink

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

    ¡Saludos!

    Responder
    • diciembre 17, 2012 en 9:48 pm
      Permalink

      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.

      Responder
  • diciembre 18, 2012 en 4:17 pm
    Permalink

    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!

    Responder
  • diciembre 19, 2012 en 8:31 pm
    Permalink

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

    Responder
    • diciembre 20, 2012 en 9:54 pm
      Permalink

      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

      Responder
    • diciembre 24, 2012 en 1:00 am
      Permalink

      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….

      Responder
  • diciembre 21, 2012 en 4:04 am
    Permalink

    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.

    Responder
    • diciembre 24, 2012 en 12:58 am
      Permalink

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

      Saludos…

      Responder
  • diciembre 24, 2012 en 1:57 am
    Permalink

    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

    Responder
  • julio 20, 2014 en 10:45 am
    Permalink

    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

    Responder
    • julio 20, 2014 en 5:06 pm
      Permalink

      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

      Responder
  • abril 11, 2016 en 9:50 pm
    Permalink

    (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

    Responder
    • abril 13, 2016 en 8:01 pm
      Permalink

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

      Responder

Deja un comentario

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