MAPA DEL SITIO

GRACIAS A TU DONACION ESTA PAGINA PODRA SEGUIR FUNCIONANDO
Comentarios de Puntadas católicas
COMPARTE ESTA ENTRADA





SIGUENOS
Síguenos en TwitterSiguenos en FacebookSiguenos en Google+Siguenos en PicasaSiguenos en YouTubeSiguenos en BloggerSiguenos en Blogger


Cómo insertar una caja flotante de Twitter

Fuente: ayuda de blogger
En este post aprenderás a insertar de una forma fácil y sencilla un widget de Twitter de forma flotante en la cual aparecerá cada vez que pases el cursor por el icono de Twitter, mostrara lo que hayas compartido en tu cuenta de Twitter, esto hará que los usuarios que visitan tu blog puedan ver de forma rápida lo que compartiste con tus seguidores en tu cuenta personal de Twitter, generando más vistas de tu blog o página web.

Nota: este truco sirve para mostrarse en cualquier página web sea Blogger, Wordpress, Joomla, etc.

¿Cómo insertar de forma flotante una caja de mis publicaciones de Twitter?

Debes seguir las instrucciones tal como se muestran en este tutorial

Pueden ver su demostración en el siguiente blog

DEMO

Instrucciones de Instalación

1-Ir a Blogge
2-Un clic en “Diseño

¿Cómo insertar de forma flotante una caja de mis publicaciones de Twitter?

3- Un clic en “Añadir un gadget

¿Cómo insertar de forma flotante una caja de mis publicaciones de Twitter?

4-Busca el widget que dice “HTML/Javascript” ábrelo

¿Cómo insertar de forma flotante una caja de mis publicaciones de Twitter?

5-Ingresa las siguientes líneas de código en su interior
<style>
#flotante1 {
position:fixed;
top:100px;
right:-250px;
float:right;
width:288px;
display:block;
padding:0;
z-index:1002;
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
}
#flotante1:hover, #flotante2:hover, #flotante3:hover {
right:0px;
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
}
div.likeboxwrap {
margin-top:-5px;
margin-left:-45px;
width:238px;
height:400px;
background-color:#fff;
overflow:hidden;
border-radius:10px;
}
</style>

<!-- Primera pestaña -->
<div id='flotante1'>
<img src='http://4.bp.blogspot.com/-NFdkdmaoMTM/Va6Nrqu9jcI/AAAAAAAAJFU/a0-rTK_o2z0/s1600/ayudadeblogger-twitter.png' style='float:left;'/>
<div style='background: #0084B4; height:400px; margin-left:38px;padding: 8px 5px 0pt 50px;border-radius: 0px 0px 0px 10px;'><span><div class='likeboxwrap'>
            <a class="twitter-timeline"  href="https://twitter.com/ayudadeblogger" data-widget-id="623555209915166720">Tweets por el @ayudadeblogger.</a>
            <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
         
</div></span></div></div>

Realiza este cambio

Borra todo el código que está marcado de color azul y remplázalo por el código que te proporcionara la página de Twitter.
Guardar

¿Cómo insertar de forma flotante una caja de mis publicaciones de Twitter?

8 Para obtener el código del widget de Twitter debes seguir las siguientes instrucciones

https://twitter.com/settings/widgets

Sigue la secuencia de las siguientes imágenes

Entra al enlace. Busca "Crear nuevo"

¿Cómo insertar de forma flotante una caja de mis publicaciones de Twitter?

¿Cómo insertar de forma flotante una caja de mis publicaciones de Twitter?

Cambia la altura utilizando las flechas "Arriba"

¿Cómo insertar de forma flotante una caja de mis publicaciones de Twitter?

Click en "Crear Widget"

¿Cómo insertar de forma flotante una caja de mis publicaciones de Twitter?

Guardar cambios

¿Cómo insertar de forma flotante una caja de mis publicaciones de Twitter?


Copia todo el código que te proporciono Twitter
En el paso 6 de este post, elimina el código que está marcado de color azul y remplázalo por tu nuevo código de Twitter, eso es todo

Tal vez te interese

Related Posts Plugin for WordPress, Blogger...
TRANSLATE


EnglishcvFrenchGermanSpainItalianDutchRussianPortugueseJapaneseKoreanArabicChinese Simplified

Archivo del blog

Entradas populares

Seguidores

 
Gadget de animacion Social - Widgets para Blogger

[PR] 求む!タイピング初心者