El truco del «Sigue leyendo» en Blogger

El truco del Sigue leyendo en Blogger es tan simple como eso. A petición de varios que lo han solicitado va este post que espero te sea de mucha utilidad. La verdad es que hay post muy interesantes pero que se vuelven una lata cuando se muestran en una sola página y hay que estar bajando eternamente para llegar al siguiente…

Con este truco puedes escoger mostrar la cantidad de texto que quieras en la página principal. Asi muestras un fragmento o excerpt del principio de tu post como un adelanto de lo que viene. De esta forma, los que quieran leer el resto podrán hacer click para ver el post completo.

¿Te gusta? Entonces, ¡manos a la obra!

El truco del «Sigue leyendo» en Blogger

Vamos paso a paso y te recomiendo guardar tu template o plantilla actual en un archivo Word o Google Docs antes de empezar, por si colocas un paréntesis o un tag de más o de menos.

El truco del "Sigue leyendo" en Blogger

PASO 1:

Lo primero que tienes que ver es si tienes habilitadas las post pages para que esto funcione. ¿Cómo saberlo? Entra a SETTING, luego ARCHIVING y donde dice «Enable Post pages» debes poner «Yes».

Guarda los cambios y re-publica.

PASO 2:

Agrega el siguiente código después de la etiqueta style (está casi al comienzo del template o plantilla):

El truco del "Sigue leyendo" en Blogger

PASO 3:

Agrega el siguiente código a tu template o plantilla después de la etiqueta (blogitembody):

El truco del "Sigue leyendo" en Blogger

OJO: el «Read more!» lo puedes reemplazar por lo que tu quieras. Yo puse en mi página sigue leyendo, tú puedes poner Leer Más, o Más o quizás algo más original…

Ahora de nuevo guarda los cambios y re-publica.

un post interesante

PASO 4:

Sí, paso 4, no hemos terminado aun pero ya falta poco. La última patita de este asunto consiste en lo siguiente. Necesitas un código en cada post que quieras que tenga este sistema. Para todos es el mismo y va en el post template:

Cuando tus visitantes lean el post se verá algo como esto:

sigue leyendo

Cuando hagan click se irán a una post page donde podrán ver el texto completo!

PASO 5:

Ahora el «sigue leyendo» aparecerá en todos los post. Para evitar eso copien el código que doy en el post: SIGUE LEYENDO PARTE II.

¡Y ESO ES TODO! Lo siento por lo largo del post pero el tema no era tan fácil y rápido como pueda parecer…
Espero que te sea útil. Si necesitas mas cosas, trucos, manuales, etc no dudes en pedírmelo en los comentarios.

El Truco del Sigue Leyendo (versión detallada), es la segunda parte de este post. En vista de que algunos habéis tenido dudas con este truquillo, procedo a explicarlo nuevamente incorporando el código que permite mostrar el SIGUE LEYENDO sólo cuando sea necesario.

Para los que no sabéis de qué se trata, os cuento que es una herramienta que permite sólo mostrar un resumen de lo escrito en un post en la página principal y colocar un link que permita ir a ver el post completo en una página independiente. ¿Cómo funciona? Haz click en SIGUE LEYENDO y lo verás.

El Truco del Sigue Leyendo (versión detallada)

Vamos paso a paso…

Postpages Blogger

PASO 1:

Lo primero que tienes que ver (igual como lo expliqué antes en el primer post sobre este truco) es si tienes habilitadas las post pages para que esto funcione.

¿Cómo saberlo? Entra a SETTING, luego ARCHIVING y donde dice «Enable Post pages» debes poner «Yes».

Guarda los cambios y re-publica.

PASO 2:

El Truco del Sigue Leyendo (versión detallada)

Luego lo primero es ir a tu plantilla. Esto es importante. Debes localizar el código de apertura del style. ¿Qué significa eso?? No desesperar. Los códigos HTML están formado por paréntesis donde se incluyen dentro de ellos los códigos. 

Por ejemplo, todo lo que define el estilo o diseño del blog (que tiene relación con los colores, el tipo de letra, tamaño, etc de tu blog) está dentro de las etiquetas o tags, como se suelen llamar, de estilo, que son algo como ésto:

Entre medias de ambas tags van una serie de códigos que definen el estilo del blog. Ahora, si te fijas, una es la palabra sola en medio de dos paréntesis y la otra es lo mismo pero con el agregado que tiene un / antes de la palabra. La primera es la tag de apertura y la segunda es la de cierre porque tiene el /.

Es importante que sepas estas cosas para cuando hablemos de la tag style de apertura o de cierre. Ahora bien, ya que entiendes un poco más de lo que hablamos, te invito a buscar en tu plantilla la tag de apertura style.

Casi siempre está al comienzo de la plantilla y va acompañada de otros códigos de esta manera:

Style Blogger

Después de esa tag debes pegar el primer código que encontrarás a continuación:

<MainOrArchivePage>
span.fullpost {display:none;}
</MainOrArchivePage>

<ItemPage>
span.fullpost {display:inline;}
</ItemPage>

Lo pegas para que quede de esta manera:

El truco del "Sigue leyendo" en Blogger

PASO 3:

¿Todo bien? Ahora debes bajar en tu plantilla, hasta llegar a la tag de cierre del style. Esto es antes de la tag de cierre de head:

segundo código

Aquí debes pegar el segundo código que encontrarás a continuación:

<script type="text/javascript">
var memory = 0;
var number = 0;
</script>

De forma que quede de esta manera:

segundo código pegadoPASO 4:

Luego debes bajar un poco más y encontrar la tag de Blog Item Body:

tercer código

Allí debes pegar el tercer código que encontrarás a continuación:

<MainOrArchivePage>
<script type="text/javascript">
spans = document.getElementsByTagName('span');
number = 0;
for(i=0; i < spans.length; i++){
var c = " " + spans[i].className + " ";
if (c.indexOf("fullpost") != -1) {
number++;
}
}
if(number != memory){
document.write('<a class="[tu class]" href="<$BlogItemPermalinkUrl
gt">[tu texto]</a><br>'); } memory = number; </script> </MainOrArchivePage>

De forma que quede de esta manera:

tercer código pegado

PASO 5:

Lo último que aquí falta antes de GUARDAR y RE-PUBLICAR es cambiar el texto (your text) por el que tu quieras poner (en mi caso SIGUE LEYENDO):

cambiar palabras

PASO 6:

Pero esto no es todo. Seguramente habrá posts que no requerirán utilizar este recurso. Por ello cada vez que quieras recortar el post en un resumen en la página principal debes hacer lo siguiente:

Necesitas un código en cada post que quieras que tenga este sistema. Para todos es el mismo y va en el post template:

un post interesante

Cuando tus visitantes lean el post se verá algo como esto:

sigue leyendo

Cuando hagan click se irán a una post page donde podrán ver el texto completo!

Y eso es todo. Espero que ahora sí no tengas problemas, ¡¡¡Mucha suerte!!!!! Espero que te sea útil. Si necesitas mas cosas, trucos, manuales, etc no dudes en pedírmelo en los comentarios.