Para realizarlo comenzaremos a ver la parte de HTML que Serra necesario agregar a nuestra plantilla usando los condicionantes anteriormente mencionados.

En la plantilla minima la parte que nos interesa principalmente es

<b:includable id='post' var='post'>
<div class='post hentry uncustomized-post-template'>

...

<a expr:href='data:post.location.mapsUrl' target='_blank'><data:post.location.name/></a>
</b:if>
</b:if>
</span>
</div>
</div>
</div>
</b:includable>

Aquí vamos a insertar los condicionantes indicándole si no estamos en una pagina individual de entradas como queremos que se vean, el resto del código lo dejaremos igual pero insertaremos el condicionante indicando que estamos en una pagina individual de entradas.

Entre <b:includable id='post' var='post'> y <div class='post hentry uncustomized-post-template'> pegamos

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div class='home-post' id='post-20'>
<div class='upper'>
<div class='fade'/>
<b:if cond='data:post.title'>
<h3>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</h3>
</b:if>
<b:if cond='data:top.showTimestamp'>
<b:if cond='data:post.url'>
<span class='meta'><data:post.timestamp/></span>
</b:if>
</b:if>
<div class='intro-post'>
<data:post.body/>
</div>
</div>
<span class='btn-readon'><a expr:href='data:post.url' rel='bookmark'>Read On</a></span>

<span class='lower-meta'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
</b:if>
</b:if>
</span>
</div>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>


Necesitamos cerrar el segundo condicionante insertado (<b:if cond='data:blog.pageType == &quot;item&quot;'>), para ello buscamos el final del primer código mostrado

...

<a expr:href='data:post.location.mapsUrl' target='_blank'><data:post.location.name/></a>
</b:if>
</b:if>
</span>
</div>
</div>
</div>
</b:includable>

y justo antes de </b:includable> insertamos el cierre </b:if>, quedaría

...

<a expr:href='data:post.location.mapsUrl' target='_blank'><data:post.location.name/></a>
</b:if>
</b:if>
</span>
</div>
</div>
</div>
</b:if>
</b:includable>

Por ultimo buscamos <!-- posts --> y a continuación ponemos

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div id='recent-posts'>
<data:adStart/>
<b:loop values='data:posts' var='post'>
<b:include data='post' name='post'/>
</b:loop>
<data:adEnd/>
<div style='clear:both;'/>
</div>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>

Como de nuevo hemos repetido la operación de insertar los condicionantes, nos queda cerrar el segundo de ellos, para ello buscamos <!-- navigation --> y justo antes ponemos

</b:if>

Con esto tendremos listo la parte de HTML y solo nos quedara darle forma en nuestro CSS.

Te interesa

► Post Resumidos
► Post Resumidos 3
► Post Resumidos 4
► Post Resumidos 5
Autor: . Consultor y auditor en posicionamiento web. Desarrollo de aplicaciones, diseño y programacion de plataformas y paginas web. Formación, profesor en el Programa SmmUs (Social Media Marketing) de la Universidad de Sevilla. Cursos sobre social media en Cámaras de Comercio de Málaga, Sevilla y Córdoba. Puedes encontrarme en Google Plus y Twitter .

¿Te gustó este post? No te pierdas los próximos, síguenos en redes sociales.

Te recomendamos también

