Blogger: Posts resumidos estilo revista o magazine

L os blog estilo revista o magazine como se los suele llamar ya es moneda com{un en las plantillas de wordpress, son muy llamativos y funcionales a la hora de mostrar varias entradas en poco espacio, basicamente muestran varias entradas a manera de sumario con el título de la entrada mas un pequeño resumen, con o sin mostrar una imagen. Aqui pueden ver lindos ejemplos para Wordpess.

Ahora le toca el turco a blogger, ya hay varias plantillas que ofrecen estas caracteristicas, obviamente no tienen las mismas prestaciones que las de Wordpress, pero de a poco se va logrando un buen resultado práctico y estético. Buscando en la web me topé con oloblogger, donde se explica la forma mas sencilla de hacer este estilo.

En solo dos pasos podemos lograrlo, es una forma simplificada pero se logra una resultado mas que aceptable.

Primero, vamos a diseño, edición HTML y expandimos la plantilla de artilugios. Buscamos

]]></b:skin>

y justo antes insertamos le siguiente código:

.resumen {
float:left;
display:block;
margin:0px 0px 5px 5px;
padding:0px 5px 5px 0px;
width:200px;
height:250px;
overflow:hidden;
font-size:12px;
font-style:italic;
text-align:center;
color:#000000;
background:url(url-imagen);
}
.resumen img {
width:80%;
}

Segundo, debemos insertar en el loop principal, esto es para que este estilo solo se vea en la página principal y no cuando estemos en una entrada individual. Entonces buscamos las siguientes lineas e insertamos lo que está en negritas:

<b:includable id='main' var='top'>
<!-- posts -->
<div class='blog-posts hfeed'>

<!-- <b:include data='top' name='status-message'/>-->
<data:adStart/>
<b:loop values='data:posts' var='post'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div class='resumen'>
<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>

<b:include data='post' name='post'/>
</div>
<b:else/>
<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>

<b:include data='post' name='post'/>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:include data='post' name='comments'/>
</b:if>
<b:if cond='data:post.includeAd'>
<data:adEnd/>
<data:adCode/>
<data:adStart/>
</b:if>
<b:if cond='data:post.trackLatency'>
<data:post.latencyJs/>
</b:if>
</b:if>
</b:loop>
<data:adEnd/>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div style='clear: both;'/>
</b:if>

</div>

<!-- navigation -->

Listo, el estilo revista o magazine ya está funcionando en el blog, lo único que nos queda es modificar el width y el weight para que se adapte a nuestro blog, también podemos modificar la fuente y agragarle una imagen de fondo, si es queremos dejarlo un poco mas decorado, eso es según la plantilla y el gusto de cada uno.