domingo, 26 de mayo de 2013

Como Crear Una Barra De Medios Sociales Para Tu Blog

Leave a Comment

No hay duda que, por anos Social Media ha probado ser el recurso mas prominente de trafico por anos a los websites. Sin Embargo eso no significa que el sitio web tenga el carisma o la chispa  para obtener el trafico de visitantes. 

La manera ideal  de tener exposicion social es convertir tus visitantes diarios en seguidores sociales. Ahora el problema es, como debemos convertirlos en nuestros Seguidores Sociales ?La Repuesta es bastante directa podemos utilizar algunos widgets de redes sociales  que guiara a los visitantes a las diferentes plataformas sociales i.e. Facebook, Twitter, YouTube, Google+  etc.Por esa razon, hemos creado otro widget paa los amantes de medios sociales. Hoy en este articulo, aprenderemos Como Crear Una Barra De Medio Social En Blogger?.

Que es una barra de Social Media ?

  1. Este es un widget que tiene 8 de los mas populares redes sociales integrados en forma de barra. Este flota a lo largo de la pantalla.Cuando, un visitante baja y sube la pagina este widget se movera con el. No es una ciencia detras de este widget por que todo es hecho con la ayuda modesta de jQuery.  Considere la siguiente toma pantalla y disfrute de la accion en vivo. 



Donde Podria Aparecer el Widget de Social Media Bar ?

Este es extremadamente  flexible, y lo podemos poner ya sea en Lado Izquierdo, Lado Derecho, y Arriba y aun Debajo.Pues, usamos jQuery.Sin embargo,tenemos que usar unos pocos comandos como “bottom”, “top”, “left” and “right” para mostrarlo en diferentes partes de nuestro website.Para aclarar mira la siguiente foto.



Como Anadir el Widget de Social Media Bar en Blogger?

Siga los simples pasos para implementarlo en tu blog.
Entra en Blogger.com >> Plantilla >> Editar HTML >> Proceda.

En la Plantilla busca la siguiente etiqueta </body> y justo arriba de esta pega el siguiente codigo. No cambies el codigo pues dejara de funcionar .
Nota:Si no puedes hallar la etiqueta </body> , puedes pegarlo debajo de etiqueta <body> . 



<!-- import Scripts -->
<script type="text/javascript" src="https://mybloggerlab.googlecode.com/files/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="https://mybloggerlab.googlecode.com/files/mblsocialbar.js"></script>
<div id="scolder">
<script type="text/javascript" src=" http://mbl-flipper-google-blogger.googlecode.com/files/socialflipmin.js"></script></div>
<link href='http://mybloggerlab.com/StyleSheet/mblsocialbar.css' rel='stylesheet' type='text/css'/>

<!-- MBL Social Media Bar For Blogger -->
<script type="text/javascript">
$(document).ready(function(){
$.mblSocialBar({
items: {
twitter: { url: '#', text: 'Follow me on twitter' },
facebook: { url: '#', text: 'Profile on facebook' },
rss: { url: '#', text: 'RSS Feed' },
google: { url: '#', text: 'Profile on google+' },
youtube: { url: '#', text: 'Profile on youtube' },
orkut: { url: '#', text: 'Profile on orkut' },
myspace: { url: '#', text: 'Profile on myspace' },
digg: { url: '#', text: 'Profile on digg' },

},
show: 8,
position: "left",
skin: "clear"
});

});
</script>



  • Anade URL: Reemplace todos los #  con tus URL de acuerdo a tu gusto.
  • Cambiar de Posicion:Para cambiar este widget de posicion reemplace “Left” por “right”, “top” o “bottom” en el codigo de acuerdo a como desees. Recuerda: No uses Letras Mayusculas pues podria dejar de funcionar.
  • Mostrar Menos Sitio Sociales:Para mostrar menos sitios sociales solo reemplace “8” con numeros menores tales como i.e. 7, 6, 5 y mostrara menos botones. Sin embargo, comenzara mostrando una flecha que permitira a los visitantes tener acceso a los sitios escondidos.  
  • Cambiar Fondo: Hemos anadido 2 temas  a esta barra de medios sociales  i.e. “claro” y “oscuro”.Pra cambiar el fondo del tema “claro” a oscuro solo reemplace claro a oscuro en el codigo de JavaScript. 
Todo LISTO: Despues de personalizartodo de acuerdo a sus necesidades , guarde la plantilla presionando el boton de “Guardar Plantilla” .Visita ahora tu sitio para que veas este nuevo widget en funcion.
If You Enjoyed This, Take 5 Seconds To Share It

0 comentarios:

Publicar un comentario