En Hoctro's Place nos proporcionan una manera distinta de mostrar las categorías en nuestra sidebar. Se trata de ver el título de nuestras etiquetas y debajo de cada título una relación de los títulos de las entradas asociadas con esa etiqueta concreta, con la opción de mostrar solo aquellas categorías o etiquetas que nos interesen.
[1] Tendremos que ir a la parte del HTML de nuestra plantilla y expandir los artilugios.
[2] Buscaremos el cierre de cualquier widget o elemento que es este: </widget>, (dará igual donde aparezca luego el nuevo elemento, ya que más tarde podremos arrastrarlo a donde nos interese) y justo a continuación, pegaremos este código:
| <b:widget id='HTML50' locked='false' title='Contenidos por categorias' type='HTML'><b:includable id='main'> <!-- <b:if cond='data:blog.pageType == "item"'> --> <!-- only display title if it's non-empty --> <b:if cond='data:title != ""'> <h2 class='title'><data:title/></h2> </b:if> <div class='widget-content'> <div id='data2006'/> <script type='text/javascript'> var homeUrl2 = "tublog.blogspot.com"; var labels = ["categoria","categoria2","categoria3","categoria4"]; // Given a json label search, this function return the decoded label. function getLabelFromURL(json) { for (var l = 0; l < json.feed.link.length; l++) { if (json.feed.link[l].rel == 'alternate') { var raw = json.feed.link[l].href; // The next two lines are borrowed from Ramani's Neo Template // code. Thanks Ramani! var label = raw.substr(raw.lastIndexOf('/')+1); return decodeURIComponent(label); } } } function listEntries2(json) { var ul = document.createElement('ul'); for (var i = 0; i < json.feed.entry.length; i++) { var entry = json.feed.entry[i]; var alturl; for (var k = 0; k < entry.link.length; k++) { if (entry.link[k].rel == 'alternate') { alturl = entry.link[k].href; break; } } var li = document.createElement('li'); var a = document.createElement('a'); a.href = alturl; var txt = document.createTextNode(entry.title.$t); a.appendChild(txt); li.appendChild(a); ul.appendChild(li); } for (var l = 0; l < json.feed.link.length; l++) { if (json.feed.link[l].rel == 'alternate') { var raw = json.feed.link[l].href; var label = raw.substr(homeUrl2.length+21); var label = getLabelFromURL(json); var txt = document.createTextNode(label); var h = document.createElement('h4'); h.appendChild(txt); var div1 = document.createElement('div'); div1.appendChild(h); div1.appendChild(ul); document.getElementById('data2006').appendChild(div1); } } } function search2(query, label) { var script = document.createElement('script'); script.setAttribute('src', 'http://' + query + '/feeds/posts/default/-/' + encodeURIComponent(label) + '?alt=json-in-script&callback=listEntries2'); script.setAttribute('type', 'text/javascript'); document.documentElement.firstChild.appendChild(script); } for (var i=0; i < labels.length; i++) if (labels[i])search2(homeUrl2, labels[i]); </script> </div> <b:include name='quickedit'/> <!-- </b:if> --> </b:includable> </b:widget> |
[3] Cambiamos ahora un par de cosas en el código:
| var homeUrl2 = "tublog.blogspot.com"; var labels = ["categoria","categoria2","categoria3","categoria4"]; |
En var homeUrl2 colocamos la dirección (url) de nuestro blog sin el http:// y en var labelsañadiremos el nombre de las categorías que vamos a mostrar, entre comillas y separadas por comas.
Tendremos en cuenta en este punto, que el widget no trabajará con etiquetas formadas por más de tres palabras y también presenta problemas con los acentos y las "eñes".
Tendremos en cuenta en este punto, que el widget no trabajará con etiquetas formadas por más de tres palabras y también presenta problemas con los acentos y las "eñes".
.jpg)
.jpg)
