"Leer más desplegable" sin tener que volver a cargar la página


Con este truco podrás esconder el texto a lo "leer más" de las entradas que tú elijas que consideres que sean muy extensas sin tener que volver a cargar la página. Diciéndolo de otro modo, será como un menú desplegable que se abre cuando haces clic sobre él.

Para conseguir este efecto hay que seguir los siguientes pasos:

1) Vamos a Diseño
2) Edición HTML
3) Marcamos la opción "expandir artilugios".
4) Buscamos </head> (tecleamos Ctrl + F para buscar más rápido)
5) Pegamos antes de </head>



<script src='http://pmsc.free.fr/J01/0981905650.js' type='text/javascript'/>


Nota: el archivo .js necesario lo he alojado yo en un servidor público. Si falla alguna vez comunicadlo y lo vuelvo a subir.


6) Ahora buscamos este código: <b:includable id='post' var='post'>
7) Nos fijamos que está acompañado de la siguiente parte de código:


<b:includable id='post' var='post'>
<div class='post uncustomized-post-template'
<a expr:name='data:post.id'/>
<b:if cond='data:post.title'>
<h3 class='post-title'>
<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>
<div class='post-header-line-1'/>
<div class='post-body'>
<p><data:post.body/></p>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>



8) Lo borramos todo y en su lugar pegamos el siguiente código:


<b:includable id='post' var='post'>
<div class='post uncustomized-post-template' expr:id='"post-" + data:post.id'>
<a expr:name='data:post.id'/>
<b:if cond='data:post.title'>
<h3 class='post-title'>
<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>
<div class='post-header-line-1'/>
<div class='post-body'>
<b:if cond='data:blog.pageType == "item"'>
<p><data:post.body/></p>
<b:else/>
<style>#fullpost {display:none;}</style>
<p><data:post.body/></p>
<span id='showlink'>
<p><a href='javascript:void(0);' expr:onclick='"javascript:showFull("post-" + data:post.id + "");"'>Sigue leyendo... [+]</a></p>
</span>
<span id='hidelink' style='display:none'>
<p><a href='javascript:void(0);' expr:onclick='"javascript:hideFull("post-" + data:post.id + "");"'>Volver... [x]</a></p>
</span>
<script type='text/javascript'>
checkFull("post-" + "<data:post.id/>");
</script>
</b:if>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>

Nota: Sigue leyendo y Volver los puedes sustituir por una imagen sustituyéndolos por: <img src="url_de_tu_boton_o_imagen_"/>




9) Clicamos en vista previa y si está todo bien guardamos la plantilla.
10) Ahora vamos a Configuración --> Formato --> abajo del todo veremos que hay un recuadro que pone "plantilla de entrada". En ese recuadro pondremos el siguiente código y lo guardaremos:


Aquí va el texto que se verá al comienzo de la entrada
<span id="fullpost">
Texto escondido, el que aparecerá al hacer clic en seguir leyendo.
</span>



Gracias a gemablog:

