Nuevo diseñador del demonio | Oloblogger No hace mucho que Blogger anunció su nuevo diseñador de plantillas operativo desde Blogger Draft y...

22 de julio de 2010

Nuevo diseñador del demonio

No hace mucho que Blogger anunció su nuevo diseñador de plantillas operativo desde Blogger Draft y mucho menos desde que lo habilitó para que estuviera operativo desde Blogger "normal".

Pues bien, en este poco más de un mes desde que dejó de estar en beta, me he dedicado esporádicamente a trastear una plantilla que construí para hacer pruebas y realmente me está resultando muy complicado entender cómo diablos funciona.

HECHOS

La cuestión empieza con que ahora hay muchísimas más variables que con las anteriores plantillas. Esto es normal y necesario para realizar tantos cambios en el estilo y en la estructura (columnas) como ahora es posible, desde el diseñador. Hasta aquí no hay demasiados problemas, porque poco a poco, podemos averiguar para qué sirve cada variable (ahora incluso están en grupos) y con no mucho trabajo, modificar los valores. De esta manera, metiéndonos en el código podemos escaparnos un poco de los valores que nos da el diseñador y poner los nuestros propios. Esto por ejemplo es lo que podemos hacer con los fondos, limitados en un principio, pero que podemos cambiar.

...
<Group description="Backgrounds" selector=".main-inner">
<Variable name="body.background.color" description="Outer Background" type="color" default="#c0a154" value="#a73d3d"/>
<Variable name="footer.background.color" description="Footer Background" type="color" default="transparent" value="#000000"/>
</Group>
...

