Fanbox de Facebook Flotante con efecto Deslizante

Aunque Facebook Slide Likebox es una extensión de Joomla también podemos usarlo en Blogger.

Se trata de un gadget que muestra una pestaña en un extremo del blog, y al pasar el cursor sobre ella aparece el fanbox de Facebook con un efecto deslizante. Puedes verlo en esta misma entrada, se encuentra en el lado derecho de la ventana.

El gadget funciona con jQuery que es el que le da ese efecto deslizante, así que usaremos ese script, un poco de CSS y el FanBox de Facebook.

Mixpod Reproductor iPod para tu Blog

Con Mixpod podrás agregar música a tu blog. Mixpod te ofrece la posibilidad de crear un un reproductor con tu música favorita. demás ofrece una variedad de modelos de reproductores de música.
No es necesario tener una cuenta, pero sería bueno que crearas una para poder tener control sobre las listas de música que crees.

Bien, para crear tu Playlist, sigue los siguientes pasos.

♠ Del menú, has click en "Create Playlist"
♠ Luego, sigue los pasos que te indican: 
» En "Add music" selecciona la música que quieras agregar a tu reproductor de música y das clik en el símbolo "+" que aparece al lado de cada canción.
» En "Customize" podrás escoger el modelo de reproductor de música.
» Finalmente, en "Save Playlist", deberás llenar algunos datos (como el nombre de la lista, etc) al final , das click en "Save (get code)" y podrás pegar en tu sidebar (como nuevo elemento HTML) el código que genere.

Corazon Volando en tu Blog

Ya casi empieza el mes de febrero,el mes del amor y la amistad y como hay mucho bloguero enamorado que mejor forma de expresarlo que decorando el blog para la ocasion.

El resultado del truco lo puedes ver este blog de pruebas.

Botones Sociales de Taringa para Tu Blog

Taringa! es una Red social de mucho Exito en la Cual se uno puede hacer Post

y Que otros la Comenten y es una Pagina de mucha Envidia para cualquiera.

ESTOS SON LOS ESTILOS DE LOS BOTONES:

Barra de Redes Sociales y Con Chat para Blog

Quizas muchos hallan visto en algunas paginas webs una curiosas barras en la parte inferior que ofrecen muchos servicios desde chats,compartir las entradas en redes sociales,juegos,contador de visitas online,traductores y otros pues bien este servicio es ofrecido por Wibiya y hoy lo traigo para ustedes.

Mostrar Cantidad de Seguidores en Twitter

En nuestra web podemos mostrar la cantidad de Seguidores de nuestra cuenta Twitter de forma textual o animada.

Puedes enviar a tus visitantes a la página donde se muestran tus seguidores, incluyendo su enlace e imagen además si tu a su ves los sigues a ellos.

Para dirigirse a la página solo basta con agregarle “/followers” al final de la URL de nuestra cuenta, por ejemplo: En nuestro caso sería: http://twitter.com/webmastercv/followers

Sigueme en Twitter "Pagaro Volando Por la Web"

Se trata del ave de twitter que vuela por nuestra web que al pasar el cursor sobre él se muestran 2 enlaces, uno para compartir el artículo que están viendo y otro el enlace hacia nuestra cuenta. En ocasiones podría ser molestoso por ello el pájaro tiene algo interesante; Si por ejemplo esta leyendo algún artículo y no te deja leer con tranquilidad, siemplemente mueves el cursor por encima de él y se desplazará volando a otro lugar (impresionante!!).

Usamos el siguiente código:

1 2 3 4 5

<div class="n"> <script src="http://espacioforos.miarroba.st/1904764/cybervicio.js" type="text/javascript"> </script><script type="text/javascript">    var birdSprite='http://espacioforos.miarroba.st/1904764/birdsprite.png';var targetElems=new Array('img','hr','table','td','div','input','textarea','button','select','ul','ol','li','h1','h2','h3','h4','p','code','object','a','b','strong','span');var twitterAccount = 'http://twitter.com/AQUI URL';var twitterThisText ='';tripleflapInit();   </script> </div>

• DONDE DICE 'http://twitter.com/AQUI URL CAMBIALO por tu cuenta en twitter
• Si quieres que el pájaro aparezca en todas las páginas inserta el código en la sidebar o antes de /body

