Como permitir que los lectores se suscriban a una categoría especifíca del blog

¡ Artículo publicado en el blog El Balcón de Jaime, que pese a ser un blog terminado, es uno de los mejores en truvos blogger. ! Ve la entrada en su blog original.


Permitir que los lectores de tu blog se suscriban a una etiqueta específica

Este truco te permitirá ofrecer a tus lectores la posibilidad de suscribirse a una etiqueta específica del blog, recibiendo así las últimas entradas agrupadas bajo dicha categoría.

Para hacer ver al visitante dicha ventaja, incluiremos un pequeño icono de rss en el lado izquierdo de cada enlace.


Explicaré dos formas de instalar el truco: para las plantillas antiguas de blogger y para las nuevas, de manera que funcione sin problemas.

Diseño>Edición de HTML>expandimos artilugios

Este es el código necesario:

<b:widget id='Label2' locked='false' title='Feeds de Etiquetas' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<ul>
<b:loop values='data:labels' var='label'>
<li style='list-style:none outside none;border-bottom:1px solid #cccccc; padding:3px 20px;'>
<a expr:href='data:post.url + "/feeds/posts/default/-/" + data:label.name'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7vjtS4oeTJ2SyeKAzkvvhJx-PBMXMmZtlb37V5RLFN1fWcMbIKXaxCn1yUotvatyN2YwKaKown7crd6fkIFQ3n4_Q9X0EoGZIxNTyQBeHTDEoSLpQHeeIutKJeihWVsMEUOU7Ui9oB-I/s400/balcnfd.png' style='padding-right:3px;' title='Suscribirme a esta etiqueta'/></a>
<b:if cond='data:blog.url == data:label.url'>
<data:label.name/>
<b:else/>
<a expr:href='data:label.url'><data:label.name/></a>
</b:if>
(<data:label.count/>)
</li>
</b:loop>
</ul>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>

1) Si tu plantilla es antigua, encuentra estas líneas y añade el código debajo:

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

2) En caso de tener una plantilla nueva, busca esto y agrega el código debajo:

<b:section-contents id='sidebar-right-1'>

¿No lo encuentras? Prueba a buscar esto otro e insértalo encima:

<b:widget id='Followers1' locked='false' title='Seguidores' type='Followers'>

Pulsa el botón guardar y habrás terminado. Espero que esto te ayude a conseguir un mayor número de suscriptores y difundir con facilidad tus artículos.

Read More

Instala un elegante aviso flotante de suscripción al blog

Artículo publicado en el blog Ciudad Blogger, uno de los sitios con más información sobre tecnología Blogger Ve la entrada en su blog original.

otra vez vimos cómo poner un anuncio flotante que baja con la página el cual se usa con frecuencia para poner un aviso en el blog, pero también podemos darle otro uso y sacarle provecho para aumentar las suscripciones al feed.

Es decir, vamos a poner un aviso flotante de suscripción al blog de forma que cuando baje la página también baje la caja de suscripción.

Puedes ver un ejemplo en este blog de pruebas, y de paso puedes suscribirte ahí a este blog

Para ponerlo en tu blog primero debes tener activada la opción de suscripción por email en Feedburner. Si no lo has hecho entra a tu cuenta de Feedburner, haz click sobre el nombre de tu blog y luego click en la pestaña Publicize.

Ahora haz click en el enlace Suscripciones por Email que se encuentra en el menú lateral izquierdo.
A continuación haz click en el botón Activar y estará habilitada la función de suscripción por correo.

Ahora dentro de Blogger entra en Diseño > Edición de HTML y pega antes de </head> lo siguiente:

<style type='text/css'>
#anuncio {
position:absolute;
padding: 2px;
padding-top: 15px;
width: 280px; /* ancho del anuncio */
visibility: hidden;
z-index: 200;
top: 30px;
left: 30px;
}
#rss-mail {
/* color e imagen de fondo */
background: #FFFFFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtxoyxWHhvQJ_potwRAEiOMjZz-O-s3b3_JPqhfZQH-k9kSgsBiaFmC4dgkpaOZvg1_KhKSGD4YgNwAAX-FTwziIL0WdG0VlGoH316OQ94pejllVnImlyLbqKUg8gW9rIFAjjQKN780t0/s320/pattern_blk_point.png);
border:2px solid #FF8000; /* borde */
height:70px; /* alto de la caja */
}
#rss-mail span {
color:#FFFFFF; /* color del texto */
font-size:12px;
font-weight:bold;
line-height:30px;
}
#rss-submit {
background:#FF8000; /* color del botón */
border:0px;
}
.rss-box {
height:13px;
margin-top:10px;
color:#6E6E6E;
font-size:12px;
width:135px;
}
< /style>

