Configuración:
.
Biología
.
Botánica
.
Tecnología
.
Sociedad
A mis trece años de edad, el día 2 de Diciembre de 2007 inicié ‘El Balcón de Jame’. Este humilde espacio, cuyo secreto siempre fue el de compartir sin recibir nada a cambio, me dio la oportunidad de conocer un mundo nuevo, un entorno en el que me sentía yo mismo.

Hoy, 17 de abril de 2011 finalizo esta etapa de mi vida con una gran sonrisa y junto al recuerdo que este blog y cada unos de vosotros me habéis concedido.

He sido bloggero.

Jaime Trujillo Escobedo.

Leer más o Seguir leyendo automático con imágenes en miniatura en blogger

Con anterioridad vimos cómo tener el Leer más con imágenes en miniatura en la portada del blog, que hace que todas las entradas muestren un resumen de forma automática y la imagen en miniatura que tenemos en el artículo.

Este método hace uso de un script que funciona muy bien aunque muchos han preguntado si es posible mostrar la misma configuración pero descartando el javascript.

Ahora bien, además de poderse hacer, resultará aconsejable para todos los que deseen un blog que cargue el contenido con rapidez puesto que haremos uso de las propias etiquetas que blogger utiliza en el truco 'Seguir leyendo'.




Diseño>Edición de HTML>expandimos artilugios



Busca la etiqueta <data:post.body/> y elimínala para incluir esto en su lugar:
<b:if cond='data:blog.pageType == "item"'><data:post.body/><b:else/>
<b:if cond='data:blog.pageType == "static_page"'><data:post.body/><b:else/>
<b:if cond='data:post.hasJumpLink'><data:post.body/><b:else/>
<b:if cond='data:post.snippet'><b:if cond='data:post.thumbnailUrl'><div class='bljjteImgn'><img expr:src='data:post.thumbnailUrl'/></div></b:if> <data:post.snippet/><div class='blLeerjtems'><a expr:href='data:post.url + "#more"' expr:title='data:post.title'>Leer post completo...</a></div>
<b:else/><data:post.body/></b:if></b:if></b:if></b:if>

Puedes personalizar la frase que llevará el enlace editando el texto en color verde.

Ahora localiza la etiqueta </head> y justo antes añade esta línea:
<link href='https://sites.google.com/site/scriptsbalcon/b/bljLeermsjte.css' rel='stylesheet' type='text/css'/>

Haz vista previa para comprobar el resultado y guarda la plantilla para terminar.

Notas:
- Si en la entrada en lugar de texto hay una imagen o un vídeo, el resumen no se activará, por lo que el elemento aparecerá con su tamaño real. En cuanto se incluya un simple caracter o se introduzca más de una imagen en el cuerpo del post, podremos ver el enlace 'Leer post completo...'.

- ¿En tu entrada hay una imagen y no aparece su miniatura en el resumen del post? Debes saber que las imágenes sólo aparecerán si las subes utilizando el editor de blogger.


Referencia: Blogger Buster

Laube dice...

Me interesa mucho!!!!! No estoy segura que quede bien en mi blog, pero buscaba este truqui en la plantilla desde hace tiempo.
Gracias Jaime... Como no, siempre con entradas super interesantes.
Un besote

Jaime Trujillo Escobedo dice...

Laube, pienso que ¡Sano y de rechupete! agradecería mucho una configuración así. Tu blog muestra muchas fotografías y aunque conviene que el número de artículos en la portada sea alto, podría afectar a la carga del contenido.

Aplicando un truco como este y sin hacer uso de javascript acelerarás la navegación y tendrás la posibilidad de mostrar más posts en la página principal.

La elección es tuya. Abrazos.

Laube dice...

Jaime, valoraré mucho tu opinión, que sabes más que yo un buen rato. Voy a hacer pruebas y a ver cómo va resultando.
Muchas gracias guapetón.
Un besote

