data:newerPageTitle data:olderPageTitle data:homeMsg

miércoles, 6 de febrero de 2008
10:51:00

Por cada comentario que haces, Dios salva un gatito

Como incluir "temas relacionados" en nuestros posts


Esta pequeña guía no es 100% de mi autoría. La he resumido de las 3 guías que publicaron en x y que estan explicadas al detalle. Aquí sólo estoy resumiendo los pasos precisos para poder tener esa opción con una pequeña modificación que, aunque no esta indicada en las fuentes originales, no es nada del otro mundo inferir cuales podrían haber sido los cambios apropiados. Para esto debemos ir a Plantillas - Edición de HTML  y marcamos el casillero Expandir plantillas de artilugios

 

1er. paso

Ubicamos la etiqueta ]]></b:skin> y colocamos este código inmediatamente después de la etiqueta mencionada. Si no pudieran ubicar en un inicio la etiqueta ]]></b:skin> pueden probar ubicar la etiqueta </head> que es la que viene después en cualquier plantilla normal que no haya sido modificada pues si tiene modicaciones puede no estar precisamente después sino más abajo. Pero como sea, el código que a continuación les muestro debe ser incluído inmediatamente despues de la etiqueta ]]></b:skin>

<script type='text/javascript'>
//<![CDATA[  
var relatedTitles = new Array();  
var relatedTitlesNum = 0;  
var relatedUrls = new Array();  