< script type='text/javascript'>
//<![CDATA[
var persistclose=0 //set to 0 or 1. 1 means once the bar is manually closed, it will remain closed for browser session
var startX = 30 //set x offset of bar in pixels
var startY = 15 //set y offset of bar in pixels
var verticalpos="fromtop" //enter "fromtop" or "frombottom"

function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}

function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) {
offset += search.length
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}

function closebar(){
if (persistclose)
document.cookie="remainclosed=1"
document.getElementById("anuncio").style.visibility="hidden"
}

function staticbar(){
barheight=document.getElementById("anuncio").offsetHeight
var ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera;
var d = document;
function ml(id){
var el=d.getElementById(id);
if (!persistclose || persistclose && get_cookie("remainclosed")=="")
el.style.visibility="visible"
if(d.layers)el.style=el;
el.sP=function(x,y){this.style.left=x+"px";this.style.top=y+"px";};
el.x = startX;
if (verticalpos=="fromtop")
el.y = startY;
else{
el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;
el.y -= startY;
}
return el;
}
window.stayTopLeft=function(){
if (verticalpos=="fromtop"){
var pY = ns ? pageYOffset : iecompattest().scrollTop;
ftlObj.y += (pY + startY - ftlObj.y)/8;
}
else{
var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight;
ftlObj.y += (pY - startY - ftlObj.y)/8;
}
ftlObj.sP(ftlObj.x, ftlObj.y);
setTimeout("stayTopLeft()", 10);
}
ftlObj = ml("anuncio");
stayTopLeft();
}
if (window.addEventListener)
window.addEventListener("load", staticbar, false)
else if (window.attachEvent)
window.attachEvent("onload", staticbar)
else if (document.getElementById)
window.onload=staticbar
//]]>
< /script>

Luego busca la etiqueta </body> y antes de ella pega esto:

<div id='anuncio'>
< div id='rss-mail'>
< a href='Javascript:void' onClick='closebar(); return false'><img align='right' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKGyhzMjbbi5wdYXZIgRXXR6AjvMhyphenhyphenZSbv9SRXgf3pxln2oF0ajRyzrJnF1nI-qQCtRGrIMNRX0UkbYSLOddzxjt5-j8cJBH0rsIRarG2PEZi3E8z_YYSkpgru9S-aX_Z02pQYQ8Rgswo/s320/cerrar.png'/></a>

< span>Recibe las actualizaciones directo a tu correo</span><br/>

< img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFWwhVWd-PdGdMW81O7s2x979RuigTydecL79PrMi5MA7TAz9MZpll1EiPqAuWREquhEgI2OL4o_RjHR44eFZY4hx2xazgquvYIKX8LIJb_fza5q3T4H4veHI6YaZXYq-fdue54ZfciHM/s1600/rss-icono.png' style='padding:5px; float:left;'/>
< form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=miblog&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'>
< input name='email' type='text/'/>
< input name='uri' type='hidden' value='miblog'/><input name='loc' type='hidden' value='es_ES'/><input id='rss-submit' type='submit' value='Suscribir'/></form></div></div>

Ahora sólo cambia lo que está en color rojo por el nombre de tu feed, por ejemplo, la URL de tu feed de Feedburner es algo como esto:

http://feeds.feedburner.com/miblog

El nombre de tu feed es lo que está en rojo, tal cual, sin espacios; así es como deberás ponerlo en el código donde se indica.

Lo que está en color azul puedes cambiarlo por otro texto, te recomiendo que no sea un texto muy largo.

En el primer código puedes personalizar la apariencia de la caja de suscripción, puedes guiarte por las anotaciones en color verde para saber a qué corresponde cada cosa.

De esta forma tendrás la posibilidad de conseguir más suscripciones a tu feed de una forma muy llamativa, además que la caja de suscripción puede cerrarse haciendo click en el ícono de cerrar.

Read More

Cómo poner un botón de suscripción en el lateral del blog

¡ Artículo publicado en el blog El Balcón de Jaime, que pese a ser un blog terminado, es uno de los mejores en truvos blogger. ! Ve la entrada en su blog original.

Botón de suscribir en un lateral del blog

