Personalizar el gadget "Enlaces de Suscripción" de Blogger

26 de diciembre de 2011 132 comentarios ,
En XarDesigns he visto una forma de personalizar el gadget de "Enlaces de Suscripción" que me ha gustado mucho. Y es que ese gadget no es tan usado, quizá por lo poco atractivo que puede parecer para algunos. Sin embargo, ofrecerles a los lectores un medio para suscribirse al feed del blog debe ser primordial.
Con esta forma de personalizarlo el gadget luce más "sexi" según el autor, pero lo mejor es que está hecho a base de CSS3 así que podemos cambiarle los colores sin problemas. Además, se le ha agregado la suscripción por correo electrónico con lo cual el gadget se vuelve más completo.

Este es el gadget original:

Y después de modificarlo quedará así:

Y al desplegarse se verá de esta forma:


Si aún no usas el gadget entra en Diseño | Elementos de la página | Añadir un gadget | Enlaces de suscripción, o si usas la nueva interfaz entra en Diseño | Añadir un gadget | Enlaces de suscripción.


Ya teniéndolo en tu blog, o si ya lo tenías puesto, entra en la Edición HTML de la plantilla, y SIN expandir los artilugios busca esta línea:
<b:widget id='Subscribe1' locked='false' title='Suscribirse a' type='Subscribe'/>
Elimínala y en su lugar pon este código:
<b:widget id='Subscribe1' locked='false' title='Suscribirse a' type='Subscribe'>
<b:includable id='main'>
<b:if cond='data:isPublic'>
<div style='white-space:nowrap'>
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<b:loop values='data:feeds' var='feed'>
<div expr:class='&quot;subscribe-wrapper subscribe-type-&quot; + data:feed.type'>
<div expr:class='&quot;subscribe expanded subscribe-type-&quot; + data:feed.type' expr:id='&quot;SW_READER_LIST_&quot; + data:widgetId + data:feed.type' style='display:none;'>
<div class='top'>
<span class='inner' expr:onclick='&quot;return(_SW_toggleReaderList(event, \&quot;&quot; + data:widgetId +data:feed.type + &quot;\&quot;));&quot;'>
<div class='subscribe-arrow-collapse'/>
<data:feed.title/>
</span>
<div class='feed-reader-links'>
<div class='subscribe-add-platform'>
<div class='subscribe-add-bubble-wrapper'>
<div class='subscribe-add-bubble'>+</div>
<div class='subscribe-add-bubble-arrow'/>
</div>
<a class='feed-reader-link' expr:href='&quot;http://www.google.com/ig/add?source=bstp&amp;feedurl=&quot; + data:feed.encodedUrl' target='_blank'>Agregar a Google</a>
</div>
<div class='subscribe-add-platform'>
<div class='subscribe-add-bubble-wrapper'>
<div class='subscribe-add-bubble'>+</div>
<div class='subscribe-add-bubble-arrow'/>
</div>
<a class='feed-reader-link' expr:href='&quot;http://www.netvibes.com/subscribe.php?url=&quot; + data:feed.encodedUrl' target='_blank'>Agregar a Netvibes</a>
</div>
<div class='subscribe-add-platform'>
<div class='subscribe-add-bubble-wrapper'>
<div class='subscribe-add-bubble'>+</div>
<div class='subscribe-add-bubble-arrow'/>
</div>
<a class='feed-reader-link' expr:href='&quot;http://www.newsgator.com/ngs/subscriber/subext.aspx?url=&quot; + data:feed.encodedUrl' target='_blank'>Agregar a NewsGator</a>
</div>
<div class='subscribe-add-platform'>
<div class='subscribe-add-bubble-wrapper'>
<div class='subscribe-add-bubble'>+</div>
<div class='subscribe-add-bubble-arrow'/>
</div>
<a class='feed-reader-link' expr:href='&quot;http://add.my.yahoo.com/content?url=&quot; + data:feed.encodedUrl' target='_blank'>Agregar a MyYahoo!</a>
</div>
<div class='subscribe-add-platform'>
<div class='subscribe-add-bubble-wrapper'>
<div class='subscribe-add-bubble'>+</div>
<div class='subscribe-add-bubble-arrow'/>
</div>
<a class='feed-reader-link' expr:href='data:feed.url' target='_blank'>Suscribirse vía Atom</a>
</div>
</div>
</div>
<div class='bottom'/>
</div>

<div class='subscribe' expr:id='&quot;SW_READER_LIST_CLOSED_&quot; + data:widgetId +data:feed.type' expr:onclick='&quot;return(_SW_toggleReaderList(event, \&quot;&quot; + data:widgetId +data:feed.type + &quot;\&quot;));&quot;'>
<div class='top'>
<span class='inner'>
<div class='subscribe-arrow-expand'/>
<span expr:onclick='&quot;return(_SW_toggleReaderList(event, \&quot;&quot; + data:widgetId +data:feed.type + &quot;\&quot;));&quot;'>
<data:feed.title/>
</span>
</span>
</div>
<div class='bottom'/>
</div>

</div>
</b:loop>
<div class="subscribe-via-email-wrapper">

<form action='http://feedburner.google.com/fb/a/mailverify' expr:onsubmit='&quot;window.open(\&quot;http://feedburner.google.com/fb/a/mailverify?uri=Nombre-de-mi-feed\&quot;, \&quot;popupwindow\&quot;, \&quot;scrollbars=yes,width=550,height=520\&quot;); return true&quot;' method='post' target='popupwindow'>
<input class='follow-by-email-address' name='email' placeholder='dirección de correo....' size='14' type='text'/>
<input class='follow-by-email-submit' type='submit' value='Submit'/>
<input name='uri' type='hidden' value='Nombre-de-mi-feed'/>
<input name='loc' type='hidden' value='es_ES'/>
</form>

