cosas para el blog

Bueno esto es bastante fácil, tan solo hay que elegir en blogspot: Diseño>Añadir un gadget>Feed

Y ponemos el enlace a nuestro feed de comentarios o de entradas.
¿cual es tu feed?, bueno es algo como esto:

El de comentarios:
http://urldetublog/feeds/comments/default

El de entradas:
http://urldetublog/atom.xml

Ejemplo de como queda en la barra lateral de este mismo blog.

Para cambiar el texto que dice entradas antiguas y entradas reciente por otro o por una imágen hay que ir a Diseño>Edición Html> activar "Expandir artilugios" y buscamos mas o menos lo siguiente



<DIV class='blog-pager' id='blog-pager'>

<b:if cond='data:newerPageUrl'>

<SPAN id='blog-pager-newer-link'>

<A class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + "_blog-pager-newer-link"' expr:title='data:newerPageTitle'><data:newerPageTitle/></A>

</SPAN>

</b:if>

<b:if cond='data:olderPageUrl'>

<SPAN id='blog-pager-older-link'>

<A class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + "_blog-pager-older-link"' expr:title='data:olderPageTitle'><data:olderPageTitle/></A>

</SPAN>

</b:if>

<b:if cond='data:blog.homepageUrl != data:blog.url'>

<A class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></A>

<b:else/>

<b:if cond='data:newerPageUrl'>

<A class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></A>

</b:if>

</b:if>

</DIV>





<data:newerPageTitle/> - Corresponde al texto “Entrada más reciente”

<data:olderPageTitle/> - “Entradas antiguas”

<data:homeMsg/> - “Página principal”





Para cambiarlo directamente se eliminan y remplazan esas tres lineas  por lo que se quiera. Asi podemos remplazarlas por una imagen. por ejemplo





<img alt='data:newerPageTitle' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi81kggXMpO8ziYRmC61AtHN25lKAxP8JZ7_sZ8o4S5BkC6LTwmvqeR6FMfBwCtk84ucXMPjmB1ixppbOMM4UAF_hyphenhyphentUjpt1yT1bwzMPQuQwaA1x4icn5_4aE312PjVTOYE60wdRZFP21U/s1600/botong_atras.gif' />





Ejemplo de como queda en este mismo blog.

Si tenes un blog de blogger aunque no lo sepas ya tenes un feed este es:

http://tublog.blogspot.com/atom.xml


Podes usar este pero el probelma es que no te dice cuanta gente se suscribió, no podes agregarle publicidad, no podes hacer que se suscriban por e-mail, en fin no podes hacer mucho. Para hacer todas estas cosas el mejor que vi y que recomendaban todos es feedburner, que no es casualdad que sea del dominio de google el cual lo compro por rumores ya que no ha dicho por mas o menos una modesta suma de 100 millones de dolares. 0.o


1.hay que  Registrarse.
2. ponemos en el cuadro que aparece nuestro feed:
http://tublog.blogspot.com/atom.xml
3. elegimos el titulo del blog para el feed y el nombre del feed.
4. podemos abajo donde dice “ir directamente a la gestión del feed”
5.Hay que ir a nuestro panel de blogger, y elegir la pestaña “Configuración”>la subpestaña “Feed del sitio”> en la opción “Publicar URL redireccionada del feed”, copiamos la URL del feed de feedburner que acabamos de crear, que será algo parecido a: http://feeds.feedburner.com/titulodetublog.

Viste en la blogueria, la cual lo tomo de bloggerbusters
Ejemplo al costado de este blog o al costado de este blog

Para añadirlo buscamos en edición>Html, con la casilla de expandir artilugios tildada

<b:section class='sidebar' id='sidebar' preferred='yes'>

Y abajo pegar este código:

<b:widget id='Label99' locked='false' title='Labels' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<script src='http://halotemplates.s3.amazonaws.com/wp-cumulus-example
swfobject.js' type='text/javascript'/>
<div id='flashcontent'>Blogumulus by <a href='http://www.roytanck.com/'>Roy Tanck</a> and <a href='http://www.bloggerbuster.com'>Amanda Fazani</a></div>
<script type='text/javascript'>
var so = new SWFObject("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf", "tagcloud", "240", "300", "7", "#ffffff");
// uncomment next line to enable transparency
so.addParam("wmode", "transparent");
so.addVariable("tcolor", "0x333333");
so.addVariable("mode", "tags");
so.addVariable("distr", "true");
so.addVariable("tspeed", "100");
so.addVariable("tagcloud", "<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='12'><data:label.name/></a></b:loop></tags>");
so.addParam("allowScriptAccess", "always");
so.write("flashcontent");
</script>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>

