Mega FB Man, un gadget juguetón para compartir en Facebook | Oloblogger Supongo que muchos recordaréis ese pájaro que se paseaba erráticamente por una página y que permitía enviar un tweet con la dirección visit...

28 de marzo de 2012

Mega FB Man, un gadget juguetón para compartir en Facebook

Mega FB Man
Supongo que muchos recordaréis ese pájaro que se paseaba erráticamente por una página y que permitía enviar un tweet con la dirección visitada al pinchar en él. Pues modificando un poco el código y -sobre todo- el sprite que lo acompañaba, he conseguido que ese bicho se convierta ahora en MegaMan y que sus funciones se puedan aplicar a Facebook. Es por eso que lo he bautizado como Mega FB Man.


Mega FB Man
Mega FB Man
El muñequito estará siempre visible en la página y cuando se haga scroll y desaparezca, bajará o subirá por ella hasta quedar otra vez dentro de la ventana visual.

Cuando se hace hover sobre él, un par de mensajes con las leyendas "Compartir" y "Seguir" aparecen para que el usuario pueda enviar el enlace a su cuenta de Facebook o para que pueda acceder a tu página y pinchar en el "Me gusta" si le place.

Cuando Mega FB Man se sitúa en algún lugar que molesta para la lectura o visión de alguna imagen, sólo hay que agitarlo un poco con el puntero y cambiará de posición.


La cosa no tiene mucha ciencia, ya que el efecto visual corre a cargo de la imagen que sirve de base para las distintas secuencias de la animación y todo lo demás lo hace el código JavaScript. De esta manera, lo único que hay que hacer para que funcione en tu página es copiar el siguiente código en un nuevo gadget y cambiar la dirección marcada en verde por la de tu página en Facebook:

<script src="https://googledrive.com/host/0B3b6MFUtZc42TTZXTldEdlV0VVk" type="text/javascript"></script>
<script type="text/javascript">
var birdSprite='http://1.bp.blogspot.com/-pMGbr2OQ3Zo/VBsa8fL0v-I/AAAAAAAARN4/CBmO5czECfo/s1600/megamanfb96.gif';
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 facebookAccount = 'http://www.facebook.com/oloblogger';
tripleflapInit();
</script>


De todas formas, si hay algún perezoso por ahí, también puede usar este formulario para que el gadget se instale automáticamente en su web. Sólo hay que teclear el nombre de la página o completar la dirección del perfil de facebook y pulsar en Añadir a Blogger. Esta nuestra plataforma hará el resto.




http://www.facebook.com/


Añadir a Blogger

Si tienes varios blogs, no olvides seleccionar aquel en el que quieras instalarlo cuando accedas a la utilidad Añadir elemento de página.

¿Vemos otro post al azar por si le encuentras utilidad o quizás prefieres ser más metódico y suscribirte a nuestras entradas por correo? También puedes imprimir este artículo y por supuesto compartirlo en redes sociales si fue de tu agrado.

Compartir
Copy URL

Y muchos más artículos interesantes si nos sigues en...

follow us in feedly