</div>
<div style='clear:both'/>
</div>
</div>
</b:if>
</b:includable>
</b:widget>
En donde dice Nombre-de-mi-feed pon el nombre que le has dado a tu feed en Feedburner, por ejemplo, en mi caso, esta es la URL de mi feed de Feedburner:
http://feeds.feedburner.com/CiudadBlogger
Por lo tanto, el nombre de mi feed, en mi caso es CiudadBlogger
Para que esa opción de correo funcione deberás tener activado en Feedburner la suscripción por correo electrónico.

Ahora antes de ]]></b:skin> agrega los estilos:
div.subscribe div.top, div.subscribe div.bottom {
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='');}
div.subscribe div.top, div.subscribe div.bottom {
background: none !important;
padding:3px;
}

.feed-reader-links {
background-color: #222 !important; /* Color de fondo del contenedor desplegable */
padding: 1px 0 !important;
border-radius: 3px !important;
color: #000 !important;
-khtml-border-radius: 3px !important;
-webkit-border-radius: 3px !important;
-moz-border-radius: 3px !important;
-moz-box-shadow: 5px 5px 5px rgba(0,0,0,0.5);
-webkit-box-shadow: 5px 5px 5px rgba(0,0,0,0.5);
-khtml-box-shadow: 5px 5px 5px rgba(0,0,0,0.5);
box-shadow: 5px 5px 5px rgba(0,0,0,0.5);
width:170px;
}
.subscribe-arrow-expand {
width: 0;
height: 0;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-top: 5px solid #333; /* Color de la flecha */
float: right;
margin-top: 6px;
}
.subscribe-arrow-collapse {
width: 0;
height: 0;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-bottom: 5px solid #333; /* Color de la flecha */
float: right;
margin-top: 6px;
}
.subscribe-add-bubble-wrapper {
float: left;
margin-right: 10px;
padding-top: 2px;
}
.subscribe-add-bubble {
background: #444; /* Color del ícono dentro de los enlaces */
font-size: 8px;
padding: 3px;
border-radius: 2px;
-khtml-border-radius: 2px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
-moz-box-shadow: 1px 1px 1px rgba(0,0,0,0.5);
-webkit-box-shadow: 1px 1px 1px rgba(0,0,0,0.5);
-khtml-box-shadow: 1px 1px 1px rgba(0,0,0,0.5);
box-shadow: 1px 1px 1px rgba(0,0,0,0.5);
}
.subscribe-add-bubble-arrow {
width: 0;
height: 0;
border-left: 3px solid transparent;
border-right: 3px solid transparent;
border-top: 3px solid #444; /* Color del ícono dentro de los enlaces */
margin-left: 2px;
}
.subscribe-add-platform {
border-radius: 3px;
-khtml-border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
line-height: 0.4;
background: #111; /* Color de fondo de los enlaces */
font-size: 12px;
margin: 4px 5px;
padding: 2px 3px;
}
.subscribe-add-platform:hover {
background: #333; /* Color de fondo de los enlaces al pasar el cursor */
}
.subscribe-add-platform a {
text-shadow: 1px 1px #000;
color:#F9F0D7; /* Color de los enlaces */
font-size:11px;
font-family:Verdana;
}
.subscribe-add-platform a:hover {
text-shadow: 1px 1px #000;
color:#FF8400; /* Color de los enlaces al pasar el cursor */
}
.subscribe-add-platform a:hover {
text-decoration: none;
}
.subscribe-via-email-wrapper {
margin: 8px 0 0 7px;
font-size: 1em;
}
.follow-by-email-address {
font-size: 11px;
background-color: #444; /* Color de fondo de la suscripción por correo */
padding:3px;
border: none;
color: #222; /* Color del texto "dirección de correo" */
width:120px;
}
.follow-by-email-submit {
font-size: 12px;
background-color: #000; /* Color del botón "Suscribir" */
border: 1px solid #000;
margin-left: -4px;
color: #999; /* Color del texto "Suscribir" */
padding:3px;
}
.follow-by-email-submit:hover {
background-color: #333; /* Color del botón "Suscribir" al pasar el cursor */
position: relative;
top: 1px;
left: 1px;
color: #FFF; /* Color del texto "Suscribir" al pasar el cursor */
}
Guarda los cambios y listo.
En color verde están las anotaciones a lo que corresponde cada área que se puede cambiar.

Recuerda que está hecho con CSS3, así que algunas características como el sombreado y los bordes redondeados no se verán en navegadores antiguos.

De esta forma el tradicional gadget de suscripción al feed puede verse más atractivo, funcional, y versátil.


132 comentarios en:

" Personalizar el gadget "Enlaces de Suscripción" de Blogger "

  1. Excelente...! Potro muchas gracias esta muy bueno, pues hace un tiempo quería tenerlo pero no me gustaba su diseño en que esta el gadget original...! De lo mejor...!

    Gracias Potro...! Siempre pones pones y cambias las cosas de manera que me sorprendes...! :)

    Saludos!

    ResponderEliminar
  2. Muchas gracias! Es muy interesante y puede que lo ponga en mi blog!

    ResponderEliminar
  3. wata bastante wapo me gusta mucho eres el amo :D

    ResponderEliminar
  4. Gracias ricardogot2010, aunque el mérito no es mío, yo sólo modifiqué algunas cosas, todo el trabajo es de XarDesigns :)
    Saludos!

    ResponderEliminar
  5. MaGoS RaDioMuSiC, gracias a ti por tu visita, buen inicio de semana!

    Lovix, habrá que considerarlo en caso de que no se tenga ningún gadget para el feed, al menos es una buena opción :)

    ResponderEliminar
  6. TheZorro, qué bueno que te ha gustado :)

    ResponderEliminar
  7. Haber si me puedes ayudar con algunos problemas de mi blog.

    El espacio entre los saltos de línea (enter) es demasiado grande, el tipo de letra del post no es Arial, y además está demasiado grande y alta. Lo quiero así como tú lo tienes, ahí cuando tengas tiempo me echas una mano.

    Aquí te dejo el ejemplo:
    http://americanistadechiapas.blogspot.com/2010/10/paul-marca-registrada.html

    Saludos

    ResponderEliminar
  8. hola muy buen aporte, oye sabrás algún truquito de HTLM para plantillas dinámicas o como poner lo d seguidores e tratado incluso en las propias entradas d poner un contador claro con el código pero ni ahí... buen gracias y buen día

    ResponderEliminar
  9. Hola Potro, coloque la caja flotante para invitar a suscribirse, me quedo bien instalada, el problema es que hice una prueba, cuando coloco el correo para enviar, me sale un mensaje que "esta entrada no tiene registrado correo electrónico" ahora bien, me metí en feed burner y active el blog de "Lideres Forever Aragua" que fue donde lo instalé, como sabes se instala un Wigged de SUSCRIPCIÓN, lo probé y quedo perfecto.
    Volviendo al cuadro flotante, intente colocar la dirección de feed burner así como indicas al final, pero no se cual debo colocar, coloque de varias maneras y ninguna funciono.. si es la dirección completa de mi blog, solo el nombre..o que!! me perdí.
    mira como quedó: www.lideresforeveraragua.blogspot.com
    Gracias

    ResponderEliminar
  10. Hola potro, necesito de tu ayuda, no me aparece el Gadget...!
    http://gospelradiolatina.blogspot.com/

    ResponderEliminar
  11. Pepée Pilato, la fuente sí es Arial. El espacio se ve más grande porque tienes dos saltos de línea.
    Revisa la Edición HTML de la entrada y verás ahí los saltos de línea dobles que tienes entre cada párrafo.
    Saludos.

    ResponderEliminar
  12. TutosLady Pink, en las plantillas de Vistas Dinámicas aún no se pueden poner gadgets. Quién sabe si más adelante Blogger permita esa opción, pero al menos por ahora no es posible hacerlo.
    Buen día para ti también.

    ResponderEliminar
  13. @Liderforever10, deja el comentario en esa entrada para no desviarnos del tema de este post y poderle dar el seguimiento adecuando.
    Cuando dejes el comentario en esa entrada pon la URL de feedburner que abriste para que pueda decirte qué es lo que debes poner en el código.

    Buen día!

    ResponderEliminar
  14. Muy bueno potro pero tengo una duda

    no tiene que ver con esta entrada

    mira potro ami me gustaria poner los comentarios de esta forma que no sea de la forma particular nose si se pueda fijate como este

    http://soydebarrio.com.do/v1/?p=92149#

    Donde dice Leave a Comment no la que de facebook para que no te ballas a equibocar

    ResponderEliminar
  15. Gracias potro , siempre poniendo cosas novedosas

    saludos

    ResponderEliminar
  16. Hola Hoover,

    Veo los estilos del gadget en la plantilla, pero no veo que esté añadido el gadget.
    Agrégalo, ya que esté ahí búscalo en la Edición HTML y cámbialo por el código que se indica en la entrada.

    Saludos!

    ResponderEliminar
  17. genial!!
    me ha encantado este gadget, desde ayer lo vi pero apenas hoy lo probe y quede facinada con el resultado, le he puesto colores rosados y se ve muy chick :)))
    besos potrito hermoso!!!

    ResponderEliminar
  18. Potro, fíjate que he tenido problemas con este truco. No sé si es porque nunca expandí los artilugios o he hecho otra cosa mal. Al no expandirlos nunca no me aparece el gadget de suscripción y al expandirlos desde el comienzo la plantilla no me la reconoce.

    Espero ansioso tu ayuda :D

    ResponderEliminar
  19. hola potro me ha encnatado este estilo para el gadget de "Enlaces de Suscripción" es una idea bastante original y asi mas personas le daran click ademas de que el porcedimiento este super explicado

    Me gustaria hacerte una pregunta q no va relacionada con este tema quisiera saber como pusiste el boton para compartir en twitter facebook y +1 que esta en la parte derecha d tu blog, se ve super increible. Ojala y nos lo pudieras compartir.

    Saludos y excelente trabajo con tu blog (por cierto ya vote por el en Premios 20Blogs).

    ResponderEliminar
  20. jangel, hay gestores de comentarios que puedes usar, pues el de Blogger no puede personalizarse de esa manera.
    El más común es Disqus, en la misma página de Disqus dice cómo instalarse.

    ResponderEliminar
  21. Omoshiroi Tv, gracias a ti por tu visita y por comentar :)

    ResponderEliminar
  22. Es justo que por vez primera me anime a escribirte, aunque ya debía haberlo hecho antes. Desde Euskadi te envío mis mejores deseos y mi mayor agradecimiento por la ayuda que encuentro en tu blog. ¡Felices Fiestas y buena entrada de año!

    ResponderEliminar
  23. ok y despues que le ponga el de Disqus podre tambien ponerle la la caja de comentarios de facebook?

    ResponderEliminar
  24. Gracias me quedo perfecto :D esta cosa de disqus

    ResponderEliminar
  25. Disculpa Potro primeramente felicitaciones por tu sitio.
    Con esto del 2012 pienso cambiar la plantilla de mi blog mas ahora con la nueva apariencia de blogger no veo donde pueda subirla U_U en plantillas solo aparecen las plantillas de blogger pero no veo alguna opcion de subir plantilla

    ResponderEliminar
  26. Vaya es lo que estaba buscando, y bien explicado, voy a ver si lo pongo. Y veo que participais en 20Blogs. Nosotros tambien, esperamos vuestro voto si os gusta el blog ^^ http://lablogoteca.20minutos.es/accesorios-de-moda-ecologicos-21981/0/
    Un saludo!
    MER

    ResponderEliminar
  27. elizaquiereamor, en colores rosas se ha de ver increíble, y con el gusto que tienes ya me imagino el resultado que debe ser fenomenal :)
    Gracias por los besos guapa, yo te mando otra ración de ellos :)

    ResponderEliminar
  28. Hola Principito,

    Debe ser sin expandir los artilugios. Pero primero haz esto, agrega el gadget normal, desde Elementos de la página > Añadir un gadget, ahí selecciona el gadget de suscripción y guarda los cambios.
    Mira si haciendo eso ya tienes el gadget normal, si es así continua con el procedimiento y con cada código que agregues da Vista Previa para asegurarte que ahí continúa el gadget.

    Saludos.

    ResponderEliminar
  29. *M.J*, muchas gracias :)
    Por supuesto que les voy a compartir el botón que tengo puesto en la parte inferior derecha del blog, ya está contemplado, será de las primeras entradas que se publiquen iniciando el año ;)
    ¡Saludos!

    ResponderEliminar
  30. Hola Potro:
    Mándame un correo quiero que veas una pagina muy muy interesante, sobre todo para ti.

    franciscoard@gmail.com

    Saludos

    ResponderEliminar
  31. Caray TeknoloTik, pues qué bueno que te has animado a comentar, este blog como cualquier otro se alimenta de ello :)
    Gracias por los buenos deseos y el agradecimiento. Que tengas un estupendo inicio de año :)

    ResponderEliminar
  32. Hola Neo Akira,

    En la nueva interfaz entra en Plantilla. Estando ahí verás arriba del lado derecho un botón que dice "Crear copia de seguridad/Restablecer", ahí es donde puedes subir la plantilla que tienes en tu ordenador.

    Saludos y gracias por las felicitaciones :)

    ResponderEliminar
  33. ÚniCo Complementos, ojalá le encuentres utilidad :)
    Saludos!

    ResponderEliminar
  34. Antes de nada, enhorabuena por tu puesto provisional en 20Blogs, estaba claro que serias uno de los primeros.
    He estado utilizando en mi blog la aplicación "http://www.woorank.com/" y me he dado cuenta que no tengo los "dublin core" ni "gzip" ¿ sabrías explicarme como insertar estos códigos en la plantilla?
    Gracias amigo y mucha suerte en los premios.

    ResponderEliminar
  35. FRANCISCO, en unos días más habilito el formulario de contacto para que podamos hablar ;)
    Saludos!

    ResponderEliminar
  36. Gracias hablandodetecnologia hoy,

    Los datos de Dublin Core se usan mayormente en documentos que se suben a la red, así que no es algo fundamental ni necesario para todos los sitios. Su uso es para recuperar datos de información de equis documento, por ejemplo, para saber quién es el autor del documento, quien posee los derechos, etc. Y aunque bien puede usarse en sitios Webs no es realmente necesario, en ese caso es mejor usar los metatags.

    Por su parte Gzip es un software que nosotros no podemos usar ya que no tenemos acceso al hosting de Blogger, pero igualmente no es forzosamente necesario.

    Saludos y mucha suerte en el concurso!

    ResponderEliminar
  37. hola potriño :) como elimino o quito los botones de compartir la entrada.. que vienen por defecto en todas las plantillas..ojala tengas alguna respuesta saludos.broo

    ResponderEliminar
  38. Todo lo que busco lo encuentro aqui, realmente sos bueno Gracias por los codigos y consejos . Feliz Año 2012 y a seguir jugando en blogger Salu2 :) de Peru ..

    ResponderEliminar
  39. Potro, como puedo hacer para tener el boton que tienes en la esquina de tu blog (Te gusta Ciudad Blogger?) Y SE DESPLIEGA y magia sale me gusta, google+, twittear ... me puedes ayudar q hago ?

    ResponderEliminar
  40. Hola Vendetta,

    ¿Te refieres a los botones de compartir de Blogger?
    Si es así entra en Elementos de la página o Diseño, haz click en Editar sobre Entradas del blog, ahí desmarca la casilla de los botones.

    Saludos.

    ResponderEliminar
  41. Jonathan, muchas gracias :) Qué bueno que todo lo que estés necesitando hasta ahora lo estés encontrando en este lugar.
    Ese botón es la próxima entrada, pero saldrá hasta que empiece el año, ya falta poquito ;)
    Feliz 2012!

    ResponderEliminar
  42. si potro ya lo hice pero el unico boton que desaparecio fue el de +1 los otros botones todavia siguen ojala me ayudes a eliminarlos o quitarlos..saludos :)

    ResponderEliminar
  43. Mira esta entrada para que veas qué código quitar:
    http://ciudadblogger.com/2010/06/botones-para-compartir-de-blogger.html

    ResponderEliminar
  44. Okey ! gracias x el dato estare atento :)

    ResponderEliminar
  45. Hola, mira estoy armando un nuevo blog y utilizo la plantilla (Google Plus, el detalle es lo siguiente cuando carga la pagina en IE8, sale (Listo pero con errores en la pagina) mira la imagen
    https://lh3.googleusercontent.com/-TMIyXfFFyds/Tv5zVPkgE_I/AAAAAAAAAG8/SnVkf3JBNPI/s556/Dibujo.jpg

    Con Firefox y Chrome no hay problemas..
    Entre al código fuente de la pagina en IE8 y me ubique en los (2) errores. Quizas en la plantilla hay codigos sobrantes o codigos abierto..
    bueno no soy experto en eso asi que acudo a ti.. Aqui esta el demo original de la plantilla: http://google-plus-blogger-template.blogspot.com/

    tambien en IE8 sale los (2) errores ..

    ResponderEliminar
  46. listo potro borrando un par de codigos lo solucione ..gracias por tu ayuda broo que tengas un prospero y feliz año nuevo y nos leemos el 2012 saludos :)

    ResponderEliminar
  47. Como no sé que codigos borrar , me sigue sin aparecer.
    Desaparece una vez elimino el codigo y lo sustituyo por el que me dices.
    Saludos
    blog pruebas:arrassaslot.blogspot.com

    ResponderEliminar
  48. Jonathan, tendrías que consultarle al autor de la plantilla porque no la conozco ni la he usado, pero, igual no le hagas mucho caso a esos mensajes de Internet Explorer, mientras el blog funcione y se vea bien no tienes de qué preocuparte. Ese navegador marca errores por todo.

    ResponderEliminar
  49. Dale..Gracias por la sugerencia

    ResponderEliminar
  50. Vendetta, feliz 2012 :)

    Priamo, disculpa, había un error en el primer código, copialo de nuevo, ya debe funcionar.

    ResponderEliminar
  51. Mmm... pues yo no lo veo como la tuya, sobretodo por la letra "a", que parece estar deformada en mis posts :S

    Y ya pronto sacarás el post sobre los botones que tienes abajo a la derecha?

    Gracias Potro. Saludos.

    ResponderEliminar
  52. Ambas son iguales, sólo varía el tamaño y color de la fuente.
    El post de los botones es el siguiente :)

    ResponderEliminar
  53. Estoy terminando de configurar mi nueva plantilla y me gustaría tener el mismo sistema que el que tu tienes, es decir, colocar un menú despegable con Redes Sociales y que desde ahí el cliente elija si por email, facebook, etc.
    Gracias
    Un saludo

    ResponderEliminar
    Respuestas
    1. Hola Cristina, el menú que yo tengo todavía no lo tengo listo para publicar, aunque sí está contemplado. Será después que haga una entrada sobre ese tema.
      Saludos.

      Eliminar
  54. Gracias, estaré pendiente de la publicación.
    Un saludo

    ResponderEliminar
  55. Hola Potro.
    Otra vez me paso por tu blog buscando mejorar el mio :D
    Pero tuve un problemita al poner este gadget; como puedo cambiar el color de la letra de donde dice entradas y comentarios? y ademas como puedo ponerle un borde alrededor como en la versión original? ya que por el fondo de mi blog no se ve.

    Aqui te dejo el link para que veas.
    http://www.arteentorno.com/

    Gracias!

    ResponderEliminar
    Respuestas
    1. Hola victorache,

      Para cambiar el color a los textos de "Entradas" y "Comentarios" agrega en esos estilos esto:
      .subscribe {
      color:#000;
      }

      Ese será el color de esos textos.
      En esta versión no se recomienda poner borde, porque si se le pone, entonces al expandirse se ve mal.
      Si aun así deseas hacerlo, tendrás que añadir esto:
      div.subscribe {
      border:1px solid #000;
      }

      Eliminar
  56. Potro y como hago para poner a funcionar la caja de suscribir, no se como hacer para incluir la URL de feedburner de suscripción por email.

    ResponderEliminar
    Respuestas
    1. Mira esta entrada, ahí verás cómo activar la suscripción por correo:
      http://ciudadblogger.com/2011/05/crear-un-feed-en-feedburner-y.html

      Eliminar
    2. Creo que entendiste mal, yo ya tengo mi cuenta de feedburner activa y configurada lo que quiero hacer es que cuando un usuario ingrese su email en el campo de suscribir y le de click posteriormente a suscribir lo manda aquí: http://feedburner.google.com/fb/a/mailverify?uri=vectorfolio

      Este es mi blog donde incluí el gadget: www.vectores.vectotfolio.com

      desde ya gracias por tu ayuda.

      Eliminar
    3. Disculpa ingrese mal la dirección de mi blog:
      http://www.vectores.vectorfolio.com/

      Eliminar
    4. Bien, bien. Ya corregí el código de la entrada, copia de nuevo el primer código, el que se reemplaza, ahí verás en color rojo dónde debes poner el nombre de tu feed, que en tu caso será vectorfolio

      Eliminar
  57. Gracias !!! Muy bueno es el primero que me funciona

    ResponderEliminar
  58. Hola! Gracias por el dato. Tengo un problema, que es que la plantilla me corta los enlaces de suscripción cuando los abro... Sólo se ven hasta donde termina el widget cuando se abre la pestaña. No sé donde ni como modificarlo...

    Otra pregunta... ¿Se puede usar el Menu vertical tipo acordeón para este widget? Digo sin usar un widget HTML/Javascript, usando el mismo Feeds.

    ResponderEliminar
  59. mi blog es html://pachyxproducciones.blosgpot.com

    ResponderEliminar
    Respuestas
    1. Hola sir Ferdinand ofPadua. No sé si he entendido bien, porque al menos desde Chrome al expandir el enlace de suscripción se muestra completamente.
      Lo del menú tipo acordeón sí, sólo tienes que agregar ahí los enlaces que quieres; si quieres agregar los mismos de este gadget, haz click con el botón derecho sobre cada enlace y copia ese enlace, ese es el que deberías de poner como URL en el menú.

      Saludos.

      Eliminar
  60. Hola El Potro! Gracias por responder! Creo que es algun tema de la plantilla, porque me pasa en todos los navegadores. De hecho, uso Chrome y tambien me pasa... Se me ocurrió agregar espacio en la parte inferior del gadget para que no se corte con margin-bottom pero no ocurre nada, no me responde.
    ¿Podra ser que la plantilla tenga algun orden de superposicion de elementos?

    ResponderEliminar
    Respuestas
    1. Puede ser, pero podría solucionarse si agregas una altura al gadget. Pon esto en los estilos:
      #Subscribe1 {
      height: 230px;
      }

      Eliminar
    2. Genial anduvo!! Suscribe1 era... yo ponia suscribe-wrapper, por eso no me lo tomaba... Eso pasa por tocar de oído jajaja. Gracias!!!

      Eliminar
  61. Estimado, parece que después de poner todos los códigos como señalas, y abrir la cuenta Feedburner coloco donde dices EL NOMBRE DE MI FEED (http://feeds.feedburner.com/VeredasdeSiempre)guardo, cierro y cuando quiero probar sale este error "La alimentación no tiene suscripciones por correo electrónico habilitado" se nota primero o que no gestioné bien mi Feed o algo estoy poniendo equivocado. Podrías ayudarme? mi blog es [ http://veredasdesiempre.blogspot.com/ ] recién lo estoy empezando y como verás, lo quiero dejar impecable. Supe programar en Clipper pero no me doy con estos códigos.- Gracias y espero tus comentarios a huskyuy@gmail.com si lo consideras pertinente.-

    ResponderEliminar
    Respuestas
    1. Hola ELSACERDOTE2011, el nombre de tu feed no es la URL, sino únicamente el nombre, en este caso es:
      VeredasdeSiempre

      Saludos.

      Eliminar
  62. Hola "El Potro" estuve viendo tu comentario y cambié como dijiste y quedó así :

    uri=VeredasdeSiempre\

    input name='uri' type='hidden' value='VeredasdeSiempre'/>



    y de todas formas sigue saliendo esta ventana :

    "La alimentación no tiene suscripciones por correo electrónico habilitado"

    Revisé el Feed y me parece que está bien creado, pero sin reconocer la cuenta.

    ESCUCHO SUGERENCIAS. YA ESTOY POR CLAUDICAR.

    Disculpa las molestias, te dejo un abrazo y muchas gracias por todo.

    ResponderEliminar
    Respuestas
    1. ¿Pero sí tienes habilitada la opción de suscripción por correo en Feedburner? Porque si pruebas con el nombre de mi feed verás que sí funciona, por lo que me hace pensar que el problema está en que no tienes activada esa opción.

      Eliminar
  63. GENIOOOOOO..... IDOLOOOOO!!!! soy un pasmado, pero como dice mi señora "HAY QUE LEER TODOOOO!!!" Ya que estás vestido (como decimos en Uruguay) tendrás algo como para comentarios (pero no de Entrada) los diarios que en realidad terminan siendo como chat que van generalmente en un lateral del blog. Y el de PARTICIPAR EN ESTE SITIO?
    Te dejo un fuerte abrazo y disculpa la lata, pero "si viste mi blog" pretendo que sea la imagen para hacer 6 más con las temáticas que puse en el menú (lo saqué de Vagabundia)debajo de la imagen.-
    Hasta tus comentarios o cuando dispongas.

    ResponderEliminar
    Respuestas
    1. Me temía que era eso :)
      ¿A cuáles comentarios te refieres?

      Eliminar
  64. En lugar de hacerlo así de esta forma EN CADA ENTRADA, tenerlo en un lateral (derecho) dentro de un gadget, pero más pequeño que este.
    Espero comentarios. Gracias

    ResponderEliminar
    Respuestas
    1. Este gadget no va en las entradas, sino en la sidebar, de hecho en las entradas no podría funcionar. Sólo puede usarse tal como se indica, usando el gadget original de Blogger y luego aplicar las modificaciones.

      Eliminar
  65. no me anda, sigo a la perfeccion (o eso creo) los pasos, del potro ¿me puedes ayudar? este es mi blog: http://vivamundogaturroapps.blogspot.com.ar/

    ResponderEliminar
    Respuestas
    1. ¿Y el último código dónde lo has puesto?

      Eliminar
    2. arriba de ]]>, se que es allí porque, vista desde arriba, es la primera vez que se ven todos los elementos pegados a la columna izquierda (sin espacio)

      Eliminar
    3. En el blog no veo el último código, es por eso que te pregunto por él, porque no se ve colocado.

      Eliminar
    4. publique un comentario en vez de responder, perdon

      Eliminar
  66. no, mi problema no es que no se muestra, es que google no la guarda correctamente (he probado en muchas pc)

    ResponderEliminar
    Respuestas
    1. Por eso, a lo que yo me refiero es que si entro a tu blog, miro en el código fuente y veo que el código de los estilos no está colocado, y si el código no está puesto entonces el gadget no se verá como el ejemplo.
      Por lo tanto, asegúrate que tengas absolutamente todos los códigos que están en la entrada.

      Eliminar
  67. Hola, una pregunta sobre algo que no me ha quedado claro sobre el los feeds es si sabes cómo me puedo suscribir directamente a un feed sin Suscripción por correo o sin el gadget de este artículo (o sea si puedo suscribirme por ejemplo desde FeedBurner)

    ResponderEliminar
    Respuestas
    1. Hola Sonia, si es un blog de Blogger entonces sólo ingresa a esta dirección:
      http://nombre-de-mi-blog.blogspot.com/feeds/posts/default

      Eso te llevará al feed del blog, ya sea que tenga Feedburner o no.
      Por cierto, que sea en un navegador como Firefox, ya que con Chrome sólo verás puros códigos.

      Eliminar
  68. Hola Potro, una pregunta: yo quiero que en mi blog aparezca el gadget de entradas atom pero en GRANDE como los de -add this-. Si bien al final de mi blog dice -Suscribirse a:Entradas (Atom)- que es lo mismo , pero yo busco algún gadget grande sobre esto y no lo encuentro. ¿Se puede crear uno o está y no lo encuentro? Gracias.

    ResponderEliminar
  69. Hola Potro tengo una duda:
    yo quiero agregar a mi blog un gadget grande o mediano de RSS o Atom, si bien abajo del blog dice -Suscribirse a: Entradas (Atom)- que es lo mismo pero quería saber si existe algo así pero en gadget como he visto en otros blogs, a lo mejor sí está y no lo encuentro. Gracias

    ResponderEliminar
    Respuestas
    1. Pues no sé qué tengas en mente exactamente. Lo que aparece al final del blog es un simple enlace al feed, por lo tanto puedes poner el enlace al feed de tu blog donde quieras, con los estilos que quieras, o con la imagen que quieras.

      Eliminar
  70. Kaixo Potro, es posible cambiar el texto:

    Entradas
    Comentarios

    El resto he podido cambiarlo, es para un blog en Euskera. Gracias

    ResponderEliminar
  71. HOLA OTRA VEZ ;D
    He estado buscando en tus entradas para que se suscriban para seguirme RSS y encontré MILES, pero cuando los quiero poner a funcionar NO APARECEN como está en las entradas. Por ej.: ENLACES DE SUSCRIPCIÓN queda solamente el título ENTRADA y COMENTARIO, desplega el contenedor y dentro ESTA VACÍO, quise solucionarlo cambiando los colores y NADA y tampoco se veia el rectángulo de "Suscribe" donde se encuentra el Feedback.- CAMBIÉ EL NOMBRE DE LA PÁGINA YA QUE DEJA DE SER DE PRUEBA PARA SER DEFINITIVA. " http://elmundodecrochet.blogspot.com/
    El proyecto de esta entrada lo tengo funcionando en " http://porelmundodelcrochet.blogspot.com/" PERO EN LA PÁGINA ANTERIOR como dije sólo se ve los títulos Entrada y Comentarios y no se ve el recuadro de Suscribe para el Feed. Lo dejo puesto para que veas que no funciona.
    Espero tus comentarios. Abrazo

    ResponderEliminar
    Respuestas
    1. Hola de nuevo. El problema es que arriba del código de los estilos (el último código) tienes dos llaves de cierre repetidas y sólo debe haber una:
      }
      }

      Eso hace que los estilos no se apliquen, por eso ves que no se parece al del ejemplo, incluso, es posible que eso sea la causa por la que las flechas te desaparecían después de mostrarse.

      Eliminar
    2. SOLUCIONADO ESTE TEMA. Quité esa llave, pero de todas formas tuve que re-instalar todo el código, porque había desaparecido el código del final donde se ubica la suscripción por mail para el FEED. Si así como lo lees, HABÍA DESAPARECIDO. :( Revisando los códigos encontré ese VACÍO y grité "Y AHORA QUIEN PODRÁ DEFENDEEERME!!! Pero como no apareció el CHAPULÍN COLORADO, decidí recolocar TODO el código y quedó perfecto.
      De las flechas NAAA!!! Se te ha ocurrido algo? Abrazo

      Eliminar
    3. Qué bueno que ya está resuelto lo de este gadget, lo de las flechas ya no sé qué más se le pueda hacer, ando perdido :(

      Eliminar
    4. Si vos andas perdido, imagínate yo como si fuera una bola de un flipper, rebotando contra todo.- Mi teoría es el video que lo tapa, busqué colocar los códigos antes de head> o después de head>. Después de /body>. No sé, ya a esa altura estaba como desesperado, porque sigo sin entender que al cargar el blog LO VEO este tuyo que está acá, a la derecha, y en cuanto arranca el video DESAPARECE y chau NADA.
      Ya que estamos, te cuento, voy a hacer PÁGINAS ESTATICAS para mostrar las revistas que te comentaba en EL MUNDO DE CROCHET. El punto es que la página me arrastra el video del blog, como puedo hacer para que sólo se vea allí y el resto de las páginas o entradas pueda dejar un fondo estático de una de las imágenes.
      Viste que lo mío es fácil, verdad? ;D
      Abrazo

      Eliminar
    5. Pues podrías encerrar el script del video en una condicional para que no se ejecute en las páginas:
      http://ciudadblogger.com/2010/03/condicionales-de-blogger.html

      Cualquier otra duda al respecto deja la pregunta allá para que no nos desviemos del tema de este post y le demos seguimiento a todo en donde corresponde ;)
      Un abrazo.

      Eliminar
    6. Lamento el error, discúlpame. :(

      Eliminar
  72. Hola mi estimado amigo. Estoy tratando de poner en http://kioscodecrochet.blogspot.com/ los "Enlaces de Suscripción" y no me están saliendo bien. Puedes verlo? No me estoy dando cuenta dónde está el error. Gracias, un abrazo.- ;D

    ResponderEliminar
  73. Creo que escribí acá, que no me funcionaba. YA LO HICE FUNCIONAR. Gracias y un abrazo ;)

    ResponderEliminar
  74. Este comentario ha sido eliminado por un administrador del blog.

    ResponderEliminar
    Respuestas
    1. Gracias a ti Marco, aunque tuve que eliminar el comentario por el aviso que está al final de la página.
      Pero lo dicho, gracias a ti :)

      Eliminar
  75. Muy buenas, mi duda es: ¿Cómo pongo solamente la opción de que se suscriban a mis entradas? Es que también viene para los comentarios, pero yo eso no lo quiero.

    Mi Blog: www.elbloginformatico.es

    ResponderEliminar
    Respuestas
    1. Potro, tengo una duda. En mi Blog los comentarios no tiene la opción de responderse. ¿Cómo pongo la opción de responder? Sé que no tiene que ver con este tema, pero no se donde te lo tengo que preguntar.

      Eliminar
    2. Hola Julio, mira esta entrada de Oloblogger:
      http://www.oloblogger.com/2012/01/insertar-respuestas-replies-blogger-en.html

      Eliminar
  76. Hola Potro.
    He intentado hacer lo que pones en esta entrada y no he podido ni añadir el gadget. Elijo en de "Enlaces de subscripción" y voy al blog. Lo único que me aparece es un gadget nuevo pero totalmente vacío, ni siquiera aparece el título de "subscribirse a".
    He visto que al seleccionar el tipo de gadget, la imágen es la misma que presentas en esta entrada pero en la que selecciono yo, además pone "disponible para vistas dinámicas". ¿Tiene algo que ver? Y si es así ¿cómo cambio el blog para que lo admita?

    ResponderEliminar
    Respuestas
    1. Hola Arandelas 281, ¿has verificado que tengas habilitado el feed del blog y que el blog sea público? porque si es el caso de alguno de los anteriores entonces nadie se podrá suscribir al feed y por lo tanto el gadget no se podrá mostrar.

      Eliminar
    2. El blog es privado y el feed está habilitado.
      Me gustaría que los que tienen acceso al blog recibiesen un email cada vez que haya una entrada nueva. ¿Si es privado no se puede hacer? ¿Solo puedo hacerlo añadiendo las direcciones de email de los miembros en "Configuración-Móviles y Correo electrónico-Enviar entradas por correo electrónico?

      Eliminar
    3. Si el blog es privado entonces el feed no puede funcionar porque no tiene acceso a él. Debe ser público para que puedas usar este tipo de herramientas.

      Eliminar
  77. Hola Potro que tal, es la primera vez que comento en tu blog... gracias por el aporte... me sirvió de muxo.. Puedo pedirte un favor... necesito tu ayuda... en mi blog intento poner entradas populares pero no me va el widget... solo sale el título... pero nada de imagenes y descripción... mi blog es http://dibujosparacolorearytrazar.blogspot.com

    Gracias por tu ayuda... :)

    ResponderEliminar
    Respuestas
    1. Hola Cristina, entré a tu blog pero no veo puesto el gadget, ponlo de nuevo para poder ver qué puede estar sucediendo.
      Saludos.

      Eliminar
  78. Hola, otra cuestion que me surge, he puesto el gadget normal de mail nin variación de ningún tipo.
    Cuando alguien se subscribe feedburner manda un mail para que lo confirmen, pueden mandar este mail en español o siempre es en ingles?

    Gracias por todo me eres de gran ayuda

    ResponderEliminar
    Respuestas
    1. Hola Jordi, entra a tu cuenta de Feedburner, da click en el nombre de tu blog, luego ve a Publicize > Email subscriptions > Communication Preferences, ahí modifica el mensaje al idioma que quieras, sólo no elimines esto:
      ${confirmlink}

      Eliminar
  79. otra cosa que queria preguntar en relacion al tema de las subscripciones, ¿hay alguna manera de que yo consiga los mails de los subscriptores para mandarles algun correo relacionado con el blog manualmente?
    podria hacerse o violaria alguna regla de google o algo?

    ResponderEliminar
    Respuestas
    1. Puedes hacerlo pero no creo que tus suscriptores se sientan muy cómodos sabiendo que tienes sus direcciones.
      Ahí mismo en Email Subscription > Subscription Management, verás hasta abajo un link para ver los detalles, ahí están las direcciones de ellos.

      Eliminar
  80. hola , tengo un blog de cocina dirigido para gente joven que se inicia y que quiere comer sano.esta teniendo exito con mis conocidos pero quisiera ampliarlo a mas bloggers pero no tengo ni idea de como puedo tener seguidores.Debo poner algun link en la pantalla ? me puedes aconsejar ?

    ResponderEliminar
    Respuestas
    1. Hola GEMMA, mira la sección de SEO, ahí hay varios temas que pueden ayudarte a posicionar un poco el blog y que te conozcan más.

      Eliminar
  81. tengo un problema cuando realizo lo que dices resulta que la plantilla completa cambia ._.

    ResponderEliminar
    Respuestas
    1. Es posible que al poner el último código (el de los estilos) estés eliminando por error otro código, o un caracter.

      Eliminar
  82. hola me podrias decir como pongo la caja de seguidores que tienes con las pestañas de facebook y google, la verdad es que no lo e podido encontrar en tu blog

    ResponderEliminar
    Respuestas
    1. Hola, este tengo yo:
      http://www.compartidisimo.com/2011/10/crear-una-seccion-con-pestanas-para.html

      Eliminar

Si tu blog contiene material protegido por derechos de autor habilita tu perfil y deja únicamente el nombre de tu blog, no dejes la dirección del mismo, de lo contrario el comentario será eliminado.

 
Ir Arriba Ir Abajo
I Ciudad Blogger