Jaime Trujillo Escobedo dice...

Ya me contarás Laube. Gracias por tu comentario.
Abrazos

Laube dice...

Jaimeeeeeeeeeeeeeeee... Ya me animé a implementar este truco!!!!
Creo que me ha quedado bastante bien y aprecio que realmente carga más rápidamente.
Una preguntita... Para cambiar el botoncito de Leer post completo, qué debo hacer?. Es que me gustaría algo más pequeñito y coqueto. Me recomiendas algo?.
Ahora ya sólo me queda atreverme con lo de las pestañas bajo el título del blog.
Un besote guapetón y muchas gracias por tu ayuda

Jaime Trujillo Escobedo dice...

¡Qué buena noticia Laube! La fluidez con la que actualmente carga el contenido del blog es impresionante.

Para modificar el botoncillo localiza la etiqueta ]]></b:skin> y añade justo antes lo siguiente:

.blLeerjtems {
font-size: 13px;
margin-top: 12px;
padding: 3px 6px;
width: 134px;
word-spacing: 0;}

La segunda línea te permitirá modificar el tamaño del texto (13) mientras que la tercera el márgen superior que separa el resumen del botón. En width: 134px; podrás personalizar el ancho y en padding: 3px 6px; la distancia entre el marco del botón y el texto.

Desde que necesites algo más avísame. Abrazos amiga.

Laube dice...

Jaime, una cosita... Es posible que este truco funcione con un poquito más de texto y que la fotografía sea más grande, no tan miniatura?. Te paso un blog para que veas a lo que me refiero...
http://hierbasyespecias-mai.blogspot.com/
Graciassssssssssss

Jaime Trujillo Escobedo dice...

Laube, ampliar el resumen no es posible si haces uso de este truco. En breve publicaré una entrada en la que se presenta, de forma general, el mismo truco y su personalización (utilizando un script).

Laube dice...

Jaime, finalmente no me ha terminado de "molar" cómo ha quedado en mi blog; más que nada porque las fotografías son importantes y, la verdad, en las miniaturas casi ni se aprecian.
Sería mucho problema volver atrás????. Ayyyy, qué latosa soy!.
Un besote

Jaime Trujillo Escobedo dice...

Laube, al responderte en el comentario anterior no imaginé que justo el siguiente sería el que precisamente cité en mi comentario :P.

Llevas razón dado que a pesar de la velocidad de carga, tus fotografías atraen a los lectores y ayudan a identificar cada entrada.

Aunque este truco no lo permite, hay otros que lo hacen por lo que el tamaño de la miniatura podrá modificarse si te decides a instalarlo nuevamente.

Para 'volver atrás', o bien haces uso de la copia de seguridad de tu plantilla que realizaste antes de iniciar el truco o bien sigues los pasos 'al revés', es decir, localizando el bloque de código a insertar y reemplazándolo por la etiqueta a localizar (el script será fácil localizarlo pues tienes como referencia la etiqueta </head>. Abrazote

Francmi08 dice...

Una pregunta urgente, ya que estoy en ello y quería saber si antes de poner este truco hay que deshacer o quitar el de LEER MAS... que tengo puesto.Muchas gracias.

Jaime Trujillo Escobedo dice...

Eso me temo, Francmi08. No pueden combinarse trucos como el que se explica en esta entrada dado que ambos utilizan un script distinto o condicionales idénticas.

Escribe tu comentario en la entrada...

El Balcón de Jaime fue terminado el 17 de abril de 2011. Leer despedida.

Me gustaría conocer tu opinión. El comentario será moderado y en breve se publicará.

Si deseas incluir un enlace utiliza este código:

<a href="Dirección de tu página">Titulo del enlace</a>

Para publicar un código haz uso del Conversor de entidades.

Intenta escribir sobre algo relacionado con el artículo. Si no lo haces, podría tardar en responderte.

¿Problemas al comentar? Utiliza el formulario antiguo