Y listo se agrega como un gadget mas.

La mejor forma que vi hasta ahora es la que uso, asi que para el ejemplo tan solo toca en comentarios o anda bajo la entrada y fijate como lo tengo

Primero en blogger>configuración>comentarios tiene que estar la opcion en ventana emergente para que se vean bien.

Expande la plantilla de artilugios y busca </body>, y añade este código justo antes:


<script languange='javascript'>function showcomment(a,b){var jackbookdotcom = document.getElementById(a);jackbookdotcom.style.display = 'none';jackbookdotcom = document.getElementById(b);jackbookdotcom.style.display = 'block';}</script>


Después buscamos este:


<span class='post-comment-link'><b:if cond='data:blog.pageType != "item"'><b:if cond='data:post.allowComments'><a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/>

</b:if></a></b:if></b:if></span>


Y lo sustituímos por este:


<span class='post-comment-link'><b:if cond='data:blog.pageType != "item"'><b:if cond='data:post.allowComments'><a class='comment-link' expr:href='data:post.url + "#comments"' ><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a></b:if></b:if></span>


Por último buscamos este:


<b:includable id='comments' var='post'>

<div class='comments' id='comments'><a name='comments'/>

<b:if cond='data:post.allowComments'><h4><b:if cond='data:post.numComments == 1'>1 <data:commentLabel/>:<b:else/><data:post.numComments/> <data:commentLabelPlural/>:</b:if></h4><dl id='comments-block'><b:loop values='data:post.comments' var='comment'><dt class='comment-author' expr:id='"comment-" + data:comment.id'><a expr:name='"comment-" + data:comment.id'/><b:if cond='data:comment.authorUrl'><a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a><b:else/><data:comment.author/></b:if><data:commentPostedByMsg/></dt><dd class='comment-body'><b:if cond='data:comment.isDeleted'><span class='deleted-comment'><data:comment.body/></span><b:else/><p><data:comment.body/></p></b:if></dd><dd class='comment-footer'><span class='comment-timestamp'><a expr:href='"#comment-" + data:comment.id' title='comment permalink'><data:comment.timestamp/></a><b:include data='comment' name='commentDeleteIcon'/></span></dd></b:loop></dl><p class='comment-footer'><a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a></p></b:if><div id='backlinks-container'><div expr:id='data:widget.instanceId + "_backlinks-container"'><b:if cond='data:post.showBacklinks'><b:include data='post' name='backlinks'/>

</b:if></div></div></div>

</b:includable>


Y lo sustituímos todo por este:


<b:includable id='comments' var='post'>
<div class='comments' id='comments'>
<a name='comments'/>
<b:if cond='data:post.allowComments'>
<!--
<h4>
<b:if cond='data:post.numComments == 1'>
1 <data:commentLabel/>:
<b:else/>
<data:post.numComments/> <data:commentLabelPlural/>:
</b:if>
</h4>
-->
<div class='onepx'>
<dl id='comments-block' style='height: 1px;overflow:hidden;'>
<b:loop values='data:post.comments' var='comment'>
<dt class='comment-author' expr:id='"comment-" + data:comment.id'>
<a expr:name='"comment-" + data:comment.id'/>
<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
<data:commentPostedByMsg/>
</dt>
<dd class='comment-body'>
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'><data:comment.body/></span>
<b:else/>
<p><data:comment.body/></p>
</b:if>
</dd>
<dd class='comment-footer'>
<span class='comment-timestamp'>
<a expr:href='"#comment-" + data:comment.id' title='comment permalink'>
<data:comment.timestamp/>
</a>
<b:include data='comment' name='commentDeleteIcon'/>
</span>
</dd>
</b:loop>
</dl>
</div>
<!--
<p class='comment-footer'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
</p>
-->
<div id='comment-parent' onmouseover='showcomment("hoverme", "comment-child");' style='margin-bottom: 50px;'>
<h3 id='hoverme' style='display:block;'>
<img alt='Deja aqui tu comentario' src='URL IMAGEN QUE OCULTA EL FORMULARIO' title='Deja aqui tu comentario'/>
</h3>

<!-- este iframe de abajo es el formulario de comentarios. Puedes modificar el alto y el ancho y añadir imagen de fondo, entre otras modificaciones -->

<div id='comment-child' style='border:none; display: none; height:750px; width: 440px; margin-bottom: 5px; background-image: url (AQUI LA URL IMAGEN FONDO FORMA COMENTARIOS); border: 2px solid red;'>
<iframe expr:src='data:post.addCommentUrl' height='100%' scrolling='yes' style='border:none;' width='100%'/>
<br/>
</div>
<!-- fin del iframe -->
</div>
</b:if>
<div id='backlinks-container'>
<div expr:id='data:widget.instanceId + "_backlinks-container"'>
<b:if cond='data:post.showBacklinks'>
<b:include data='post' name='backlinks'/>
</b:if>
</div>
</div>
</div>
</b:includable>


