24-04-2014, 12:20 PM
Para comprobar la carga de nuestro blogger podemos utilizar dos herramientas y asi analizar los tips, que nos muestran. Pero como los errores mas comunes son siempre los mismos, vamos a intentar aclarar algunos puntos.
Primero si haceis una landing page teneis que utilizar la plantilla en blanco como esta, que he rectificado.
Aquí hay varias cosas importantes primero:
esto nos asegura la compatibilidad con dispositivos móviles.
Imprescindible, pues le estamos diciendo no cargues nada de hojas de estilos precargadas de blogger, que ralentiza mucho la carga, solo mi css, que mejoraremos con esta pagina que os dejo.
Compresor de css
Ahora despues de esto ya podemos utilizar nuestro html, pero de dos formas distintas. Una creando un widget y pegando nuestro html, mas lento, 2 parseando nuestra html para hacerlo compatible con blogger.
Para ello utilizaremos esta pagina.
parse code xml
Bueno y dos imagenes para ver que se puede conseguir.
![[Imagen: movil.jpg]](https://2.bp.blogspot.com/-2eStNbewnHY/U1jimb31fwI/AAAAAAAAAKM/0bc3Nyv_tb8/s1600/movil.jpg)
![[Imagen: ordena.jpg]](https://2.bp.blogspot.com/-OAdlIHRBSM8/U1jimCFMdUI/AAAAAAAAAKI/C6WFk8nGz3c/s1600/ordena.jpg)
Primero si haceis una landing page teneis que utilizar la plantilla en blanco como esta, que he rectificado.
Código:
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
<b:if cond='data:blog.isMobile'>
<meta content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0' name='viewport'/>
<b:else/>
<meta content='width=1100' name='viewport'/>
</b:if>
<b:include data='blog' name='all-head-content'/>
<title><data:blog.pageTitle/></title>
<style type="text/css"><!-- /*<b:skin><![CDATA[*/]]></b:skin><style type='text/css'/>
</head>
<body>
<b:section id='main' showaddelement='yes'/>
</body>
</html>Código:
<b:if cond='data:blog.isMobile'>
<meta content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0' name='viewport'/>
<b:else/>
<meta content='width=1100' name='viewport'/>
</b:if>Código:
<style type="text/css"><!-- /*<b:skin><![CDATA[*/]]></b:skin><style type='text/css'/>Compresor de css
Ahora despues de esto ya podemos utilizar nuestro html, pero de dos formas distintas. Una creando un widget y pegando nuestro html, mas lento, 2 parseando nuestra html para hacerlo compatible con blogger.
Para ello utilizaremos esta pagina.
parse code xml
Bueno y dos imagenes para ver que se puede conseguir.
kin><![CDATA[*/]]></b