61 comentarios :

  1. Excelente aporte Oloman,sos grande hermano.

    ResponderEliminar
  2. Excelente blogg.

    Una preguntita: No exitiría un "bicho" así para el "me gusta" de Facebook o el Google+1 ???

    ResponderEliminar
    Respuestas
    1. Para el +1 no sabría pero creo que sería fácil modificar el script para convertir ese "seguir" en un "me gusta".

      Eliminar
  3. Wow!!!! Mega Oloman... jajaj esto tiene buena pinta jaja te felicito.

    ResponderEliminar
  4. Oloblogger Hola, esta idea es buena, pero no funciona del todo, porque cuando las persona hace clic en el nombre vuelve a dirigir su página y no la nuestra.
    Si hace clic en la carta abierta mi página de Facebook, pero si hace clic en su muñeca se abre.

    ResponderEliminar
    Respuestas
    1. Es una "licencia del autor" para que otros que lo vean puedan conseguir el gadget (Get this gadget). Lo que sirve para enviar un post o acceder a la página facebook son los textos que aparecen al poner el puntero sobre él.

      Eliminar
  5. Jaja, te has volado la barda amigo Oloman. Muy bueno eh =)

    ResponderEliminar
    Respuestas
    1. Si muy bueno pero si hace clic en la carta abierta mi página de Facebook, pero si hace clic en su muñeca se abre.

      Eliminar
  6. Te quedo de lujo, de veras :D

    Te felicito Oloman, muy bueno!

    ResponderEliminar
  7. Eres un monstruo! Esto abre un mundo de posibilidades.
    Nadie se atreve a hacer un Imp del Doom para Google+? hahaha

    ResponderEliminar
    Respuestas
    1. ¡Claro que sí! ¿Cuánto estás dispuesto a pagar? XD
      Es broma. Es que no puedo llegar a ese nivel de personalización. Seguro que cada uno quiere su propio muñequito ;)

      Eliminar
  8. Es muy bueno!!!
    Jajajaj te felicito por la creatividad.

    ResponderEliminar
    Respuestas
    1. Por cierto noto que este gadget y el del pajarito de twitter no son compatibles si estan colocados simultaneamente, es posible corregir esto?

      Eliminar
    2. Es posible, pero ¿cómo vas a poner tanto monigote? Quizás lo mejor sería uno solo para ambos servicios, aunque no se deberían poner tantas opciones. Es decir, no me parece conveniente un gadget para twittear post, seguir en Twitter, compartir post y seguir en Facebook. Además ¿terminamos ahí o seguimos con G+, Tuenti, etc.?

      Eliminar
    3. Si, es cierto. Quizas lo más conveniente sea poner los dos servicios en un solo gadget.
      Además, solo con esos dos me alcanza jajaja

      Eliminar
  9. conozco a mas de uno que le encantara esto, contandome a mi se va de una.

    ResponderEliminar
  10. Gracias por el aporte, mantienes una página genial.
    Me gustaría saber como cambiar la url de redireccionamiento a su página cuando clicas en el muñeco.
    Gracias de todos modos y un saludo.

    ResponderEliminar
    Respuestas
    1. Edita el script y cambia la URL de esta línea por la que quieras
      theBird.setAttribute("href","http://goo.gl/PQWc9");

      Pero siempre es de agradecer un enlace por el curro ;)

      Eliminar
  11. excelente el aporte, no sabes cuanto te agradezco pues mi blog practicamente lo he construido a costa tuya,
    poniendole un poco de atencion he podido cambiar el megaman por otra animacion que, y tambien agregarle el me gusta, es bastante util, y si, quite el enlace a tu blog, pero estaba de mas pues siempre has tenido un enlace en mi blog

    ResponderEliminar
    Respuestas
    1. Es sencillo hacer esas cosas. Si las hice yo, imagínate :)

      Y ya he visto que tienes algunas de mis cosicas instaladas en tu blog y también que formo parte de tu blogroll. Gracias.

      Eliminar
  12. Hola Oloman no se lo que hago mal, pero no me funciona ni en manual, ni automático

    ResponderEliminar
  13. Hola se que no tiene nada que ver con esta entrada. Pero soy una bloguera novata no, lo siguiente.
    He subido una entrada que me aparece con fondo blanco,como si estuviera con subrayado. Como lo quito ??? lo he pasado a word otra vez para quitarle el subrayado pero no tenía.
    Echame una mano!! Gracias por algunas de tus ideas, seguiré copiandote ideas... :-)
    Este es mi blog:
    http://delahuertaalplato.blogspot.com.es/

    ResponderEliminar
    Respuestas
    1. Hola. Edita esa entrada y busca un span que tiene esto: style="background-color: white;" y lo eliminas (ese texto exactamente).

      Y para los próximos no utilices Word, que a menudo mete cosas raras cuando lo copias en Blogger. Mejor usar un simple NotePad.

      Eliminar
  14. muchiiisimas graciasss , eres un crack y yo muyy torpee jeje , tu blog estará entre mis favoritoos!!

    ResponderEliminar
  15. grasias pero tuve que asel unas modificasiones https://dl-web.dropbox.com/get/vmGm.html?w=c63027c4

    ResponderEliminar
    Respuestas
    1. No sé a qué te refieres. Ese enlace no es accesible.

      Eliminar
  16. osea hola me encanta el blog pero tengo un problema click en el megaman y me trae a tu bog no me lleva a mmi fbk.. y ya lo cambie como indicaste.. q podra ser???

    ResponderEliminar
    Respuestas
    1. No es un problema, es que "Compartir" y "Seguir" son los enlaces para tu página y el del muñequito trae a esta para el que lo quiera conseguir ("Get this"). Si quieres que no pase eso descarga el script, busca esta dirección en él "http://goo.gl/PQWc9" la cambias por la que quieras y luego lo alojas en tu DropBox y sustituyes la dirección por la tuya.

      Eliminar
  17. Hola, fue muy sencillo hacer funcionar a mega man :) pero, no es posible que el pajaro de twitter funcione en simultaneo con este? Gracias. :D

    ResponderEliminar
    Respuestas
    1. Pues no, porque realmente se trata del mismo código y sólo cambia la imagen, pero ¿cuántos cacharritos de estos vas a poner? Va a parecer un circo tu blog ;)

      Eliminar
  18. hola muy bueno tu blog gracias por todo. como puedo eliminar el Mega FB man? quiero cambiar la pagina del facebook y no sé como.

    ResponderEliminar
    Respuestas
    1. Sólo tienes que buscar el gadget dónde pusiste este código que se dice aquí y eliminarlo. Tendrás que buscar si no le pusiste título.

      Eliminar
  19. como le hago?????????????
    porfavor ayudenme haaaaaa

    ResponderEliminar
    Respuestas
    1. Está todo explicado en el post. Léelo despacio, sigue las instrucciones y no creo que tengas problemas.

      Eliminar
  20. perfecto esta muy vien FELICIDADES y gracias por el aporte si quieren verlo en mi web. www.gcmrevista.com.mx la acabo de terminar de editar y FB MEGAMAN va de maravilla.. saludos

    ResponderEliminar
  21. Veo que te gusta megaman xD... es una buena idea la que pusiste :3 , lastima que mi estilo del blog no cuadre con el muñequito xD, ;3 felicidades

    ResponderEliminar
    Respuestas
    1. Con algo de tiempo y un poco de habilidad con un editor de imagen, podrías crear tu propia mascosa. Sólo es cuestión de sustituir la imagen (sprite) que contiene las distintas secuencias.

      Eliminar
  22. Soy nueva y me gusta que tenga de todo , por ahora lo dejo que camine gatee y vuele en el blog,jjaja saludos.

    ResponderEliminar
  23. Una pregunta puedo yo editar la imagen y poner otra sustituyendo la imagen de man??

    http://dl.dropbox.com/u/57549161/scripts/facebook/megamanfb96.gif

    claro esta siguiendo los mismos patrones de esa misma, salu2 y de antemano muchas gracias por tomar tu tiempo en responder

    ResponderEliminar
  24. modificado para mi blog en wordpress buen aporte amigo gracias por compartir funciona a la perfeccion

    ResponderEliminar
  25. Siempre tienes buenas ideas, esta me ha hecho mucha gracia, yo soy un super fan de megaman :-)

    ResponderEliminar
    Respuestas
    1. Vale, te agradezco el piropo... ¡pero ni se te ocurra ponerlo en tu sitio! XD

      Eliminar
  26. Awesome dispatch! I am indeed getting apt to over this info, is truly neighborly my buddy. Likewise fantastic blog here among many of the costly info you acquire. Reserve up the beneficial process you are doing here. Feel free to visit my website; 토토사이트

    ResponderEliminar
  27. Thanks for sharing. I found a lot of interesting information here. A really good post, very thankful and hopeful that you will write many more posts like this one. Feel free to visit my website; 카지노사이트

    ResponderEliminar
  28. I have learn several good stuff here. Definitely worth bookmarking for revisiting. I surprise how so much effort you place to make this type of fantastic informative web site Feel free to visit my website; 카지노사이트

    ResponderEliminar
  29. Hi there, You have done an excellent job. I will certainly digg it and personally suggest to my friends. I am confident they will be benefited from this web site. Feel free to visit my website; 배트맨토토

    ResponderEliminar
  30. Thanks for sharing nice information with us. i like your post and all you share with us is up to date and quite informative, i would like to bookmark the page so i can come here again to read you, as you have done a wonderful job Feel free to visit my website; 카지노사이트

    ResponderEliminar
  31. I am a follower of your blog and I learnt a lot from you. Thank you. 카지노사이트

    ResponderEliminar
  32. When did it start? The day I started surfing the Internet to read articles related to . I've been fond of seeing various sites related to 카지노사이트 around the world for over 10 years. Among them, I saw your site writing articles related to and I am very satisfied.

    ResponderEliminar
  33. What a post I've been looking for! I'm very happy to finally read this post. 토토사이트 Thank you very much. Can I refer to your post on my website? Your post touched me a lot and helped me a lot. If you have any questions, please visit my site and read what kind of posts I am posting. I am sure it will be interesting.

    ResponderEliminar
  34. This article is very helpful and interesting too. Keep doing this in future. I will support you.
    바카라사이트

    ResponderEliminar
  35. Thanks for sharing this marvelous post. I m very pleased to read this article.
    바카라사이트

    ResponderEliminar
  36. Hi there, I enjoy reading all of your article.

    온라인경마

    ResponderEliminar
  37. great post really appreciable work. That will be valuable to everyone who uses it, including myself. Many thanks... 파친코사이트

    ResponderEliminar
  38. Hello, I enjoy reading all of your article post. I like to write a little comment to support you.
    토토

    ResponderEliminar
  39. It's a really interesting topic and it has helped me a lot. In fact, I also run a website with similar content to your posting. Please visit once 바카라검증사이트

    ResponderEliminar