Boton Flotante de Twitter con modo de Cerrar

 En la entrada anterior hablabamos de como poner el botón “Me Gusta” de Facebook Flotante con Opción Cerrar, ahora instalaremos el botón Seguir en Twitter Flotante y con opción cerrar, asi nuestros visitantes con un siempre clic se harán seguidores en Twitter.

Caja de Comentarios De Facebook en Tu Web

La caja de comentarios de Facebook a sufrido cambios últimamente, uno de ellos es que ahora ya no se necesita crear una aplicación, solo es necesario poner la URL de nuestra web y ya lo tenemos funcionando.

Boton Flotante "Me Gusta de Facebook" con Opcion de Cerrar

Hace poco publicamos el código para poner el botón flotante de Facebook asi nuestros visitantes se podían hacer fan de nuestra web fácilmente, esta ves te traemos el mismo botón pero con algunas mejoras, le añadimos la opción Cerrar, asi si a nuestro visitante le molesta el botón flotante pueda cerrarlo.

Crear un Chat estilo Facebook Facil...

Si te gusta el estilo del Chat de Facebook y te gustaría integrar en tu sitio web uno parecido, podemos crear un chat gratuito en Envolve.Com. En esta oportunidad te vamos a guiar paso a paso como crear el chat y como instalarlo en tu web.

Boton +1 de Google en tu Blog

Google hace poco lanzó el botón “+1” el cual vamos a insertar en Blogger, WordPress, Jimdo…Que tiene algo de parecido al botón “me gusta” de facebook, pero éste botón de Google tiene algo interesante para los webmasters.

El botón “+1″ permite recomendar contenidos de nuestro blog/web como también nos ayuda a una mejor posición en el buscador (Google). Para que puedan recomendar es necesario tener un perfil público en tu cuenta Google.

Vamos a instalar el botón en nuestra web

En Blogger

Nos dirigimos a “Diseño” >> “Edición de HTML” y le damos “Expandir plantillas de artilugios”  (recomendamos descargar una copia de la plantilla por seguridad). En el HTML de la plantilla buscamos “</head>” y justo antes insertamos el siguiente código:

1 2 3

<script type="text/javascript" src="https://apis.google.com/js/plusone.js">  {lang: 'es'} </script>

Ahora buscamos la siguiente línea: <div class=’post-footer-line post-footer-line-1′ y luego insertamos el siguiente código:

1	<g:plusone expr:href='data:post.url' size='medium'/>

Si no te funciona con eso, en algunas plantillas tienes que insertar el código despues de:

• <b:include data=”post” name=”shareButtons”>         o
• <data:post.body/>

En WordPress

Vamos a insertar el siguiente código en “header.php” justo antes de “</head>”

1 2 3

<script type="text/javascript" src="http://apis.google.com/js/plusone.js">   {lang: 'es'} </script>

Ahora Pegamos el siguiente código en el loop de “index.php” y en “single.php”, en el lugar elegido para que se muestre.

1	<g:plusone size="tall" href="the_permalink()"></g:plusone>

En Jimdo

Ya que el código generado por Google no nos funciona, vamos a tener que agregarle unas cuantas líneas de código para que ya nos funciona.

Para instalar el botón en tu web Jimdo solo inserta el siguiente código mediante el elemento“Widget/HTML”:

1 2 3 4 5

<script type="text/javascript" src="http://apis.google.com/js/plusone.js"> {lang: 'es'}</script><script type="text/javascript"> //<![CDATA[ document.write('<g:plusone size="medium"/>'); //]]> </script>

Hay 4 modelos / tamaños del botón, y vas a reemplazarlo en: size=”medium“/>, veamos:

• small
• medium
• Estándart ; en este caso van a quitar del código “size=”medium”
• tall

Botones para Compartir flotantes en tu Blog o Web

Usando CSS podemos poner elementos flotantes en nuestra web como indicamos en un artículo pasado. En esta oportunidad vamos a poner los botones compartir flotantes en nuestro blog.

Vamos a usar el servicio de Sharethis para nuestros botones compartir, lo usamos porque tendremos la capacidad de poner varios botones con unos simples códigos y sin problemas. También usaremos tablas para mantener alineados nuestros botones.