12 de enero de 2009

Acortar entradas o post con "Leer más", "Seguir leyendo" o "Read more"


Como soy novata en ésto de los blogs, no sabía cómo hacer para que mis entradas o posts no fueran excesivamente grandes a “primera vista”.
Busqué y busqué por la red algún truco que me permitiera usar Leer más o “Seguir leyendo” para agilizar la vista de mi blog de cara al visitante, pero por más que intentaba las sugerencias de diferentes páginas, no me funcionaban. Además, una vez hechos los cambios, a la hora de editar una entrada o post, había que hacerlo dentro de unos códigos para que sólo se viera una parte del mensaje y el resto quedara oculto. Algo lioso para una novel como yo.
En otro blog encontré que era posible que las entradas se recortaran al llegar a un número de caracteres en concreto, pero no me funcionó, aunque a partir de entonces mis búsquedas se centraron en este tipo de truco. Y entonces fue cuando encontré el que les muestro ahora. Es muy sencillo de hacer y “definitivo”, de manera que no hay que estar pendiente de ir colocando nada entre códigos. Es más, recorta el texto pero deja visible la imagen que hayas puesto en tu entrada o post, de forma no pierdes la estética que le diste.

Vamos allá:

1) Entra en tu blog y vete a Diseño y luego a Edición de HTLM. Siempre es conveniente que antes de modificar tu plantilla hagas una copia de seguridad de la misma.
2) Ahora, marca “Expandir plantilla de artilugios”.
3) Seguidamente busca dentro de la plantilla el siguiente código <data:post.body/> y reemplázalo por:

<div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary");</script><span class='rmlink' style='float:right'><a expr:href='data:post.url'>--> Read more...</a></span>
</b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>


Nota: si quieres que te aparezca un texto distinto a “Read more” sustitúyelo en el código anterior por lo que prefieras: Leer más, Seguir leyendo, Ver el resto de post, etc.

4) Ahora, añade el siguiente código en el HEAD de tu plantilla (es decir, entre ( </head> .... </head>) . Personalmente, lo añadí justo antes de </head> y me funciona:
<script type='text/javascript'>
summary_noimg = 430;
summary_img = 340;
img_thumb_height = 100;
img_thumb_width = 120;
</script>
<script src='http://vietwebguide2.googlepages.com/summary-post-v20-test.js' type='text/javascript'/>

Nota: Estos códigos muestran lo siguiente:
summary_noimg: el número de letras que se mostrarán de tu post si no tienes una imagen asociada.
summary_img: el número de letras que se mostrarán de tu post si tienes una imagen asociada.
img_thumb_height: la altura que se mostrará de la imagen que tienes en el post.
img_thumb_width: la anchura que se mostrará de la imagen que tienes en el post.
5) Haz clic en Vista Previa y si el resultado es el esperado, guarda los cambios.Aquí está la página de donde saqué este truco: http://easyadsensevn.blogspot.com/2008/09/how-to-add-blogger-read-more-expandable_05.html


28 comentarios:

Anónimo dijo...

Joerrr Mary, está hecha una informática. Acabarás dándome clases :-)

Luis

Mariano Lozano dijo...

Prueba a editar con el Windows Live Writer. Es un editor de textos para blogs y a mí me va bastante bien. No sé si lo conoces, pero está muy extendido.
Funciona con prácticamente cualquier entorno de blogs, por supuesto con bloger, wordpress, etc.

Este código del que hablas lo introduces de un modo muy sencillo con una opción llamada "more". Te explico: editas el texto normal, y lo vas viendo tal y como te va a quedar finalmente. Cuando decidas que ese punto y final va a ser el último que quieres que se vea en el post, haces clic en el comando "more" y te introduce una especie de "salto de página". Tú sigues escribiendo hasta que termines y cuando lo publiques, verás que sólo se ve el post hasta donde introdujiste el comando famoso, al igual que tienes ahora.
Jo, para ser mi primer comentario en tu blog, cómo me enrollo :-)

El WLW lo tienes por aquí:
http://download.live.com/writer

Tranquila que no tiene virus, ni cosas raras. Es el link oficial de Microsoft.

Besos

María Hernández dijo...

Gracias, Mariano.

Como soy un poco curiosa, miraré esta opción de la que me hablas. Te lo agradezco mucho.
Y no me importa para nada que te "enrolles" en tu primer post...espero que no sea el último.
Leo tu blog a menudo, aunque no porque tenga en mente emigrar a EEUU, sino por saber cómo se las arreglan por ahí. De hecho, te tengo enlazado en mi blog.
Un saludo desde el otro lado de charco.

dexter dijo...

a mi no me funciona, no se porque? me aparecen dos data:post.body he reemplazado uno y si reemplazo el otro no se ve el blog, aunque si me aparece leer mas... pero al final del post completo, te dejo el enlace y lo ves.

http://meganort.blogspot.com

dexter dijo...

que pronto contestastes, gracias , vere como lo arreglo
saludos y gracias de nuevo.

Emiliano Arévalo dijo...

Hola!!

Antetodo muy buen post!
Intente hacerlo con mi blog pero no hay caso no se me ve solo una parte se siuge viendo todo el post. Me gustaria que te contactes con migo por e-mail y me ayudaras.

Mi e-mail es super-coches@hotmail.es
Un saludo

Emiliano

Waldo Daniel Freire Reyes dijo...

