25 abr. 2011

Diseñador de Plantillas de Blogger



Llegó la hora de hablar sobre el diseño en general de nuestro blog. Llegados a este punto existen dos caminos, usar el diseñador de plantillas de blogger o incorporar una plantilla prediseñada...

Lo cierto es que antes de que apareciera el diseñador de plantillas de blogger (Marzo 2010) era prácticamente obligatorio buscar una plantilla prediseñada para el blog, que nos permitiera identificarnos rápidamente.

Lo primero que haremos es analizar los diferentes elementos que forma parte de la estructura de nuestro blog.
  • El Fondo general del blog. Puede ser un color o una imagen
  • Cabecera. Puede ser un texto, una imagen o una combinación entre ambas. Recuerda que existe un Gadget para configurar este apartado.
  • Menú de enlaces o páginas. Normalmente situado después de la cabecera. Permite la navegación por el blog y sus páginas. Recuerda que puedes crear hasta 10 páginas por ejemplo para un formulario web, un libro de visitas, etc.
  • El cuerpo. Formado por una la zona donde se publican las entradas y normalmente una zona vertical situado a la derecha de las entrada. 
  • El pie. Puede estar formado por varios bloques y quedará situado por debajo del cuerpo del blog
Luego tenemos los otros elementos como el tipo de letras, etc. Todos estos aspectos pueden ser configurados directamente desde el diseñador de Plantillas. Con la ventaja añadida de que puedes cambiar sobre la marcha cualquiera de estos elementos, incluso la estructura del cuerpo (1 columa, 2 columnas, etc) o del pie del blog

Para que te sirva de referencia, este blog se ha ido mejorando utilizando el diseñador de plantillas de blogger. Todo lo que ves, incluido los  tipo de letra han sido seleccionados utilizando esta herramienta.

A continuación te dejo el video que utilizó Google para anunciar esta novedad (inglés)


Recuerda que para comenzar a usar las novedades en Blogger antes de que esté disponibles a todos los usuarios puedes acceder al administrador utilizando http://draft.blogger.com en lugar de http://blogger.com. Una vez hayas accedido a través de draft te preguntará si quieres usar draft como escritorio por defecto.

Evidentemente mi recomendación es que uses el diseñador de plantillas incorporado en blogger (Pestaña diseño). Si después de ver el video y probar la herramienta no quedas convencido sigue leyendo.

Plantillas gratuitas para blogger:
La otra alternativa es conseguir una plantilla personalizada en función de la temática que busques para luego irla adaptando. Existe gran variedad de sitios que te ofrecen plantillas para blogger gratuitas. Todas estas plantillas tienen en cuenta los diferentes elementos de la estructura, mencionados anteriormente.
Una vez elegida tu plantilla deberás incorporarla a través de la pestañá Diseño y luego Editor HTML. Presiona el botón seleccionar plantilla para cargar el archivo XML previamente descargado de alguno de los siguientes sitios:

¿Conoces algún otro sitio de plantillas para blogger?