31 comentarios:

  1. Excelente tutorial, voy a provar a ver que me sale...

    Saludos!

    ResponderEliminar
  2. HOLA ANTONY!!!...todos trabajando con las consignas de nuestro Pizcos...tendré que hacer lo mismo en un blog de pruebas!!! voiláaaaaa

    ResponderEliminar
  3. Esperaros al css que sino no sirve ☺☺☺

    ResponderEliminar
  4. Esto parece complicado, pero solo pierdo algunos dedos y vista en un blog de pruebas que me hago desde ya!!!.

    Saludines!.

    ResponderEliminar
  5. Bueno esperaremos el CSS, bendito CSS que sin no sirve nada...
    Hola Graciela!
    Saludos!

    ResponderEliminar
  6. N0O funciona.....
    cabo comentar que muy diseño y el estilo que le adaptaste...
    que dariamos por que tus plantillas estuvieran en btemplates para disfrutar de su descarga.... jeje
    siempre me impresionas
    ojala algun dia pudiera acer mi propia plantilla...
    ami gusto... asi como tu.... yeah
    seria estupendo

    ResponderEliminar
  7. y una pregunta abierta........
    con que programa crea las imagenes de sus blogs?..
    como antes dije soy novato y poco a poco voy aprendiendo..... auque tengo mis dudas...
    las plantilla que yo tengo es descargada y modificada a mi gusto.......
    pero quisiera aprender a crear una...
    1. no se hacer imagenes ni como se acomodan en la plantilla..
    2. no se mucho de html.... osea como se forma una plantilla desde principio a fin
    jeje
    espero aprender muy pronto... lo que e logrado en mi blog a sido de tutoriales de blogs de ayuda y de eso e aprendido... lo mas simple y basico

    ResponderEliminar
  8. lo unico que es de mipropia creacion es el codigo complementado del favicon

    http://jorgekey.blogspot.com/2008/11/aadir-favicon-en-blogger.html

    el cual confunde al lector html de los navegadores
    aciendo visible cualquier formato de imagen en cualquer navegador ...
    por ello digo soy solo u8n simple aprendis

    ResponderEliminar
  9. yo uso macromedia fireworks mx 2004
    para las imagenes navideñas resultantes en mi blog....pero cual es mejor o mas recomendable

    unos usan gimp

    otros photoshot

    saqueme de este enblrollo...
    y ayudeme a aprender un poquillo mas jeje
    saludillos a todos en especial al super pizcos

    ResponderEliminar
  10. Esto q has puesto debe de ser genial, pero hasta q no averigue lo que es un post, no poder usarlo. De todas formas lo guardo.

    ResponderEliminar
  11. Jrge y Yessi hasta que no ponga el css no puede funcionar, con r4specto a las imagenes yo uso Gimp ☺☺☺

    ResponderEliminar
  12. Jorge y Jesi, aprenderán a crear su propia plantilla...no hay nada que lo impida, solo hace falta paciencia y tiempo...es así PIPI???
    He puesto una cabecera que no puedo creer lo bella que ha quedado...espero que haya conseguido levantar el 7 jajaja...besizcos y gran día!!!

    ResponderEliminar
  13. Piscoz no encuentro el codigo de la tercer cuadro en la plantilla minima lefty

    <.........a expr:href='data:post.location.mapsUrl' target='_blank'...........>

    ResponderEliminar
  14. STBAN busca esto

    <div class='post-footer-line post-footer-line-3'>

    </div>
    </div>
    </div>
    </b:if>
    </b:includable>

    ResponderEliminar
  15. no pizcos me da muchos errores primero dice que falta por errar div y luego el b:if :s

    ResponderEliminar
  16. Bear imaginario...! ??? me he perdido..

    ResponderEliminar
  17. pizcos un honor saludarte, he implementado los post resumidos, pero he querido hacerle un ligero cambio es decir lo que quiero hacer es que estos solo aparescan en las paginas de etiquetas y no en el home, pero he tenido varios inconvenientes, traté con los codigos condicionales y nada (las entradas desaparecen del home y del item).....

    este es mi blog http://sanisidroflows.blogspot.com

    si es factible te das una vuelta por el blog, a ver que me puedes recomendar...

    muchas gracias por todo,hasta pronto.

    ResponderEliminar
  18. Hola Nudians Music lee esta entrada que te ayudara a entender el uso de condicionales.

    Ten en cuenta una cosa en el codigo que expongo solo indico la diferencia entre pagina individual y las demas, con el cambio que quieres deberas indicar que mostrar en la pagina principal tambien sino te seguira pasando lo de no ver las entradas... ☺☺☺

    ResponderEliminar
  19. anidé las condiciones:

    b:if cond='data:blog.pageType != "item"' b:if cond='data:blog.url != data:blog.homepageUrl'.../b:if /b:if

    es decir donde encontre la condicion para "item" anidé a "homepage".... pero seguire tratando, gracias.

    ResponderEliminar
  20. Excelente post.. pero tengo problemas yo uso la plantilla Minima Black 3 colummnas...

    cuando dices que hay que cerrar con un b:if antes del b:includable

    no encuentro este codigo.. como se llamara en mi plantilla?

    Saludos!! ^^ disculpa las molestias

    ResponderEliminar
  21. Eligor a que codigo te refieres???

    ResponderEliminar
  22. en donde sale el tercer cuadro blanco... donde hay que cerrar con el b:if

    ResponderEliminar
  23. ..Olvidad lo que dije anteriormente por que ya lo arregle.. me gustaria eso si que me dijieras como lo hago para que se vean 3 entradas y no dos... este es mi blog de borrador.. para que lo veas
    http://rastrosdemusica.blogspot.com/

    ResponderEliminar
  24. Eligor en la pagina de añadir elementos en Entrdas...editalo y ahi puedes aumentar el numero de entradas que se ven...

    ResponderEliminar
  25. jeje.. lo se pero no me entendiste... mira me referia a lo largo..por ejemplo solo se ven dos a lo largo y yo quiero que se vean 3..
    aqui va una captura..aver si me entendes ahora jeje ^^ http://i49.tinypic.com/w84183.jpg

    Saludos!! y muchas gracias

    ResponderEliminar
  26. Para eso tendrias que ajustar el CSS, leete el numero 3 de estas entradas... pero te queda poco espacio para eso...

    ResponderEliminar
  27. u.u una lastima, pero a tu punto de vista que partes exsactamente tendria que modificar? para que caigan las 3 a lo largo?

    ResponderEliminar
  28. Si miras la entrada que te he dicho, esta detallado que es cada cosa, debes modificar el alto y el ancho de las entradas...

    ResponderEliminar
  29. ..pues modifique el ancho y ahora si se ven 3 entradas a lo ancho pero se oculto la cantidad de comentarios ? por que? :S .. veelo tu mismo (http://rastrosdemusica.blogspot.com/) ^^

    Saludos y muchas gracias

    ResponderEliminar
  30. POrque al reducir el ancho y mantener el tamaño de las letras ya no entran, disminuye el tamaño de las letras sobre todo el leer mas...

    ResponderEliminar
  31. Ok.. Muchas Gracias, jeje esta ultima pregunta como agrando de mas la entrada..osea para que sean mas altas por que cuando le doy mas height en vez de que sea mas alta, se separan las entradas? :S te dejare la captura del vista previa con un height de 300px
    http://i45.tinypic.com/330v7ty.jpg

    saludos...de ante mano muchas gracias

    ResponderEliminar