Me habían preguntado si se podía hacer un botón que permaneciese fijo en un lateral del blog y que, a su vez, sirviese para suscribirse al blog.

Aunque anteriormente expliqué trucos sobre cómo poner imágenes fijas en un lateral del blog, explicaré este truquillo, que, aunque es muy sencillo, puede servir de ayuda para quien no sepa hacerlo...

Diseño>añadir gadget (elemento de página)>html-javascript

Pegas el código:

<a style="display:scroll;position:fixed;bottom:370px;left:0px;" href="URL DEL FEED DEL BLOG" target="_blank" title="¡Recibe mis actualizaciones!"><img src="URL DE LA IMAGEN"/></a>

Rellena lo siguiente:

URL DEL FEED DEL BLOG: la dirección de tu feed, puedes obtenerla en feedburner :-D
La URL sería algo así: http://feeds.feedburner.com/elbalcondejaime
Recibe mis actualizaciones!: la frase que quieras que aparezca cuándo se deja el cursor un ratito sin hacer click (puedes dejarla así si quieres)

URL DE LA IMAGEN: dirección de la imagen del feed, puedes encontrar imágenes en iconlook por ejemplo ;-D

¡Suerte!

Read More

Como ofrecer la opción de suscribirse a distintas categorías

¡ Artículo publicado en el blog El Balcón de Jaime, que pese a ser un blog terminado, es uno de los mejores en truvos blogger. ! Ve la entrada en su blog original.

Ofrecer la opción de suscribir a diferentes etiquetas

Este truco es muy sencillo de realizar y ofrece la gran ventaja de ahorrarnos el incluir elementos de página que posibiliten la suscripción a etiquetas o categorías del blog.

Se trata de poner un código en la plantilla para que, con solo pulsar el botón Feed del navegador, aparezcan distintas formas de suscribirse al blog:

En la imagen puedes ver la opción "Suscribirse a Setas comestibles" debido a que estoy leyendo artículos con esta etiqueta.

Para incluirlo en tu blog sigue los siguientes pasos:

Diseño>Edición de HTML>expandimos artilugios

Busca la etiqueta <body> (que estará debajo de la etiqueta </head>) y encima inserta este bloque:

<b:if cond='data:blog.pageType != &quot;archive&quot;'>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<link expr:href='&quot;DIRECCION DE TU BLOG/feeds/posts/default/-/&quot; + data:blog.pageName' expr:title='data:blog.title + &quot; - &quot; + data:blog.pageName' rel='alternate' type='application/rss+xml'/></b:if></b:if></b:if>