Como siempre espero tus comentarios. Si te ha gustado esta entrada recomiéndala usando el botón de Me gusta o de Twittear. ¡Gracias!

    30 comentarios:

    1. Esta muy bueno , Gracias por las 50 plantillas mas bonitas.

      ResponderEliminar
    2. Gracias "mensajes claros" por participar en iniciaBlog con tu comentario. Seguimos en contacto.

      ResponderEliminar
    3. Valentin5/8/11 8:46

      Hola, muchas gracias por tu interesante blog que me está sirviendo para cerear uno...te hago una pregunta...he utilizado una de las plantillas de TEmplate pero no sé como cambiar el widget de sigueme en twitter que sale por defecto en la plantilla y quiero poner el mío...muchas gracias, feliz dia

      ResponderEliminar
    4. Hola Valentin,

      tendrías que revisar esta entrada http://www.iniciablog.com/2011/03/twitter-blogger-cada-entrada-post.html.

      Coméntame tanto si lo has podido hacer como si no una vez que la hayas leído.

      Muchas gracias por tu comentario.

      ResponderEliminar
    5. Valentin5/8/11 9:43

      Otra cosa...para hacer lo mismo con Facebook, twittear, pdf, enviar a...

      gracias

      ResponderEliminar
    6. Gracias Valentin,

      Haz clic arriba donde pone "Contenidos" ahí tienes todos los tutoriales publicados en iniciaBlog.

      Mucha Suerte ya me cuentas!

      ResponderEliminar
    7. Valentin6/8/11 20:25

      Hola, sigo leyendo tu contenidos...al final no he querido complicarme con la plantilla y he escogido una del mismo blogger....lo que no se hacer es poner después de la cabecera como lo que tienes en este blog...inicio, contenidos, acerca de , contacto....etc

      Los cuadros de gadget no los puedo mover en diseño...

      Ya me dices donde puedo encontrarlo...muchas gracias!!

      ResponderEliminar
    8. Hola,

      ¿sabrías decirme donde puedo encontar una plantilla de blogger estilo "videoblog" que sea bonita? Muchas gracias

      ResponderEliminar
    9. Hola Cristina.

      Gracias por tu comentario, efectivamente cuando trabajas mucho con video lo ideal es un plantilla adaptada para mostrar este tipo de contenido. He puesto un Enlace más en el post sobre el tema que me has pedido. Espero que te guste, de todas formas si no es lo que estabas buscando coméntame vale?

      Saludos, Jesus.

      ResponderEliminar
    10. Hola de nueo Jesús,

      he empezado a utilizar la plantilla que e comentaste pero no se ven los vídeos, ¿sabes si debo introducir un código especial?
      Aquí es donde estoy haciendo las pruebas http://videoempresa.blogspot.com/
      muchas gracias

      ResponderEliminar
    11. Cristina,
      debes ver las instrucciones a veces depende de que en cada post el vídeo sea el primero de los elementos, pero... tienes que revisar la documentación correspondiente que debe acompañar a la plantilla...

      ResponderEliminar
    12. Bueno pues felicidades por el blog. Es muy bueno.
      Veremos si me podeis responder a unas preguntas a las que nadie me ha podido responder al día de hoy; tiene relación con el SEO.
      1º Si como sabemos todos los blogs sufren una primera modificación para ordenar nombre del post | nombre del blog, porqué Google no lo ha realizado en sus plantillas.
      2º Este mismo blog: viendo el codigo fuente observo que el título del post está entre etiquetas h3. Si fuera un blog de wordpress estaria entre etiquetas h1 según las buenas prácticas seo.
      Me podría extender más pero espero vuestras respuestas.
      Tenis previsto un post que ponga como ejemplo vuestra plantilla y los retoques SEO que habeis tenido que hacer.

      Permitidme una última pregunta ¿porque la plantilla de blogger cuando es revisada on line con validator.W3.org está cargada de multiples errores y en cambio wordpress supera la prueba?. Por ejemplo este vuestro blog el validator markup validation descubre 379 errors y 288 warnings, mientras blogs de W arrojan no mas de 40 errores.

      Espero vuestra contestación.
      Saludos.

      ResponderEliminar
      Respuestas
      1. Hola aGamez-cm

        Muchas gracias por tu felicitación y por plantear estas cuestiones, entiendo que realmente dirigidas a los ingenieros de Blogger no a mi. Sin embargo voy a darte mi opinión.

        Efectivamente el título a efectos de html que toma cada una de las entradas es nombre blog + titulo post por lo que es muy poco efectivo desde el punto de vista seo. De todas formas un dato. Si crear ahora un blog y le aplicas una plantilla dinámica el título que toma tu post es el título de la entrada y nada del nombre del blog. Por lo tanto es correcto, yo no pondría en nombre del blog tampoco ni siquiera como el segundo de los términos. Sin embargo si seleccionas una plantilla simple esto sigue siendo como hasta ahora (nombre del blog y titulo del post)

        Con respecto a tu segunda pregunta sobre el H1, H2, H3 efectivamente lo lógico es que H1 se reservara para el título de cada entrada, sin embargo Blogger lo reserva para el nombre del blog que en muchos casos como el mio es sustituido por un logo. No alcanzo a entender tampoco porqué H2 se reserva para el título de los Gadgets. Sin embargo y de acuerdo con tu apreciación en una plantilla dinámica de Blogger, esta situación cambia. Y el título del post es de manera nativa también un h1.

        Con respecto a tu tercera cuestión sobre los retoques que he tenido que hacer, claro...precisamente de esto va este blog. Como empiezo desde cero creando un blog con Blogger hace ya casi 2 años y cómo tengo que ir superando obstáculos no solo desde el punto de vista SEO, también de integración en redes sociales, dispositivos móviles, estrategias, etc, etc. mira el índice contenidos de iniciaBlog. Está explicado el cambio sobre el título del post que hay que hacer.

        Lo del validator.w3.org es una vergüenza que pase lo que está pasando, no sé supongo que el problema viene de base y de las técnicas XML que se usan para fusionar en la vista inicial de un blog todos los post, gadgets, etc, etc. Sin embargo te doy un dato positivo Si el pasas el validador a un blog creado hoy que contenga 1 entrada y que usa la plantilla simple, el validador arroja la friolera de 46 errores. Si haces la prueba usando la plantilla dinámica, la cantidad de errores se reduce a 4. Como sabes el HTML5 parece estar en tierra de nadie. LA gran novedad ahora sobre este tema es WebPlatform Docs y mira quién está detrás de lograr de una vez por todas un estándar.

        Conclusiones...las plantillas simples de blogger fueron un gran paso ya que soportan la funcionalidad del diseñador de plantillas. Supusieron en su momento una revolución acercando al usuario final un grado de personalización que hasta ahora no era posible de manera directa. Estas plantillas tienen la firma de personas y diseñadores que supongo están ahí por algo. Los errores que se vienen arrastrando desde el punto de vista SEO se siguen arrastrando en la actualidad.

        Las plantillas dinámicas basadas en HTML5 y CSS3 han supuesto todo un cambio de concepto y de calidad. Estas plantillas son muchísimo más rápidas que las convencionales, mejor seo de serie pero...con el inconveniente de que no soportan toda la lista de Gadget, no permiten la edición del HTML de manera directa y exigen al navegador web un grado de actualización máximo.

        A mi me dá la impresión que las plantillas simples fueron un encargo, las plantillas dinámicas si son un producto hecho por ingenieros de Google. Lo último con respecto a esto es que las plantillas dinámicas ya están disponibles para las plantillas de móviles.

        aGamez,

        Si yo fuera ingeniero de Blogger te recomendaría usar las plantillas dinámicas de Blogger para está a la última en todos los aspectos por los que me preguntas. ¿qué hacemos, cambiarías tu blog? Yo te diría no.

        La pregunta es ¿por qué Blogger no sigue actualizando las plantillas simples para adaptarlas a las nuevas exigencias SEO?

        Un fuerte abrazo y muchas gracias por tu comentario.
        Jesús.

        Eliminar
    13. Gracias por tus respuestas. Realmente como dices son preguntas para los ingenieros de blogger pero.... si en los foros de ayuda te las ves y deseas para que contesten imagínate donde irían a para estas preguntitas.
      Muchas gracias. Analizaré lo que me comentas de las plantillas dinámicas.

      ResponderEliminar
      Respuestas
      1. Gracias AGamez,

        Como conclusión debemos empezar que Blogger son dos elementos, por un lado el servicio de creacion de contenidos y por otro la plantilla. Lo que urge es actualizar las plantillas que por defecto ofrece el servicio para equipararlas a la calidad del servicio de gestión de contenidos ¿no te parece?

        A la espera de tus pruebas con la plantilla dinámica. Recuerda que si pones en el navegador la url de tu blog/view puedes ver el aspecto que este toma con esta plantillas sin necesidad de cambiar nada.

        Jesús González

        Eliminar
    14. Hola:
      Estoy creando mi primer blog y quiero agregar gadgets.
      Tengo 2 preguntas al respecto
      1 - En las instrucciones dice que haciendo click y arrastrando el gadget se puede mover de sitio y no lo he podido hacer, los gadget vuelven a su lugar original.
      2 - Al principio agregue el gadget "Páginas" para agregar enlances a otros blog o paginas web y como no quedaba como queria lo eliminé. Ahora quiero volver a intentar usarlo y me dice en el listado disponible que ya fue añadido. Hay forma de volverlo a añadir?
      gracias desde ya
      saludos

      ResponderEliminar
      Respuestas
      1. Hola Adriana,

        con respecto a tu primera pregunta, efectivamente debes estar en la pestaña Diseño y debes poder moverlo, si no lo hace es porque a lo mejor el Gadget está pensado para que esté en unas determinadas posiciones.

        Con respecto a las páginas, trata de crear una nueva pagina en tu blog. Efectivamente es posible que te diga que el Gadget ya existe, pero si no tienes ninguna página, no tiene ningún efecto visual sobre el blog.

        Dime cual es la dirección de tu blog para hacerme una mejor idea.

        Eliminar
    15. Hola Jesús, sabes algo de los fallos en el botón Aplicar al blog en las plantillas dinámicas, si es un fallo temporal, porque sé que le pasa a más gente o pasa cuando se intenta modificar la Edición HTML de la plantilla, como yo he intentado hacer. El fallo consiste en que no se puede agregar CSS y que algunas veces no se puede cambiar ningún color o tipo de letra.

      ResponderEliminar
      Respuestas
      1. Tengo que mirarlo, pero realmente eres el primero que me lo comenta. Siento no poder ayudarte mucho en este caso. Jesús

        Eliminar
      2. Por cierto, quedó bien lo de las páginas de sociales en tu blog, enhorabuena!

        Eliminar
    16. Gracias. Otra cosa que veo es que en tablets mi blog, y otros blogs como el tuyo o el de "los productos de google en español" se abren por defecto con la plantilla móvil, no con la plantilla versión web, y esto antes no pasaba.. Ya no sé si es problema de mi tablets o es que hay problemas con los blogs de blogger.
      Gracias Jesús, un saludo!

      ResponderEliminar
      Respuestas
      1. Posiblemente la plantilla está detectando ese tablet como un movil y por eso te ofrece la plantilla movil por defecto. Tendría que hacer una prueba, ¿que tableta estas usando?

        Gracias!
        Jesús

        Eliminar
    17. Buenas noches, gracias por tus posts han sido de ayuda. Desearíamos poner vistas dinámicas, pero perdemos los enlaces o gadgets que tenemos al lado derecho del blog y son más de diez. ¿Qué podemos hacer?. Ellos son necesarios porque nuestros estudiantes ingresan a www.iesibom.blogspot.com y desde allí buscan el área o el blog que desean. Si ellos no visualizan los gadgets, no podrían ingresar con una sola dirección a todos nuestros blogs. Disculpas de antemano si la pregunta es muy elemental. Pero no sabemos cómo hacer. Muchas gracias por el favor.

      ResponderEliminar
    18. Buenas noches. Nos gustaría mucho contar con tus sugerencias para mejorar nuestro blog. www.iesibom.blogspot.com De antemano muchas gracias-

      ResponderEliminar
      Respuestas
      1. Hola I.E. Simón Bolivar,
        Acabo de dejarles un comentario. Muchas gracias por la visita!

        Eliminar
      2. Buenas noches, muchas gracias por visitar nuestro blog. Nos sentimos muy complacidos y nos agradaría saber los pasos para insertar el buscador que nos recomendaste. Muchas gracias por la asesoría.

        Eliminar
    19. Hola amigos, tengo un problema con la colocación de la imagen en la cabecera del blooger (ultima interfaz), resulta que e intentado colocarla de tal manera que cubra toda la cabecera y no puedo hacerlo, por favor cualquier ayuda que me puedas prestar te lo agradecería.

      ResponderEliminar
      Respuestas
      1. Hola Eliezer,

        Me hace falta que me indiques la dirección de tu blog.

        Te espero,
        Jesús González

        Eliminar
    20. Hola,
      he aplicado una plantilla prediseñada de templete, pero quiero eliminarla,(xq era una prueba y esta no cumple mis espectativas), y no se como hacerlo.
      Podrçia responderme alguien??. Grcvias

      ResponderEliminar
      Respuestas
      1. Hola Inma,
        Para eliminarla solo tienes que elegir por ejmplo una plantilla simple, de esta forma incorporas la plantilla por defecto.

        Un abrazo y gracias po comentar
        Jesús González

        Eliminar

    Te agradezco la participación en iniciaBlog a través tu comentario. Recuerda que te responderé con otro comentario justo debajo del tuyo. Gracias y mucha suerte! ;-)

    Más información ¿Cómo poner el botón de...:?

    Premio Bitácoras

    Aviso Legal

    Licencia Creative Commons
    iniciaBlog - Te ayuda con Blogger a mejorar tu blog
    iniciaBlog se encuentra bajo una Licencia Creative Commons Reconocimiento-NoComercial-CompartirIgual 3.0 Unported.
    Basada en una obra en www.iniciablog.com.

    Creado por Jesús González

    Política de Privacidad de iniciaBlog | Política de Cookies
    2015 © Jesús González es el autor de iniciaBlog.com
    Tema creado por Way2themes y adaptado por inciciablog