Donde hay que poner donde dice las imágenes, la que se muestra y se va al pasarle el mousse por encima y la imagen de fondo. Si queres poner un color de fondo, sustituí
backgound-image: url (AQUI LA URL IMAGEN FONDO FORMA COMENTARIOS)

Por background: #f5f5f5, o el color que quieras

Visto y tomado de La blogueria

Estas opciónes se pueden activar desde entradas>Editar entradas en http://draft.blogger.com pero la mayoria de las veces no funciona y hay que, ademas de activarlo, añadir manualmente lo siguiente en edición HTML con la casilla de Expandir artilugios Activada:
Buscamos


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


O puede que aparezca sin el div asi:


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


O la footer-line-1, o la foteer-line-2, dependiendo dondque se quiera agregar, lo mas comun es al final,pero por ejemplo yo lo tengo en la 1


<!--ESTRELLITAS-->
<span class='star-ratings'>
<b:if cond='data:top.showStars'>
<div expr:g:background-color='data:backgroundColor' expr:g:text-color='data:textColor' expr:g:url='data:post.absoluteUrl' g:height='42' g:type='RatingPanel' g:width='180'>
</div>
</b:if>
</span>
lt;!--FIN  ESTRELLITAS-->
<!--REACCIONES-->

<span class='reaction-buttons'>
<b:if cond='data:top.showReactions'>
<table border='0' cellpadding='0' width='100%'><tr>
<td valign='center'><span class='reactions-label'>
<data:top.reactionsLabel/></span>
</td>
<td><iframe allowtransparency='true' class='reactions-iframe' expr:src='data:post.reactionsUrl' frameborder='0' name='reactions' scrolling='no'/></td>
</tr></table>
</b:if>
</span>
<!--FIN REACCIONES-->


Como se ve en el código esta el de las reacciones y el de las estrellitas tipo youtube para terminar de agregar las estrellitas buscamos

<b:include name='feedLinks'/>

y debajo añadimos:


<b:if cond='data:top.showStars'>
<script src='http://www.google.com/jsapi' type='text/javascript'/>
<script type='text/javascript'>
google.load("annotations", "1");
function initialize() {
google.annotations.setApplicationId(<data:top.blogspotReviews/>);
google.annotations.createAll();
google.annotations.fetch();
}
google.setOnLoadCallback(initialize);
</script>
</b:if>


Puede que se agreguen dos bloques de estrellitas para eliminar el segundo buscamos la segunda vez que aparece


<b:if cond='data:top.showStars'>


y eliminamos todo el bloque.

Para mostrar las entradas como lo tengo a la derecha vamos a:

Ponemos la dirección de la web de la que queremos mostrar las entradas, elegimos el modo, fijo oestático, con fondo sin fondo, tipo de letra, cantidad de entradas (máx. 5). Copiamos el código lo agregamos en un nuevo gadget Java/HTML y listo el pollo.
Ejemplos: Acá

Para crear un link que lleve a una entrada al azar añadir el siguiente código en un nuevo gadget Java/HTML:





<div id="myLuckyPost"></div> <script type="text/javascript"> function showLucky(root){ var feed = root.feed; var entries = feed.entry || []; var entry = feed.entry[0]; window.location = entry.link[0].href;} function fetchLuck(luck){ script = document.createElement('script'); script.src = '/feeds/posts/summary?start-index='+luck+'&max-results=1&alt=json-in-script&callback=showLucky'; script.type = 'text/javascript'; document.getElementsByTagName('head')[0].appendChild(script); } function feelingLucky(root){ var feed = root.feed; var total = parseInt(feed.openSearch$totalResults.$t,10); var luckyNumber = Math.floor(Math.random()*total);luckyNumber++; a = document.createElement('a'); a.href = '#random'; a.rel = luckyNumber; a.onclick = function(){fetchLuck(this.rel);}; a.innerHTML = 'Click <img src="http://img368.imageshack.us/img368/4980/dadosbut7.gif">'; document.getElementById('myLuckyPost').appendChild(a); } </script> <script src="/feeds/posts/summary?max-results=0&alt=json-in-script&callback=feelingLucky"></script>

Podés cambiar donde dice Click por lo que te parezca como tambien la imágen de los dados por la que quieras.
Ejemplo: en la barra lateral de este blog bajo el cuadro de entradas aleatorias dinámicas.