Mostrando entradas con la etiqueta rss. Mostrar todas las entradas

Home rss

19 abril 2010

Añadir un recuadro de suscripcion al final de cada entrada

  Author : Unknown     6 comentarios
3:01

Un enlace de suscripcion en un blog, nunca esta demas, como lo dije ya antes en una anterior entrada, hoy te lo vuelvo a decir aqui. Hace mucho, observe en los grandes blogs, que casi todos tienen un enlace de suscripcion encerrado en un recuadro al final de cada entrada.

Jamas me pregunte como lo hicieron, me puse a trabajar en ellos hasta que logre hacer uno, que me quedo muy bonito, diria que mucho mejor a los que pude observar. Te mostrare como personalizar el codigo para que combine con los estilo de tu blog, este artilugio ira añadido al final de cada entrada es la pagina indivudual de cada una de ellas, si quieren ver una demostracion, pues ve a la pagina individual de esta entrada, y mirala.

[1] Los estilos CSS

#notas{
border: 1px dashed #33CC33;
padding: 15px;
text-align:center;
font-size:12px;
font-family: Comic Sans MS, Verdana;
}

.suscripcion {
background: transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimfQmgHJ-UUKKyTN5irTUyY1JNVMWdHZ-IBrtpdc2-DkGAQxs8gr1sMEnFtFmcc_eTsRiZ6VeXdQsNsu25kbusTCCEmCQ_pH3lf7cPQ87yCcODfQ4YwWLGajO_Luvs2cBhAZRduvtoTzQ/s1600/1271301025_rss.png) no-repeat center left;height:30px;
padding-left: 32px;
font-size:16px;
text-align:left;
}

Para entender el codigo


En Rojo: Es el grosor del borde.
En violeta: Es el color del borde.
En verde: Son las alineaciones de los textos (Center [Centrado], left [a la izquierda], right [a la derecha])
En Naranja: Es la fuente de la letra. Asegurate que si la cambiaras por una letra no determinada por Blogger, que el usuario posea esa letra en la memoria de su computador, de otra manera, no la reconocerá.
En Aquamarine: Es la imagen. Puedes sustituirla por la que tu quieras, como medida 32 x 32.

[2] El codigo HTML.

Publicado por
Leer completo

17 abril 2010

Agregar enlaces de suscripcion atractivos en tu sidebar

  Author : Unknown     1 comentario
3:01

Siempre lo he dicho y asi lo reiterare, los enlaces de suscripcion de un blog, nunca deben faltar en tu blog, si tienes por monton, siempre sera mucho mejor.


Que un usuario se suscriba a tu blog, es algo muy importante, tan importante como quemar tu feed en feedburner, mientras mas suscriptores tengas, mas pocisionamiento, ayuda a aumentar el pagerank de tu blog, y hacer que google te tome en cuenta a la hora de las busquedas, ya que hacer que un usuario se suscriba, demuestra a los robots cuan interesante y de calidad es el contenido publicado en tu blog.

Este widget, es igual al que ves en la imagen, pero esa es solo una previsualizacion de su apariencia, para verlo funcionando puedes visitar este blog de pruebas.

[1] Entra a Blogger > Diseño > Edicion HTML
[2] Buscar la etiqueta </head>
[3] Justo antes de esta, pegar el siguiente codigo

<style type='text/css'>

#hsection{border:4px solid #D3D3D3;background-color:#e9e9e9;}
#hsection:hover{border:4px solid #BABABA;background-color:#e9e9e9;}

#sectionmy .sectionmy2 h2.subscription { border:0; margin:0; padding:6px 0 0 55px; height:42px; font-size:16px;font-family:&quot;Segoe UI&quot;,Calibri,&quot;Myriad Pro&quot;,Myriad,&quot;Trebuchet MS&quot;,Helvetica,Arial,sans-serif;
font-weight:bold; }

#sectionmy .sectionmy2 h2.rss { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxnR6GupmgJiWUbMlhYskmf1pjXZTZWPoCz1mL278xM-RCdf6k3mwWShsT-H2di30bBtTpS9LvK5uxq7UzXyYubHsHub-1V4N0XVU_wXfESxgZjZY30Vi8EitarV1GYkBkqXRxOydm5nWJ/) no-repeat top left; }

#sectionmy .sectionmy2 h2.email { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJuk5GKB8n9VIa9UhnoeQ8wwtrcfQugtq2vXT1bpdD_8ghwiELJyKzs3xmMixedI36HdkzYQXk8QIJ-kSOtANHdihEipgg6G3RLs9UnnpErkwq57_S7KxxFHxN8IJCPHjfLmRo9F8JtmWv/) no-repeat top left; }

