jueves, 13 de diciembre de 2012

Añadir "articulos relacionados" a tus entradas

Aplicado en la web

Generar trafico para nuestro blog es muy importante, pero a muchos bloggers se les olvida que el trafico mas valorizado es el trafico de calidad, es decir un trafico que siempre vuelve o/y se mantiene en nuestro blog.

Una de las cosas las importantes es mantener a nuestros visitantes lo maximo posible en nuestro blog, para ello necesitamos ofrecerles mas articulos de la misma tematica una vez que terminan de leer el que estaban leyendo(tecnica sacada del mundo empresarial). Para ello utilizamos el tip de articulos relacionados.

Este tip consiste en un cuadro donde vienen los articulos relacionados con el articulo que acabamos de leer,  este script tiene en cuenta los tags que le asignamos al articulo; para mostrar los relacionados, a continuacion vemos como podemos instalarlo.
  1. Accedemos al codigo HTML de nuestro blog accedi endo a Diseño>Edicion HTML. 
  2. Hacemos una copia de seguridad de nuestra plantilla copiando codigo HTML, o descargandola en fichero xml, esta ultima es la forma mas segura, la recomiendo.
  3. Expandimos los artilugios  y buscamos los siguiente (Pulsamos F3 para ejecutar el buscador):
               <data:post.body/>            
     4.  Ahora pegamos el siguiente codigo  justo debajo del codigo buscado anteriormente.

copia este codigo

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

<div class='widget-content'><br />
<h3>Articulos relacionados por categorias</h3>
<div id='data2007'/><br/><br/>
<script type='text/javascript'>

var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;

maxNumberOfPostsPerLabel = 10;
maxNumberOfLabels = 3;


function listEntries10(json) {
 var ul = document.createElement(&#39;ul&#39;);
 var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ? 
                json.feed.entry.length : maxNumberOfPostsPerLabel;
 for (var i = 0; i &lt; maxPosts; i++) {
   var entry = json.feed.entry[i];
   var alturl;

   for (var k = 0; k &lt; entry.link.length; k++) {
     if (entry.link[k].rel == &#39;alternate&#39;) {
       alturl = entry.link[k].href;
       break;
     }
   }
   var li = document.createElement(&#39;li&#39;);
   var a = document.createElement(&#39;a&#39;);
   a.href = alturl;

if(a.href!=location.href) {
var txt = document.createTextNode(entry.title.$t);
a.appendChild(txt);
li.appendChild(a);
ul.appendChild(li);
}
 }
 for (var l = 0; l &lt; json.feed.link.length; l++) {
   if (json.feed.link[l].rel == &#39;alternate&#39;) {
     var raw = json.feed.link[l].href;
     var label = raw.substr(homeUrl3.length+13);
     var k;
     for (k=0; k&lt;20; k++) label = label.replace(&quot;%20&quot;, &quot; &quot;);
     var txt = document.createTextNode(label);
     var h = document.createElement(&#39;b&#39;);
     h.appendChild(txt);
     var div1 = document.createElement(&#39;div&#39;);
      div1.appendChild(h);
     div1.appendChild(ul);
     document.getElementById(&#39;data2007&#39;).appendChild(div1);
   }
 }
}
function search10(query, label) {

var script = document.createElement(&#39;script&#39;);
script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39;
+ label +
&#39;?alt=json-in-script&amp;callback=listEntries10&#39;);
script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;);
document.documentElement.firstChild.appendChild(script);
}

var labelArray = new Array();
var numLabel = 0;

<b:loop values='data:posts' var='post'>
 <b:loop values='data:post.labels' var='label'>
   textLabel = &quot;<data:label.name/>&quot;;
   
   var test = 0;
   for (var i = 0; i &lt; labelArray.length; i++)
   if (labelArray[i] == textLabel) test = 1;
   if (test == 0) { 
      labelArray.push(textLabel);
      var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ? 
             labelArray.length : maxNumberOfLabels;
      if (numLabel &lt; maxLabels) {
         search10(homeUrl3, textLabel);
         numLabel++;
      }
   }
 </b:loop>
</b:loop>
</script>
</div>

</div>
</b:if>

El codigo que acabamos de implementar es para mostrar 10 posts de 3 categorias diferentes.Esto ultimo lo podemos modificar, cambiando lo siguiente:

               maxNumberOfPostsPerLabel = 10;




              maxNumberOfLabels = 3;


y le ponemos el valor deseado.

Si te ha gustado el articulo da un click a la publicidad
GRACIAS

Articulos relacionados por categorias