24 comentarios:

  1. Hola!!

    He seguido todos los pasos que aqui expones pero despues al darle a vista previa me aparece la pagina en blanco sin ningun tipo de informacion salvo el sidebar de la derecha... he hecho algo mal??

    Saludos

    ResponderEliminar
  2. Hola Ana, bienvenida. Gracias por tu visita.

    Te recomiendo que tengas otro blog de pruebas antes de hacerlo con el "blog bueno". Comprueba de nuevo los pasos por si se te escapa algo, porque funcionar funciona. Si sigue sin funcionar contáctame a pie de página en el formulario de contacto y te echo una mano en lo que pueda.

    Un saludo.

    ResponderEliminar
  3. Aqui estaba el problema de carga lenta de mi web, le hice un test por Internet y me aparecio cual era el error exactamente, la cuestion es que el archivo lo alejo en mi servidor de ya.com y al enlazarlo en mi blog pues me iva demasiado lento, he eliminado el enlace y listo como al principio.

    Solo me falta solucionar el problema del buscador solo.

    Gracias

    ResponderEliminar
  4. Hola Ana. Es que era raro. Me alegro que ya lo hayas solucionado. ¿Buscador? ¿Te echo un cable con ello?

    Un saludo.

    ResponderEliminar
  5. Si, te lo agradeceria mucho... porque antes funcionaba perfectamente y ahora que lo pruebo no va bien.

    Gracias

    ResponderEliminar
  6. Ana, echa un vistazo a: http://www.quierocrearunblog.com/2009/07/anadir-un-buscador-tu-blog.html

    ResponderEliminar
  7. Ya lo he hecho y he incluido el codigo de Script que habia y ya puedes ver como ha quedado mi buscador... pero en cuanto a su funcion este no la cumple.

    Saludos

    ResponderEliminar
  8. Pues no se el motivo. El ejemplo de arriba en la entrada de http://www.quierocrearunblog.com/2009/07/anadir-un-buscador-tu-blog.html funciona correctamente (puedes hacer la prueba).

    Vuelve a insertar el codigo en tu blog. Haz la prueba a ver.

    ResponderEliminar
  9. Perdona lo he vuelto a hacer y nada, y me he dado cuenta de que el codigo que sustituyo en la etiqueta "b:includable id='post' var='post'" no son iguales del todo. Bueno aun asi he seguido todos los pasos y me da que cuando entro en la pagina me aparece en blanco y cuando le doy a alguna entrada ademas de no verse el famoso "leer mas" se duplican las entradas... NO SE QUE ES LO QUE PASA!!

    Saludos

    ResponderEliminar
  10. Hola Ana. Pues no sé el motivo. A mí me funciona correctamente y es copiando el código de arriba tal y siguiendo esos mismos pasos. Quiza sea debido al tipo de plantilla. Lamento no poder darte otra explicación, no sé qué puede ocurrir...

    ResponderEliminar
  11. Hola!

    (Espero me llegues a responder)

    Bueno pues eh seguido todo los pasos que dices, pero al darle vista previa, el resultado al ver el blog fue que no tenia, o no se mostraba, ninguna entrada, ningun post, aun asi le di en guardar pensando que solito se arreglaria, PERO NO!, esto siguio igual, me fui a formato puse lo que indicas y me luego cree una entrada muy extensa para probar el truco, pero pues al final el problema permanecia, FELIZMENTE lei la "platica" que tuviste con Ana y pues todo esto fue en mi blog de borrador...(Y)

    Pero aun asi quisiera saber que habre hecho mal!...

    Esperare tu repsuesta.

    Buen dia!!

    ResponderEliminar
  12. Hola!

    Denuevo yo, umm, e RELEIDO la "platica" con Ana y descubro que su problema era el mismo que tengo yo, el problema es que no llego a entender cual fue el error...

    Aver si me lo explicas porfa..

    Buenas Vacaciones!!1

    ResponderEliminar
  13. Hola µðn SC µØ. Muchas gracias por tus comentarios.

    Me temo que hay algunas plantillas que son incompatibles con este tipo de leer mas. No veo otra posible respuesta, me sabe mal.

    Te animo a que pruebes otros tipos de leer mas para tu blog:

    1) http://www.quierocrearunblog.com/2009/07/como-poner-leer-mas-y-una-imagen-en.html
    2) http://www.quierocrearunblog.com/2009/09/actualizacion-blogger-ahora-con-leer.html

    Un saludo.

    ResponderEliminar
  14. Buffffffffff... no sé que he echo. Al intentar poner esto, resulta que me salía bien. Lo he guardado. He vuelto a ver el blog y ¡oh sorpresa! no me salen las entradas. Necesito ayudaaa... Gracias de antemano

    ResponderEliminar
  15. Este comentario ha sido eliminado por el autor.

    ResponderEliminar
  16. Siempre hay que guardar una copia de seguridad de la plantilla antes de tocar los códigos HTML.

    Me temo que hay algunas plantillas que son incompatibles con este tipo de leer mas. No veo otra posible respuesta, me sabe mal.

    Te animo a que pruebes otros tipos de leer mas para tu blog:

    1) http://www.quierocrearunblog.com/2009/07/como-poner-leer-mas-y-una-imagen-en.html
    2) http://www.quierocrearunblog.com/2009/09/actualizacion-blogger-ahora-con-leer.html

    Te recomiendo que crees otro blog para realizar pruebas.

    Un saludo y disculpa las molestias

    ResponderEliminar
  17. Ah! Se me olvidaba. Prueba a volver a hacer los pasos pero lo contrario. Tendrás que cambiar el paso 8) por el 7).

    ResponderEliminar
  18. Gracias. al final he recuperado la vista de las entradas. No sé realmente que he echo. He vuelto a la plantilla original y ya está. Aunque ahora al elegir nueva plantilla, vuelven a desaparecer las entradas. Misterios de la informática. Si deberé hacer una copia de seguridad...

    ResponderEliminar
  19. Me alegro que hayas podido solucionarlo. El mundo HTML es complicado y muchas veces es muy complicado saber dónde está ese pequeño fallo que desmorona todo.

    Un saludo.

    ResponderEliminar
  20. Ya lo he solucionado todo. Ha habido un momento de caos, pero ya está. He recuperado la plantilla que tenía, las entradas todo. De verdad que el mundo HTML es complicado, pero gracias a personas como tú y a la paciencia, se puede llegar a hacer algo. Te has ganado el cielo, jaja.
    Pd. Ya no hace falta que me contestes al email que te he envíado. Pero no me cansaré de darte las gracias

    ResponderEliminar
  21. Hola de nuevo LiPooh. No te preocuopes que yo estoy para ayudar en lo que pueda y en lo que sepa. Muchas gracias a ti por tu visita y por estar en el mundo blogger.

    Un saludo!

    ResponderEliminar
  22. hola: ya tengo el LEER MAS que vino pr defecto en el template del blogpero no puedo ponerlo desplegable, cómo hago?
    mi blog: neobarroso.blogspot.com

    ResponderEliminar
  23. Hola! acabo de ver esta publicacion y es justo lo que estaba buscando!!
    pero no consigo que me quede bien... ya que hago todo como me dice pero se me borran todas las entradas de la principal...
    si me pudieras ayudar te lo agradeceria!un saludo y gracias... mi correo es alonso_riki@hotmail.com

    ResponderEliminar