#sectionmy .sectionmy2 h2.twitter { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmD-Gln6ZmlUwwpSHKTg5_ucrFPYuyc_osHldFTu-MTxkkdWyNbHe5IvbQBqbQgHPyjMS4l_7Zjy2agRzDaRrpWiyJoDH5BV_MMMfMtX5co7vgKfcHp_eawTT3aa4fjBKvHohpEk0WW9fA/) no-repeat top left; }

#sectionmy .sectionmy2 .subscription a { color:#252e28; text-decoration:none; }

</style>

En VERDE: Es el grosor del borde
En NARANJA: Es el color del borde del recuadro
En VIOLETA: Es el color de fondo del recuadro
En AZUL: Es el color al que cambia el borde al color el mouse sobre el recuadro
En ROJO: Son las imagenes, puedes sustituirlas por las tuyas si quieres.

[4] Añade un nuevo gadget HTML/Javascript y pega el siguiente codigo.

Publicado por
Leer completo

21 marzo 2010

Formulario de Suscripción por correo electrónico equipado con enlace RSS feed

  Author : Unknown     2 comentarios
10:40

Desde hace mucho que queria hacer una publicacion sobre esto, por que todo Blogger que quiera tener mas visitas, y por supuesto ir ganando pocisionamiento mediante el numero de suscriptores, deberia tener un enlace a las Fuentes RSS, por eso es tan importante.

Ahora, sin perder mas el tiempo, permitame dar un paso adelante a explicar que debes hacer para añadir un hermoso formulario a la barra lateral del blog, así como el que se puede ver en la imagen, recuerda que nadie se niega a la personalización, así que te daré aquí algunas de las formas en la que podrías editar el CSS y HTML.

Antes de continuar, asegúrate de tener tu Feed quemado en FeedBurner.

Ahora, lo siguiente:

[1] Ir a Blogger > Diseño
[2] Haga clic en añadir un gadget
[3] Elija el tipo HTML/Javascript
[4] Dentro de este widget pega el siguiente código


<a href="http://feeds.feedburner.com/FrikiBloggeo" rel="alternate" title="Subscribe now to avail the unthinkable" type="application/rss+xml"><img border="0" alt="" style=" padding-bottom:20px; margin: 0pt 10px 10px 0pt; float: left; width:100px; height:100px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_A35GcIRKNBzhhqD_fDzYIhe9RCtQrD77ZFNyVWU9PknbYnofnppe4MYhSZjC9YuoFM7fC5wsWjvw-tORCSEgFn3JUImms_wGxKM3mlR8cMKzFviDzeNYkxPgeM4KRvKOnb1aIxMydegY/s400/MBT-RSS-FEED.gif"/></a><p><a href="http://feeds.feedburner.com/FrikiBloggeo" rel="alternate" title="Suscribete a mi feed" type="application/rss+xml">Recibe nuevas noticias! </a><span style="color: 5C6AA4 #; font-weight: bold;">Introduce tu correo electronico para recibir nuevas entradas cada dia a tu e-mail:</span></p>
<style>
input.mbt1 {
color:#fff;
font: bold 10px Arial, sans-serif;
background:#F39100;
border:0;
padding:3px;
}
input.mbt1hov {
color:#fff;
font: bold 10px Arial, sans-serif;
border:2px solid #F39100;
padding:3px;
}
</style>
<form action="http://feedburner.google.com/fb/a/mailverify" style="padding: 5px; " target="popupwindow" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=FrikiBloggeo', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><input style=" color:5C6AA4 #; background: #fff; border:1px solid 5C6AA4 #; width: 90px;" name="email" type="text"/><input value="Frikibloggeo" name="uri" type="hidden"/><input value="en_US" name="loc" type="hidden"/> <input onmouseover="this.className='mbt1 mbt1hov'" onmouseout="this.className='mbt1'" value="Suscribeme" class="mbt1" type="submit"/></form><br/>


Ahora, te muestro que cambios realizar para personalizar el widget.

Publicado por
Leer completo

14 octubre 2009

Eliminar el suscribirse a entradas Atom

  Author : Unknown     No hay comentarios
21:21

Podemos eliminar el texto Suscribirse a entradas Atom con un simple clikc.
Nos situamos en Plantilla/Opciones/Feed del Sitio.



Donde dice: Permitir feed del blog sustituimos Completo a Ninguno



» Si deseamos eliminar el texto de Suscribirse a entradas Atom sin prescindir de esta utilidad recomiendo esta segunda opción.



Debemos buscar en nuestra plantilla:



.feed-links {


clear: both;

line-height: 2.5em;

}


Y sustituirlo por lo siguiente:



.feed-links {


clear: both;

line-height: 2.5em;

visibility:hidden;

display:none;

}

Publicado por
Leer completo
Suscribirse a: Entradas ( Atom )