Sustituye DIRECCION DE TU BLOG por la url de tu sitio web (sin incluir la barra final, es decir, la que te muestro en rojo:http://elbalcondejaime.blogspot.com/).

Para terminar, guarda la plantilla:

Read More

Añade una caja de suscripciones al blog

Entrada publicada originalmente en el balcón de Jaime. Visitar

Añade una preciosa caja de suscripciones en tu blog

Si te gusta ofrecer a tus lectores la posibilidad de suscribirse al contenido que publicas o invitarles a seguirte en Twitter, esta es sin duda tu mejor herramienta.

Construí una pequeña cajita con los colores y las tonalidades típicas de blogger -lo que la convierte en un artilugio muy familiar- y con un bonito efecto al pasar el cursor por encima de cada enlace.

Es una alternativa a los botones individuales que solemos incluir en nuestra barra lateral para ofrecer las mismas ventajas a todo visitante y por suerte, con una rápida instalación.

El resultado será el mismo que aparece en la imagen de la izquierda. ¿Te animas? ¡Empecemos!

Diseño>Edición de HTML>expandimos artilugios

Busca la etiqueta </head> y añade esta línea encima (antes):

<link href="https://sites.google.com/site/scriptsbalcon/b/blcajCSS.css" rel="stylesheet" type="text/css"/>

Guarda la plantilla.

Diseño>añadir gadget (elemento de página)>html-javascript

Pega este código en su interior:

<div id="blCajaMeta">
<div id="blCajaMetaContenid">
<div class="blcaja1"><a href="URL FEED">Suscríbete a mi feed</a></div>
<div style="padding:2px;border-bottom:1px dashed #E1D4C0;"></div>
<div class="blcaja2"><a href="URL FEED EMAIL">Suscríbete vía email</a></div>
<div style="padding:2px;border-bottom:1px dashed #E1D4C0;"></div>
<div class="blcaja3"><a href="URL TWITTER">Sígueme en Twitter</a></div>
</div>
</div>
<style>#blCajaMeta {width:220px;}</style>

Ahora tan solo debes reemplazar URL FEED, URL FEED EMAIL y URL TWITTER por la dirección del feed de tu blog, la dirección de la suscripción por email o correo electrónico (aconsejo utilizar Feedburner) y la dirección de tu perfil en Twitter -respectivamente-.

Las frases del código (resaltadas en color grisáceo) pueden editarse a gusto propio.

La cifra en color rojo (220) indica la anchura de la caja. Auméntala o disminúyela para ajustar el marco a tu barra lateral.



Si es así, haz uso de esta otra línea en el primer paso (en lugar de la indicada):

<link href="https://sites.google.com/site/scriptsbalcon/b/blcajCSSfcbk.css" rel="stylesheet" type="text/css"/>

Y añade esto justo antes de los cierres </div> y </div> del segundo código:

<div style="padding:2px;border-top:1px dashed #E1D4C0;" class="blcaja4"><a href="URL FACEBOOK">Seguir en Facebook</a></div>

Sustituye URL FACEBOOK por la dirección de tu perfil o página en dicha red social y edita la frase a mostrar si lo consideras necesario.

¡Guarda el gadget y habrás terminado!

Read More

Añade una caja de suscripciones a tu blog

Si te gusta ofrecer a tus lectores la posibilidad de suscribirse al contenido que publicas o invitarles a seguirte en Twitter, esta es sin duda tu mejor herramienta.

Construí una pequeña cajita con los colores y las tonalidades típicas de blogger -lo que la convierte en un artilugio muy familiar- y con un bonito efecto al pasar el cursor por encima de cada enlace.

Es una alternativa a los botones individuales que solemos incluir en nuestra barra lateral para ofrecer las mismas ventajas a todo visitante y por suerte, con una rápida instalación.

Interesante cajita de Feed por El Balcón de Jaime. Visitar Blog.

El resultado será el mismo que aparece en la imagen de la izquierda. ¿Te animas? ¡Empecemos!

Diseño>Edición de HTML>expandimos artilugios

Busca la etiqueta </head> y añade esta línea encima (antes):

<link href="https://sites.google.com/site/scriptsbalcon/b/blcajCSS.css" rel="stylesheet" type="text/css"/>

Guarda la plantilla.

Diseño>añadir gadget (elemento de página)>html-javascript

Pega este código en su interior:

<div id="blCajaMeta">
<div id="blCajaMetaContenid">
<div class="blcaja1"><a href="URL FEED">Suscríbete a mi feed</a></div>
<div style="padding:2px;border-bottom:1px dashed #E1D4C0;"></div>
<div class="blcaja2"><a href="URL FEED EMAIL">Suscríbete vía email</a></div>
<div style="padding:2px;border-bottom:1px dashed #E1D4C0;"></div>
<div class="blcaja3"><a href="URL TWITTER">Sígueme en Twitter</a></div>
</div>
</div>
<style>#blCajaMeta {width:220px;}</style>

Ahora tan solo debes reemplazar URL FEED, URL FEED EMAIL y URL TWITTER por la dirección del feed de tu blog, la dirección de la suscripción por email o correo electrónico (aconsejo utilizar Feedburner) y la dirección de tu perfil en Twitter -respectivamente-.

Las frases del código (resaltadas en color grisáceo) pueden editarse a gusto propio.

La cifra en color rojo (220) indica la anchura de la caja. Auméntala o disminúyela para ajustar el marco a tu barra lateral.



Si es así, haz uso de esta otra línea en el primer paso (en lugar de la indicada):

<link href="https://sites.google.com/site/scriptsbalcon/b/blcajCSSfcbk.css" rel="stylesheet" type="text/css"/>

Y añade esto justo antes de los cierres </div> y </div> del segundo código:

<div style="padding:2px;border-top:1px dashed #E1D4C0;" class="blcaja4"><a href="URL FACEBOOK">Seguir en Facebook</a></div>

Sustituye URL FACEBOOK por la dirección de tu perfil o página en dicha red social y edita la frase a mostrar si lo consideras necesario.

¡Guarda el gadget y habrás terminado!

Gracias a el Balcón de Jaime. LINK

Gracias por tu visita al Blogger Magazine, las últimas novedades de los mejores maestros bloggers.

Read More