function related_results_labels(json) {     
for (var i = 0; i < json.feed.entry.length; i++) {        
var entry = json.feed.entry[i];        
relatedTitles[relatedTitlesNum] = entry.title.$t;        
for (var k = 0; k < entry.link.length; k++) {           
if (entry.link[k].rel == 'alternate') {              
relatedUrls[relatedTitlesNum] = entry.link[k].href;              
relatedTitlesNum++;              
break;           
}        
}     
}  

function removeRelatedDuplicates() {     
var tmp = new Array(0);     
var tmp2 = new Array(0);     
for(var i = 0; i < relatedUrls.length; i++) {        
if(!contains(tmp, relatedUrls[i])) {           
tmp.length += 1;           
tmp[tmp.length - 1] = relatedUrls[i];           
tmp2.length += 1;           
tmp2[tmp2.length - 1] = relatedTitles[i];        
}     
}     
  relatedTitles = tmp2;     
  relatedUrls = tmp;  
  } 
   function contains(a, e) {     
   for(var j = 0; j < a.length; j++) if (a[j]==e) return true;        
   return false;  
   }  
   function printRelatedLabels() {   
   var cuantosPosts = 0; 
   var r = Math.floor((relatedTitles.length - 1) * Math.random());     
   var i = 0;     
   var dirURL = document.URL;     
   document.write('<ul>');     
   while (i < relatedTitles.length && i < 50) {        
   if (relatedUrls[r] != dirURL) {           
   document.write('<li><a href="' + relatedUrls[r] + '" title="Post relacionado: '                + relatedTitles[r] + '">' + relatedTitles[r] + '</a></li>');        
   }        
   if (r < relatedTitles.length - 1) {           
   r++;        
   }
   else
   {           
   r = 0;        
   }        
   i++;     
   cuantosPosts++;     
   if (cuantosPosts == 6) {        
   break;     
   }
   }     
   document.write('</ul>');  
   }
   //]]>
</script>

 

2do. paso

Ubicamos la línea <b:if cond='data:post.labels'> que normalmente tiene esta estructura:

<b:if cond='data:post.labels'>
   <data:postLabelsLabel/>
   <b:loop values='data:post.labels' var='label'>
      <a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if>

nuevo código

</b:loop>
</b:if>

y donde esta indicado nuevo código colocamos lo siguiente

<b:if cond='data:blog.pageType == "item"'>  
<script expr:src='"/feeds/posts/default/-/" + data:label.name +      "?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=10"' type='text/javascript'/>
</b:if>

Con este código mostraremos los temas relacionados unicamente mostrarlos en la página individual de cada post. Si lo que deseamos es mostrar los temas relacionados tanto en las páginas individuales de cada post así como en la página principal, entonces el código sería este:

<b:if cond='data:blog.pageType == "item"'>  
<script expr:src='"/feeds/posts/default/-/" + data:label.name +      "?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=10"' type='text/javascript'/>

<b:else/>

<script expr:src='"/feeds/posts/default/-/" + data:label.name +      "?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=10"' type='text/javascript'/>

</b:if>

y como se darán cuenta sólo hemos agregado un <b:else/> y copiado nuevamente el script en javascript. Nada más.

 

3er. y último paso

Esta explicación la estoy tomando del post Blogger: Posts relacionados (3) por estar mucho mejor explicado de lo que yo podría hacerlo. 

.../

Ahora buscamos la línea

<p class='post-footer-line post-footer-line-3'/>

o el final de las líneas con los pie de página.
Lamento no poder se más claro porque esta parte suele tener demasiadas variaciones en las plantillas; el sector del que hablo es algo así:


<b:includable id='post' var='post'>
   <div class='post'>
      .......
      <div class='post-body'>
         .......
      </div>
      <div class='post-footer'>
         <p class='post-footer-line post-footer-line-1'>
            ....... generalmente el autor del post .......
         </p>
         <p class='post-footer-line post-footer-line-2'>
            ....... generalmente las etiquetas del post .......
         </p>
         <p class='post-footer-line post-footer-line-3'>
            ....... generalmente sin uso .......
         </p>
           aquí agregaremos el nuevo código
      </div>
   </div>
</b:includable>
</b:widget>


.../


Esa nueva línea tendrá el siguiente código:



<b:if cond='data:blog.pageType == "item"'>  
<script expr:src='"/feeds/posts/default/-/" + data:label.name +      "?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=10"' type='text/javascript'/>
</b:if>


Pero igual que en caso anterior, on este código mostraremos los temas relacionados unicamente mostrarlos en la página individual de cada post. Si lo que deseamos es mostrar los temas relacionados tanto en las páginas individuales de cada post así como en la página principal, entonces el código sería este:


<b:if cond='data:blog.pageType == "item"'>  


<script expr:src='"/feeds/posts/default/-/" + data:label.name +      "?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=10"' type='text/javascript'/>


<b:else/>


<script expr:src='"/feeds/posts/default/-/" + data:label.name +      "?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=10"' type='text/javascript'/>


</b:if>


 


Notas finales


Deben de tener en cuenta que los dos últimos bloque de código deben presentar congruencia sobre si lo quieren sólo para las páginas individuales o también para la página principal. Ahora si sólo lo desean para la página principal y no para las páginas individuales, cambiariamos, en el 2do. código ingresado, esta línea


<b:if cond='data:blog.pageType == "item"'>  
<script expr:src='"/feeds/posts/default/-/" + data:label.name +      "?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=10"' type='text/javascript'/>
</b:if>

por esta otra

<b:if cond='data:blog.pageType != "item"'>  
<script expr:src='"/feeds/posts/default/-/" + data:label.name +      "?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=10"' type='text/javascript'/>
</b:if>

y para el caso del 3er. código ingresado, los cambios serían

<b:if cond='data:blog.pageType == "item"'>  
<script expr:src='"/feeds/posts/default/-/" + data:label.name +      "?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=10"' type='text/javascript'/>
</b:if>

por este otro


<b:if cond='data:blog.pageType != "item"'>  
<script expr:src='"/feeds/posts/default/-/" + data:label.name +      "?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=10"' type='text/javascript'/>
</b:if>

 

Guardamos la plantilla y asunto solucionado!!!!!!

Para mayor información remitirse a las fuentes que indico a continuación.

 

Fuentes


  1. Blogger: Posts relacionados (1)

  2. Blogger: Posts relacionados (2)

  3. Blogger: Posts relacionados (3)

*****

0 comentarios:

Haznos saber tu opinión

Todo comentario es bien recibido. Pero debes de tener en consideración los siguientes puntos:
1. No se permitirán insultos.
2. No se permitirá comentarios únicamente con publicidad. En todo caso te sugiero enviar un mensaje privado para ver el tema.
3. No se permitirá ningún tipo de ataque, agresión ni apologías de ningún tipo que inciten a la violencia o reacciones violentas. Se puede criticar y entablar debate sin necesidad de agredir a nadie.
4. No se permitirá ningún tipo de discriminación, segregación ni racismo.

Todos los comentarios serán sujetos a moderación, así que por favor les pido un poco de paciencia. Muchas gracias por comentar en este blog.



Coméntalo en Facebook

data:newerPageTitle data:olderPageTitle data:homeMsg

Publicados en esta categoría...

Suscribete a De Copy and Paste