no me funciono sale leer mas pero al final del post como lo hago para que me salga donde yo quiero???

Seagirl dijo...

Muchísisisisimas gracias!!!

No sabía que hacer ya para conseguir lo que quería y gracias a tu post, lo conseguí!!!

Intenté mil formas enrevesadas y ninguna funcionaba y esta, la más simple, funciona y, encima, no hay que ir añadiendo un código a cada una de las entradas.

Lo dicho. ¡Mil gracias!

María Hernández dijo...

De nada , Seagirl. Me alegra saber que este "truco" te ha funcionado y gustado.

Un saludo

Unknown dijo...

Hola, disculpa mi himnorancia, pero fijate que estoy teniendo problemas para instalar este codigo, mi primer proble obio, es que no aparece el primer codigo que tengo que buscar, y desde ese punto ya no puedo continuar, por que no puedo reemplazar algo que no existe, te pido ayuda porfavor. Este es mi blog, para que lo mires, y puedas tener una idea mas presisa:
http://k-trachos-cool.blogspot.com/

María Hernández dijo...

Hola Virus Infernal:

Es muy posible que no llegues a ver el primer código porque no hayas expandido los artilugios de la plantilla.

Vete a Edición HTLM y busca la casilla donde se indica "Expandir plantilla de artilugios". Apenas es una casillita que tienes que marcar.

Espero que ésto sea suficiente para que lo "encuentres", si no fuera así, indícame tu email y te enviaré algo más específico.

Un saludo.

Unknown dijo...
Este comentario ha sido eliminado por el autor.
Unknown dijo...
Este comentario ha sido eliminado por el autor.
Unknown dijo...

Hola Maria, agradesco tu ayuda, y te pido disculpas por el problema que presentaba mi blog, bueno, si lo visitaste te diste cuenta. Ahora ya está todo arreglado, el truco de seguir leyendo es muy sensillo, te lo explico en este link, es parte de mi blog, le hice un cambio radical.

http://ktrachoss.blogspot.com/2009/12/truco-de-leer-mas.html


Y ademas de eso, te proporciono esta informacion por si no la sabias, es muy util, y serviria mucho a tu web.


http://ktrachoss.blogspot.com/2009/12/anadir-el-formulario-de-comentarios-en.html


Y ya que entres a estos link, por que no te suscribes, ¿si? Pofa.

Besos

Anónimo dijo...

por mas que busque en la plantilla no encuentro la parte

Anónimo dijo...

mira este es mi blogger miralo porfa y dime que puedo hacer
www.peins0242.tk

www.peins0242.tk

mi correo es peinso242@live.com

Unknown dijo...

Hola peins, soy Virus Infernal, es un placer ayudarte en este caso, si visitas mi blog veras que ese problema está solucionado... ¿Como?
Pues para ver como es visita este link:

http://ktrachoss.blogspot.com/2009/12/truco-de-leer-mas.html

Y tu blog está muy bueno, te felicito. Salu2

-----------------------------------
La clave del éxito es no darse por vencido.

María Hernández dijo...

Hola Virus Infernal:

Gracias por contestarle a Peins a traves del blog.
Justamente, le envié un email con el enlace al post tuyo que referencias, porque al ver el código fuente de su página, efectivamente, yo tampoco encuentro el código que cito.
Creo que con la ayuda que publicaste puede resolver el problema.

Gracias, nuevamente.

Unknown dijo...

Es un placer ayudar María, si te das cuenta tu blog está entre mis favoritos. Saludos

José Nery dijo...

Te amoo!! gracias por estoo! me ha servido de mucho ^^
jojoj xD
Ciao!!

miki dijo...

hola header es lo mismo que head? por que si no es lo mismo no encuentro la letra head en mi plantilla html, solo hay header

María Hernández dijo...

Hola Miki:

Es head, no header, pero no olvides "expandir artilugios" antes de buscar el código.

Un saludo.

José Antonio Hinojos dijo...

hola he estado intentandolo toda la tarde y me dice:
No se ha podido analizar su plantilla, porque no está bien formada. Asegúrese de que todos los elementos XML se han cerrado correctamente.
Mensaje de error de XML: The element type "div" must be terminated by the matching end-tag "
estoy mareado y no he conseguido nada que puedo hacer?

Unknown dijo...

Hola Maria aqui me tienes una vez mas, espero no te moleste lo unico que quiero es ayudar.

El link que mostraba antes ya no funciona por que cambie el nombre de mi blog, se llamaba Ktrachoss con doble ese pero eso no tiene sentido ahora es ktrachos

el link para ayudar es este:
http://ktrachos.blogspot.com/2009/12/truco-de-leer-mas.html

María Hernández dijo...

Hola Brayan:

Gracias por informarnos del cambio de página.

Aprovecho para desearte que pases unas felices fiestas en compañía de los tuyos.

Un beso, Brayan.

DaSh dijo...

Esta bien, perono respeta el formato de la entrada, yo tenia otro codigo donde podias elegir lo que querias que saliera y lo que no, pero lo perdi, en fin, muchas gracias por la info.

Unknown dijo...

Pues a mi no me ha funcionado.
Me sale este error:
"The element type "div" must be terminated by the matching end-tag ""
y no me deja guardar los cambios de html.

María Hernández dijo...

Hola Peyas...¿me podrías indicar algún email donde pueda enviarte la información?.
Un saludo,

Related Posts with Thumbnails