Todos sabemos que las Redes Sociales tienen un poder importante y ayuda aumentar su trafico.
Por eso en este tutorial veremos como crear un Gadget Pop-up
con tus Redes Sociales en el pie pagina. Una ves que el blog se valla desplazando hacia abajo mostrara un Pop-up con tus redes sociales

Comencemos: 

  • Paso 1: Vamos a Blogger>>Diseño>>Añadir un Gadget>>HTML/Javascript.
  • Paso 2: Dentro del Gadget pegamos el siguiente código HTML.
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> <script type="text/javascript">$(window).scroll(function(){if($(document).scrollTop()>=$(document).height()/4)$("#mbsocial").show("slow");else $("#mbsocial").hide("slow");});function closeMBsocial(){$('#mbsocial').remove();$.ajax({type:"POST",url:"/facebookpage.php"});}</script>
<style> #mbsocial{background:#f3f3f3;border-radius:9px;-moz-border-radius:9px;-webkit-border-radius:9px;-moz-box-shadow:inset 0 0 3px #333;-webkit-box-shadow:inset 0 0 3px #333;box-shadow:inner 0 0 3px #333;padding:12px 14px 12px 14px;width:300px;position:fixed;bottom:13px;right:2px;display:none;z-index:3;height:100px;} .getmore a{display: inline-block;font-weight: normal;text-decoration: none;font-size:9px;color:#333!important; float:right;} .getmore a:visited{ color:#ddd;}</style>   <div style="display: none;" id="mbsocial"> <a style="position:absolute;top:14px;right:10px;color:#555;font-size:10px;font-weight:bold;" href="javascript:void(0);" onclick="return closeMBsocial();">(X)</a> <span style="font-family: Verdana; font-size: 15px; margin: 10px 0; text-shadow: 1px 1px 0 #FFFFFF;font-weight:bold;color:#555;"> Síguenos con tus Redes Sociales!</span><br />
 <a href="LINK-PAGINA-FACEBOOK" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjL6zYC-ewYHTMazsNhahxmfeO_W29sgRB6Ban-4XP3xrBSyvFC2FeDIJH82BTQpyLBH9ItaUQ1D5oapskBSVegQMpB2-OO44Wplf-PvscLz26E25pwJwDCMIGeD6NyxRZD3eNWYJ1K426b/s1600/Facebook.png" height="72" /></a>
<a href="LINK-DE-TWITTER" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj4gjt0ofkvyept6JPwn7EQvGLWIpiyE9PksuED6w7lUgNONYBhbSaOsaeUXE3fqAIrBnT6d8i_5jMlkuXb2qAQFaxt1dbEDihzvsB5UQN2Nt193h5w4USVOIJQe5dkXWl33a6507ZXGiLH/s1600/Twitter.png" height="72" /></a>
<a href="LINK-ID-GOOGLEPLUS" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZvuR3D8lh2bIyJ8f7H6zbuXPbWx_tqC4XTh-EUW1L93mvSp4cV9bBHg8JNPbP6wQ1j56VVpheeWvU8IOBlo8rtf_5dr7apOxQj_-7O1G6YUVhUfWADEh6DOiGkugKCyKQxNsN8YKCb5EH/s1600/Google+Plus.png" height="72" /></a>
 <a href="http://www.tutoriales-blogger.info/" target="_blank">Instale este gadget</a> </div>
 <div class='clear'></div>

Nota:- Solo tendrias que cambiar los Link en ROJ por los de tus redes Sociales
- - 1 Comentarios
Tag

Comentarios (1)

:))
:((
:D
:(
:)
:-)
;)
=))
:p
=.=
==
^_^
/=he
:*
/=r
/=l
:v
/=ok
/=clap
(y)
(yy)
/=hi
/=j
/=hup
/=hd
/=hl
/=hr
/=s
<3

Instrucciones Para omentar

Incertar Enlace

Utilice el codigo <a href='LINK'> EJEMPLO </a>

Cargar Imagen

[img] LINK_ANH [/img] -Use el codigo para cargar una imagen.

Formato Word

<b> negrita </b>
<i> cursiva </i>
<u> texto subrayado </u>
<strike> texto tachado </strike>

Insertar un Fragmento de codigo

Primero use esta herramienta para codificar el codigo que quiera agregar.
Luego utilice el codigo [code] CODIGO HTML [/code]

Cerrar