Revista Comunicación

Deshabilitar la Carga CSS de Widgets Preterminados de Blogger

Publicado el 22 abril 2017 por Loquendo Manzano
Hace muy poco, todo era felicidad, pero, después de las nuevas plantillas de blogger, algo me llamo la atención, ¿que fue? ¿los nuevos diseños? no, lo que me sorprendió fue que el blog me estaba cargando un poco lento, y no se si algunos de los blogueros que me siguen lo habrán notado, soy critico con el tema de la velocidad de mi blog, mas que el diseño del mismo, me enfoco mas en cuanto tarda en cargar, pues no me gusta poner a esperar a mis lectores.
eliminate render-blocking javascript and css in above-the-fold content
El otro día en el que me di cuenta que el blog se demoraba un poco en cargar, decidí ver que era lo que estaba pasando con ayuda de Google Page Speed, Vaya! que sorpresa!, el blog tenia un puntare de 70 en móviles y 82 en computador, ¿que paso? pues muy simple, no se porque carajos uno de los enlaces que blogger coloca en cada blog para cargar los estilos de los gadgets que trae por defecto, los cuales yo no necesito, estaba siendo cargado, cuando yo los había deshabilitado, me preguntaras: ¿Pero, no habíamos bloqueado la carga de esos estilos en Eliminar el JavaScript que bloquea la visualización y el CSS? y la respuesta es Si, ya los habíamos bloqueado, pero como ya dije, después de la nuevas plantillas, no se porque razón al equipo de blogger le dio por asignar el "lugar" donde este enlace se ubica en la plantilla en otro lado, haciendo que el truco solo funcione para el otro enlace. Si no entiende de que hablo mejor date una vuelta por la entrada que enlace mas arriba.
El enlace del que hablo tiene una forma asi:
<link type='text/css' rel='stylesheet' href='https://www.blogger.com/dyn-css/authorization.css?targetBlogID=xxxxxxxxxxxx&amp;xxxxxxxxxxxxxxxxxxxxxx' />

Resumiendo: cada plantilla preterminada de blogger o diseñada, debe contener las lineas <b:skin><![CDATA[]]></b:skin> estas lineas manejan los CSS del blog o los códigos que se encargan de dar estilo al sitio, el interpretador de blogger cuando convierte el XML a HTML como tal, en ese código que maneja los estilos, incluye 2 enlaces externos que cargan los CSS de los gadgets y algunas partes del blog, esto no lo podemos quitar directamente en la plantilla, pero con el truco que vimos en la entrada enlazada, nos permitía deshabilitar su carga, lo que paso fue que uno de los enlaces ya no se incluye en el </b:skin> si no que el interpretador o yo que se lo que incluya esas lineas, ahora lo muestra antes del </head>, haciendo que se escape del truco para bloquearlo y nos genere esa demora en la carga de la pagina. Dejando la cháchara, aquí esta la solución.
Si es la primera vez que haces un proceso como este o, te recomiendo leer la entrada que enlace mas arriba alli explico mucho mejor como hacer este truco, si crees que vamos un poco rápido te recomiendo leer esta guía para mejorar la velocidad del blog
A partir del código usado en la entrada enlazada, pude crear este nuevo para este enlace que intento escapar al truco.
  1. Entra a la plantilla y busca </head>
  2. Reemplazalo por este código:

  3. Y listo eso es todo, Lo que hace el código es inhabilitar lo que se cargue por defecto antes del </head> (que es el lugar donde se esta ubicando ese enlace).
Para confirmar, mira el código fuente de tu blog, en la parte del head deberás ver algo como esto:
eliminate render-blocking javascript and css in above-the-fold content

Volver a la Portada de Logo Paperblog