martes, 10 de marzo de 2009

LEER MAS

Es una de las opciones que podéis añadirle a vuestro blog, es recomendable cuando se hacen entradas muy extensas ya que ocupan gran parte de la página principal y no deja que se vean mas entradas, es algo como esto:

Como observamos si el lector está interesado en continuar leyendo la entrada podrá hacerlo accediendo al enlace Leer mas...
Para ponerlo en vuestro blog, partimos de que no todas las plantillas son iguales pero en general todas se parecen por tanto tendremos que tener eso en cuenta a la hora de localizar partes de código.

Primer Paso:


Dirigirnos a Diseño->Edicion de HTML y aquí selecionamos la casilla expandir plantillas de artilugios.
Una vez aquí localizar </head>, una vez aquí pegar el siguiente código justamente encima.

<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<b:else/>
<style>.fullpost{display:none;}</style>
<script type='text/javascript'>
function checkFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
var found = 0;
for (var i = 0; i < spans.length; i++) {
if (spans[i].className == 'fullpost') {
spans[i].style.display = 'none';
found = 1;}
if (spans[i].className == 'showlink') {
if (found == 0) {
spans[i].style.display = 'none';
}}}}</script>
</b:if>
Segundo Paso:

Tendremos que localizar en el código de la plantilla una parte similar o igual a la siguiente:

<div class='post-body'>
<p><data:post.body/></p>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
Como digo no tiene que ser exactamente igual, podéis utilizar ctr+f para localizar partes de código.

Tercer Paso:

Tendremos que cambiar el bloque anteriormente localizado por el siguiente:
<div class='post-body' expr:id='"post-" + data:post.id'>
<p><data:post.body/></p>
<b:if cond='data:blog.pageType != "item"'>
<span class='showlink'>
<p><a expr:href='data:post.url'>Leer más...</a></p>
</span>
<script type='text/javascript'>
checkFull("post-<data:post.id/>");
</script>
</b:if>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
Legado a este punto ya tenemos todo lo necesario para crear entradas y ampliarlas mediante el Leer mas

Cuarto Paso:(Como crear la entrada)

Tendremos que copiar el siguiente código en las entradas que queramos ampliar de la siguiente forma:

Parte de entrada a la vista
<span class="fullpost">
El resto de la entrada no se verá hasta hacer click en "Leer más"
</span>

5 Comentarios:

Refle dijo...

Yo me he perdido al segundo paso...
Es que a mi no me sale tu codigo y tampoco nada parecido...
Alguna sugerencia?

caxitos dijo...

Refle ¿Marcaste el checkbox que dice Expandir plantillas de artilugios? Si no lo marcas no podrás observar todo el código de tu plantilla.

Refle dijo...

Ok gracias por tu ayuda. No te lo dije el otro dia, pero felicidades por tu blog. Me es de gran utilidad y de mucha ayuda.

Pero ahora tengo oto problema, cuando pongo el primer texto que va encima de /head me sale este error

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 content of elements must consist of well-formed character data or markup.

Y no encuentro ninguna solución, sabes a que se debe?
Muchísimas gracias.

Programa de Biologia dijo...

Hola.

Yo hago todo lo que explicas, pero me sale el mismo error que el compañero

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 content of elements must consist of well-formed character data or markup.

Agradeceria que nos explicaras que debemos corregir.

Gracias.

Publicar un comentario en la entrada

Haga su comentario

Bienvenido al Rincon del Blog
Tus comentarios nos ayudan a mejorar
Muchas Gracias por Comentar.