Pero ahora empieza lo complicado. Nos encontramos en la plantilla con dos apartados distintos de código CSS. Uno es el de siempre, el que se encuentra entre <b:skin><![CDATA[/* y su correspondiente cierre. Pero hete aquí que a continuación, viene una etiqueta Blogger de nuevo cuño (ni esta ni la anterior son etiquetas estándar) que también incluye la palabra SKIN y que efectivamente contiene CSS, pero de aquella manera: <b:template-skin>

Dentro tenemos -otra vez- más etiquetas nuevas con unas variables y el segundo CSS que comentaba. Un verdadero embrollo porque no sé que es lo que manda sobre qué. Ya decía en el título que en esta obra, Belcebú está de por medio.

Parece que la finalidad de esta parte es aplicar los datos referentes a la estructura de columnas, seleccionados desde el diseñador, mediante las mencionadas variables y sus correspondientes selectores.

...
<b:template-skin>
<b:variable default='930px' name='content.width' type='length' value='1000px'/>
<b:variable default='0' name='main.column.left.width' type='length' value='160px'/>
<b:variable default='360px' name='main.column.right.width' type='length' value='300px'/>

<![CDATA[
body {
min-width: $(content.width);
}
...


Y para rematar la faena llega el BODY, con una ingente cantidad de capas, subcapas, subsubcapas, retrosubsubcapas.... que van formando la estructura principal del blog con selectores de nueva denominación ininteligibles en su mayoría: fauxborder-left main-fauxborder-left, fauxborder-right main-fauxborder-right, region-inner main-inner, columns fauxcolumns, fauxcolumn-outer fauxcolumn-center-outer, cap-top... y un sinfín de columns y más columns del demonio.

Aquí es dónde más me pierdo, porque por muchas cosas que modifico en los selectores e identificadores que parecen los adecuados y por muchos !important que utilice, los resultados son los que Dios Blogger quiere.

Y es que aquí aparecen de nuevo códigos misteriosos Blogger: macro:include, macro:param, macro:if, mexpr... y que tienen una pinta de que no podemos manejar que tiran de espaldas.


Finalmente, incluso respetando el código y haciendo los cambios desde el diseñador, os puede pasar como a mí y encontraros con que parte del blog se descuadra dependiendo del navegador que se utilice. Un desbarajuste leve -eso sí- pero molesto por cuanto no supe como enmendallo. Para colmo fue con Chrome = Google = Blogger!!!


OPINION

El nuevo diseñador es casi perfecto para dar estilo a los elementos del blog y maquetar su estructura sin tener ni idea de HTML ni CSS, pero luego es infernal para incorporar cambios en dicha estructura... al menos hasta que alguien descubra cómo funciona todo lo anterior.

ADENDUM

Ni se os ocurra preguntar aquí por problemas relacionados con cambios estructurales de plantillas hechas con el diseñador si no quereis que siga quemándome.

¿Vemos otro post al azar por si le encuentras utilidad o quizás prefieres ser más metódico y suscribirte a nuestras entradas por correo? También puedes imprimir este artículo y por supuesto compartirlo en redes sociales si fue de tu agrado.

Compartir
Copy URL

Y muchos más artículos interesantes si nos sigues en...

follow us in feedly

23 comentarios :

  1. Sí es todo un mundo esto de blogger y demás. Te leo desde tiempo pero nunca comento nada. Hoy me llamó la atención el nombre de la entrada pues tuve un problema en mi blog y pensé que sería algo común. Todo un mundo por aprender y gracias. Esas que nunca te he dado pero que me han servido para montar el blog y para en un futuro mejorarlo

    un saludo

    ResponderEliminar
  2. Opino lo mismo que tú. No he tenido mucho tiempo para dedicarle pero en la pruebas que he ido haciendo me he vuelto loco con tantas variables... para crear una desde cero sin tener ni idea el diseñador, si queremos una desde cero controlando todo el código, es mejor utilizar una plantilla antigua... Un saludo.

    ResponderEliminar
  3. Las nuevas plantillas son todo un enredo, desde la forma en las que están estructuradas hasta el entendimiento de las nuevas variables.
    Yo al menos he preferido no verlas tan de cerca por miedo a perder la razón, y es que son un verdadero caos.

    Coincido en que están hechas para quien no sabe personalizarlas con CSS y HTML aunque es una desgracia que no estén hechas para poderles hacer muchos cambios.

    ResponderEliminar
  4. No hay de qué Nat. Por aquí estamos y estaremos mientras no se convierta en un trabajo. Gracias.

    Raúl - El Potro, como comento arriba, lo de las variables quizás sea lo más fácil. Se pueden cambiar desde el diseñador o "manipular" directamente en la plantilla con un poco del sistema ensayo-error. Sin embargo lo de intentar alterar la estructura es lo que de verdad te quema :D

    ResponderEliminar
  5. Jajajajajajajajajaja... me llamo la atención el título ¬¬

    Me parece que las variable son una buena incorporación...
    pero como dijiste al final, le metieron más capas que una cebolla y lo más intrigantes es que HAY CAPAS FALSAS!!!

    Y yo que apenas estaba familiarizándome con las anteriores...

    ResponderEliminar
  6. Bueno Oloman lamento decirte que yo tendré que hacer caso omiso a tu ADENDUM y condenarte al infierno porque creo que haré varias preguntas en lo que me adapto a este diseñador :D.

    ResponderEliminar
  7. Oloman, nada más exacto que el nombre que le pusiste!
    Justo ahora que creí entender un poquitín mi plantilla viene esta maroma de las nuevas y pufete!! de nuevo no entiendo ni jota!
    Tenia (de antes) un blog de pruebas y heme aquí q mi dedito apretó no sé q cosa, y el bendito blog se me convirtió en uno nuevo!!!
    ni decirte q no puedo ponerle una copia de mi plantilla para hacer pruebas, ni encuentro elementos de diseño, bah... un asquete!
    ahora con sumo cuidado manejo los otros blog que, menos mal, antes antes antes de esto, tenia reservados :)

    Pero siempre quedamos en espera q ustedes, los inteligentísimos, laburantes, emprendedores,bondadosos y demas buenos adjetivos, nos enseñen como usar estos mamarrachos que se manda blogglers!jeje
    Un abrazo

    ResponderEliminar
  8. Que tal, pues la verdad a mi no me gusto nada la nueva opcion de blogger de diseño de plantillas, hace dias estuve a punto de crear otro blog y pues como soy muy meticuloso con las plantillas experimente con el que tiene blogger (diseñador) y aunque es muy accesbile y no muy complicado en cuando externamente, no funciona para mi, y ahora con mi blog actual y el de siempre (WinBoox) cuando quiero modificar los colores de fondo o de la plantilla, igual se me hace mas lento y revoltoso, pero en fin gran post, saludos

    ResponderEliminar
  9. Oloman, tanto tiempo! paso a dejarte un saludo! Nos leemos ;)

    ResponderEliminar
  10. Hola amigo, buen aporte. A mí, personalmente, me gustan muchos los cambios hechos en blogger, pero a veces se hace muy complicado el poder modificar la plantilla o integrar nuevos complementos, ya que a veces es imposible encontrar ciertos códigos. Felicidades por tu blog.

    ResponderEliminar
  11. Buenas Oloblogger.
    Ando ahora retrasteando con mi vieja plantilla y se me estuvo pasando por la cabeza rehacerla partiendo de una de las nuevas pero me acabas de disuadir por completo. Buff!!! Pero la cuestión es que tarde o temprano las nuevas variables y estructuras serán las estandar de blogger. :S terror!

    Otra cosa que he estado trasteando y me resulta intrigante, a ver si sabes algo; Resulta que para todos los .png .gif me respeta las zonas transparentes, pero en el post body NO, es decir todo lo que fuera transparente me lo pone en blanco. ¿Vuelve a comprimir picassa sin respetar la transparencia solo para las imágenes de los post? Lo digo porque he buscado en el css cualquier referencia al fondo de las imagenes,como pone en la ayuda de blogger, pero todo bien, es decir sin color. Pruebo a alojar la imagen con transparencias en imgshack.us y si me la respeta ¿¡!? ¡Pero si para cualquier otra cosa del blog SI respeta la transparencia!
    En fin, que me tiene intrigado.
    Gracias por tu manual para el bloguero de a pie.

    ResponderEliminar
  12. Yagrear, más que capas falsas, pienso que son capas que unas veces se utilizan y otras no, preparadas ahí por si alguna opción del diseñador las necesita.

    Bonzu, nos veremos allí entonces :D

    Luz, seguro que se va descifrando la cosa poco a poco. Igual que ocurrió en anteriores casos.

    Obdemurian no era mi intención disuadir a nadie, sino sólo dar mi punto de vista sobre esta nueva utilidad. Efectivamente, habrá que irse haciendo a la idea, porque el avance no se puede frenar. El ejemplo más claro son las plantillas de Blogger clásico (antiguo) que actualmente son complicadas de mantener porque no hay casi información.
    Sobre lo de las imágenes no sabría decirte. Nunca he probado con PNG con transparencia, pero sí con GIF. Sin embargo Blogger (Picasa) a veces admite gif animados y otras veces los convierte en estáticos. No sé cual es la razón. Para evitar problemas, casi siempre utilizo JPG aunque el resultado sea más simplón.

    ResponderEliminar
  13. ¡Ooops! Me salté a tres...

    Mike la parte de las opciones de cambio de colores y fondos, con seguridad que es la mejor lograda y la más fácil. Si para tí sólo eso resulta inconveniente, adelante: el diseñador funciona bien.

    Rodry, se corresponde al saludo :)

    Edudemonio, no hay nada imposible... si tienes la suficiente paciencia ;)

    ResponderEliminar
  14. Hola, es mi primera vez que paso a comentar en este blog que es el mojor de el 2009 de 20minutos.
    Te felicito por este blog.

    Bueno, yo desde que use este diseñador de plantillas es mas dificil que nunca, cuando uno crea un blog de pruebas este tienes que usar la plantilla usada anteriormente blanca, pero solamente te dejan las nuevas.

    Pero podemos recuperarlas:
    Diseño-Edicion HTML- hasta abajo dice diseños plantillas viejas, es el HTML o XML como le quieran llamar esta en un codigo y solamente hay que copiarlo.

    Buen post :)

    ResponderEliminar
  15. Que tal, pues yo siempre ando cambiando mi planilla y esta última parece que tiene una larga vida, pero (siempre hay un pero) no he podido poner un extra donde se vean los tuiteos de mi cuenta.

    ¿cual me recomiendas o como lo sonsigo? x que no me dan muchas opciones (de hecho ninguna) :s

    Saludos. y si te parece, puedes responder a mi correo responde a mi correo desde mi pag. of. :)

    ResponderEliminar
  16. Excelente jejej!

    Hola Oloman, tanto tiempo espero que te encuentres de maravillas, jeje no como yo he sufrido algunos problemas ultimamente u.u
    bueno tan solo me gustaria preguntarte como podria hacer para que se vea igual a este sitio (a las entradas) jeje tengo casi el mismo estilo nada mas que el mio es de otra forma.

    Este es mi blog, http://eligor-siniestro.blogspot.com/
    Este es como quiero que me gustaria que se viera para un futuro proximo http://newalbumreleases.net/ , i ahi que esta el demo de esa plantilla, http://btemplates.com/2009/blogger-template-zinmag-remedy/demo/

    Cuales serian las modificaciones para que logre eso?

    Saludos! te lo agradesco MUCHISIMO! :$

    PERDONA LA MOLESTIA, lo siento u.u

    ResponderEliminar
  17. Luis gracias por el aporte. Realmente, aunque exista el nuevo diseñador, todavía podemos crear nuestro blog con las plantillas llamadas hasta ahora "nuevas" e incluso con las "clásicas", buscando esas opciones desde el lugar que comentas.

    Frecuenciax, si buscas en internet, hay multitud de gadgets para Twitter. Por aquí podrás encontrar sólo los "oficiales". Si te sirven, lo podrás ver en este enlace.

    Eligor!, el que pones de ejemplo no es un blog Blogger con dominio gratuito, sino Wordpress de pago. Eso quiere decir que no tiene unas limitaciones que nosotros sí tendríamos, por lo que no podrás hacer muchas cosas. La plantilla que pones es la misma pero en versión Blogger, ósease, adaptada. Utiliza esa pero mejor no intentes hacer tu blog igual que el que viste.

    ResponderEliminar
  18. Este comentario ha sido eliminado por el autor.

    ResponderEliminar
  19. lo mismo es una enredo tremeno no me gusta prefiero las antiguas .

    ResponderEliminar
  20. Hola Oloman,
    Enhorabuena por tu blog! Te escribo porque estoy un poco desesperada y no sé a quién acudir, afortunadamente que hay gente como tú que nos ayuda a todos porque si hay que esperar que los de google lo solucionen...Me pasa que hace unos días que mi plantilla del blog (no de las que ofrece blogger) no se carga. He intentado volver a subirla desde mi equipo pero ha sido peor, ahora está totalmente desordenada, me han desaparecido botones, el fondo, los títulos, mis enlaces a otros blogs etc..No sé cómo volver a recuperarla, ayúdame por favor, me la curré mucho y no quiero perderlo todo.
    este es el blog: http://latribudemama.blogspot.com/
    Gracias, Un abrazo.

    ResponderEliminar
  21. Romiyin, no he podido atender tu comentario hasta hoy. Por lo que veo, probablemente has desesperado del todo, porque ahora tienes una plantilla de las del nuevo diseñador y por lo que decías, la tuya no era de las "de serie".

    La única forma de arreglar problemas graves en la plantilla (salvo que sean debidos a fallos temporales de Blogger, en cuyo caso sólo hay que esperar), es haciendo regularmente copias de seguridad para poder restaurar los desaguisados que podamos cometer. Eso o hincharse a recomponer el código recordando todas las pequeñas o grandes reformas que hicimos. Lo siento...

    ResponderEliminar
  22. Hola majo!

    me estoy volviendo loca con el j* blog, soy novatilla pero trasteando he conseguido que, en mi web, esté metido el blog (con iframe...) peeero pasa una cosa rarisima....si abro el blog desde google, y pincho en una imagen de una entrada, ésta se abre en otra ventanita, pero si estoy en el blog desde la web, la imagen sustituye al blog y no hay posibilidad de cerrar la imagen para volver a la entrada donde estaba esa imagen, solo dando hacia atrás en el firefox....cosa raraaaa raruna...que debería mirar...el código del blog o de la web? de verdad que me trae loca

    Un abrazo y mil gracias "de antebrazo"

    ResponderEliminar
  23. Eni, necesitaría la dirección del blog y la de la web para echar un vistazo, porque a bote pronto, sólo se me ocurre que estés usando _blank en los enlaces de las imágenes y eso provoque distintos resultados según la pinches desde el iframe o directamente en el blog.

    Sobre los enlaces externos.

    ResponderEliminar