Para quem tem conta no Instagran e gosta de comaprtilhar suas fotos, eis aqui um widget no formato dos outros widgets apresentados nas postagens anteriores. Suas fotos ficam ocultas na lateral do blog. Fácil de implementar mas é necessário além da conta no Instagran, abrir uma conta no site Web Instagran para que seu widget funcione. Depois copie o código abaixo colando em HTML/Javascript, em seguida, coloque o seu nick de usuário do Instagran e pronto.
 |
| Meus artesanatos, decorações e comidinhas... Conheça meu blog: Festa, Sabor e Decoração |
Agora clique em Layout
Ao abrir, clique em HTML/Javascript
Cole então o próximo código fazendo as modificações necessárias.
<!-- Widget do instagran -->
<style>
img, a {
border: 0;
}
#on {
visibility: visible;
}
#off {
visibility: hidden;
}
#instagran_div{
width: 400px;
height: 230px;
overflow: hidden;
}
#instagran_right {
z-index: 10004;
border: 6px solid #493830;
background-color: #D9D2C8;
width: 410px;
height: 220px;
position: fixed;
right: -430px;
}
#instagran_right_img {
position: absolute;
top: -2px;
left: -70px;
border: 0;
}
#instagran_left_img {
position: absolute;
top: -2px;
right: -70px;
border: 0;
}
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="http://apis.google.com/js/plusone.js" type="text/javascript"></script>
<script type="text/javascript">jQuery(document).ready(function ()
{ jQuery("").hover(function ()
{ jQuery(this).stop(true, false).animate({ right: 0 }, 500); }, function () { jQuery("").stop(true, false).animate({ right: -430 }, 500); }); jQuery("#instagran_right").hover(function () { jQuery(this).stop(true, false).animate({ right: 0 }, 500); }, function () { jQuery("#instagran_right").stop(true, false).animate({ right: -430 }, 500); }); jQuery("").hover(function () { jQuery(this).stop(true, false).animate({ right: 0 }, 500); }, function () { jQuery("").stop(true, false).animate(
{ right: -294 }, 500); });});</script><br /><div id="on"> <div id="" style="top: 12%;">
<div id="on">
<div id="instagran_right" style="top: 18%;">
<div id="instagran_div">
<img id="instagran_right_img" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhunrUYjB0Nb_7sCP9xocrjJEdZ0gNiDdw_GFbOnsjHn3N7Qi5kSLFQmQWttxpXPxHZjEH9JG1HK-CHVejzlz7SXPX8GNWW51ouV6QcQp3CBA9WmnBke0ICdMzVq7a3BJmkC3RFuijHVcc/s1600/Active-Instagram-3-icon.png" width="60px" />
<iframe src="http://widget.stagram.com/in/AQUI SEU NICK NO INSTAGRAN/?s=100&w=4&h=2&b=0&p=5" allowtransparency="true" frameborder="0" scrolling="no" style="border:none;overflow:hidden;width:400px; height: 210px"></iframe>
</div>
</div>
</div></div></div>
