Paso 1.- Ve a: Panel / diseño / Edición de HTML y respalda tu plantilla.
Paso 2.- Pega el siguiente código entre: <head> y </head> preferible al último:
<script type='text/JavaScript'>
//<![CDATA[
function toggleIt(id) {
post = document.getElementById(id);
if (post.style.display != 'none') {
post.style.display = 'none';
} else {
post.style.display = '';
}
}
function showFullPost(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
for (var i = 0; i < spans.length; i++) {
if (spans[i].id == "fullpost")
spans[i].style.display = 'inline';
if (spans[i].id == "readmore")
spans[i].style.display = 'none';
}
}
function showFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
for (var i = 0; i < spans.length; i++) {
if (spans[i].id == "fullpost")
spans[i].style.display = 'inline';
if (spans[i].id == "showlink")
spans[i].style.display = 'none';
if (spans[i].id == "hidelink")
spans[i].style.display = 'inline';
}
}
function hideFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
for (var i = 0; i < spans.length; i++) {
if (spans[i].id == "fullpost")
spans[i].style.display = 'none';
if (spans[i].id == "showlink")
spans[i].style.display = 'inline';
if (spans[i].id == "hidelink")
spans[i].style.display = 'none';
}
post.scrollIntoView(true);
}
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].id == "fullpost")
found = 1;
if ((spans[i].id == "showlink") && (found == 0))
spans[i].style.display = 'none';
}
}
//]]>
</script>
Paso 3.- Guarda la plantilla... luego regresa pero esta vez abre la plantilla de artilugios:
Paso 4.- Haz: control + f y pon este código:
<b:includable id='main' var='top'>
Paso 5.- Esta es la parte fea... reemplaza en tu plantilla solo lo que esta en rojo, el resto déjalo tal cual.
<b:includable id='PeekABooPost' var='post'>
<div class='post uncustomized-post-template'>
<table><tr>
<td width='40px'>
<a href='javascript:void(0)' title='Expand/collapse this post' style='text-decoration:none' expr:onclick='"javascript:toggleIt(\"" + data:post.id + "\");"'>[+/-]</a>
</td>
<td>
<h3 class='post-title'><a expr:href='data:post.url'><data:post.title/></a></h3>
</td>
</tr></table>
<div class='post-body' expr:id='data:post.id' style='display:none'>
<p><data:post.body/></p>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
</div>
</b:includable>
<b:includable id='main' var='top'>
<!-- posts -->
<div id='blog-posts'>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType != "item"'>
<b:include data='post' name='PeekABooPost'/>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:post.allowComments'>
<b:include data='post' name='comments'/>
</b:if>
</b:if>
</b:loop>
</div>
Una vez que logres reemplazarlo de forma adecuada, haz una vista previa, ten en cuenta de que en la vista previa no vas a poder ver el hack en acción, pero si te salió la vista previa sin problemas entonces guarda la plantilla.
El truco sale perfecto, cuesta un poco al principio pero si le pones atención y cuidado al reemplazar los códigos todo saldrá bien, te lo aseguro.
Si haces uso de los
comentarios en barra lateral tendrás que quitar solo el pequeño "CODIGO DE LOS COMENTARIOS" el cual guardaste entre <head> y </head> solo ese, nada mas... para que exista mayor compatibilidad.
Que lo disfrutes.
Buenos días,
He utilizado las etiquetas expandibles y me ha ido muy bien, perfecto, muchas gracias por la información.
Una pregunta es posible que al hacer click en una etiqueta se muestren todas las entradas de esta etiqueta a la vez, sin cambiar de página (puesto que por defecto estan comprimidas me iria bién poderlas ver todas a la vez y desplegar solo la que se quiera)
Ahora solo se muestran de 6 a 12, creo en función de lo que ocuparían expandias las entradas...
gracias
samuel
Antes se podía pero ahora ya no, lo que pasa es que Google ha cambiado su algoritmo (los caminos del señor Google son misteriosos) y ahora se valora las páginas web según la velocidad de carga de cada una, es decir si tu página es liviana, en las imágenes usas los atributos alt, usas etiquetas actualizadas y tienes una buena estructura XHTML, todo te va a ir bien en las posiciones de búsquedas.
Blogger tomó en consideración esta nueva medida de Google y ahora "autopagina" automáticamente todos y cada una de las páginas de archivos y etiquetas, incluido el home, razón por la cual a veces si pones 7 entradas en el home pero tienes unos dos post bastante pesados pues solo te aparecerán uno o dos post para que no excedan el límite que ahora Blogger nos "impone" (de forma abusiva cabe recalcar).
Así que no importa que pongas en configuración los 20 post que puedes poner, Blogger presentará lo que a el... literalmente le de la regalada gana.
Lamento no haber sido de ayuda, pero si te sirve de consuelo te puedo recomendar dos páginas interesantes para que inicies el interminable camino en el universo SEO:
www.websitegrader.com
www.blog.grader.com
Otra pregunta, puesto que la explicación que había en tu blog fue muy fácil de seguir, estoy pensando en vez de ocultar el post mostrando solo el título, otra forma de ordenar mi blog seria que al hacer click en una etiqueta salieran todas las entradas de esa etiqueta en el sidebar-wraaper, com si se tratara del archivo del blog. Asi que me pusa a la busca y encontré un articulo bueno en http://elescaparatederosa.blogspot.com/2008/08/titulos-de-entrada-por-etiquetas.html, lo que pasa que el script yo quería alojarlo dentro de la plantilla igual que haces tu en la anterior explicación.
se puede hacer? como sustituyo las dos lineas que afectan a la URL donde debería alojarse el script?
gracias!
samuel
Bueno... esto de los scripts es ciertamente delicado, las computadoras son como las mujeres, a veces no tienen lógica, tienes que intentar e intentar hasta que funciona todo bien, :D
Puedes intentarlo agregando el contenido del archivo que te descargaste y ponerlo dentro de:
<script type='text/javascript'>
//<![CDATA[
**Aquí tu contenido**
//]]>
</script>
Si no te funciona prueba quitando el:
//<![CDATA[
//]]>
Obviamente reemplazas donde está el:
<script src='URL_DEL_SCRIPT' type='text/javascript'/>
Quedaría siempre así:
<script type='text/javascript'>
//<![CDATA[
function showentry(json){
var maxp = (max_rc_posts <= json.feed.entry.length) ? max_rc_posts : json.feed.entry.length;
var text = "<ul>";
for (var i = 0; i < maxp; i++) {
var entry = json.feed.entry[i];
var posttitle = entry.title.$t;
var posturl;
if (i == json.feed.entry.length) break;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
posturl = entry.link[k].href;
break;
}
}
text += "<li><a href='"+posturl+"'>" + posttitle + "</a></li>";
}
text += "</ul>";
document.getElementById("showItemLabel").innerHTML = text;
}
function showPostLabel(sPL_label,e){
var isDOM = (navigator.appName.match("Microsoft Internet Explorer") || navigator.appName.match("MSIE")) ? false : true;
var check = document.getElementById("showItemLabel");
if(check) {
if(!isDOM) { check.removeNode(true); }
else {
check.parentNode.removeChild(check);
}
}
var elm;
if(e.target) elm = e.target;
else elm = window.event.srcElement;
var div = document.createElement('div');
div.innerHTML = "";
div.id = "showItemLabel";
if(!isDOM) { elm.insertAdjacentElement('afterEnd', div); } else { elm.parentNode.insertBefore(div, this.nextSibling); }
var elm2 = document.getElementById("showItemLabel");
elm2.style.display = "inline";
elm2.innerHTML = "<br/>Loading recent posts...";
var script = document.createElement('script');
script.src = home_page+"feeds/posts/summary/-/"+sPL_label.replace(/ /g,"%20")+"?start-index=1&max-results="+max_rc_posts+1+"&alt=json-in-script&callback=showentry";
script.type = "text/javascript";
document.getElementsByTagName('head')[0].appendChild(script);
}
//]]>
</script>
Podría funcionar, siempre es mejor tener los scripts dentro de tu propia plantilla, yo por mi parte ya me olvidé de utilizar javascripts por el problema del alojamiento y prefiero usarlos al mínimo además por el asunto de la velocidad de carga, no es siempre bueno ponerle todos los trucos que encuentras sino los que mas se adapten a tu estilo, en lo personal te recomiento que te remitas a la fuente osea Rosa si no llegase a funcionarte (lo cual veo dificil, por que el sistema que expuse es universal para estos casos), suerte.
Perfecto!
Ya funciona todo! Muchas gracias.
La verdad es que ahora tengo los dos scripts dentro. En principio no pienso poner más, pero con estos dos me queda la página bastante ordenada, teniendo listados de actividades, picos etc.. para pinchar en cada zona.
ahora solo me falta actualizarlo!
samuel
Buenas,
Soy muy malo en esto de la programacion a parte de nuevo y tengo una duda.
Quiero poner un gadget, en el que me salgan el listado de etiquetas del blog y que al pinchar en ella se me despliegue el listado de entradas en esa etiqueta, solo el titulo, para una vez decidido cual buscar poder pinchar en ella y que se despliegue.
Igual los has explicado pero no he terminado de enterarme.
Muchas Gracias, y muy interesante el blog.
www.lahoradada.es