Tutorial: Como poner un boton de seguir en INSTAGRAM en nuestro blog

skrill3x · 10 Feb 2016

bueno esta nueva red social de fotos

seria buena para algunos blogger integrarla a sus blogs

asi que empezemos hay distintas formas de seguir en intagram tengo

hay cinco botones distintos los tamaños de la foto son los reales

HTML:

<style>.ig-b- { display: inline-block; }
.ig-b- img { visibility: hidden; }
.ig-b-:hover { background-position: 0 -60px; } .ig-b-:active { background-position: 0 -120px; }
.ig-b-48 { width: 48px; height: 48px; background: url(//badges.instagram.com/static/images/ig-badge-sprite-48.png) no-repeat 0 0; }
   [MENTION=16931]medi[/MENTION]a only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
.ig-b-48 { background-image: url(//badges.instagram.com/static/images/ig-badge-sprite-48@2x.png); background-size: 60px 178px; } }</style>
<div align="center"><a href="http://instagram.com/TUUSUARIOAQUÍ?ref=badge" class="ig-b- ig-b-48"><img src="//badges.instagram.com/static/images/ig-badge-48.png" alt="Instagram" /></a></div>

HTML:

<style>.ig-b- { display: inline-block; }
.ig-b- img { visibility: hidden; }
.ig-b-:hover { background-position: 0 -60px; } .ig-b-:active { background-position: 0 -120px; }
.ig-b-32 { width: 32px; height: 32px; background: url(//badges.instagram.com/static/images/ig-badge-sprite-32.png) no-repeat 0 0; }
   [MENTION=16931]medi[/MENTION]a only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
.ig-b-32 { background-image: url(//badges.instagram.com/static/images/ig-badge-sprite-32@2x.png); background-size: 60px 178px; } }</style>
<div align="center"><a href="http://instagram.com/TUUSUARIOAQUÍ?ref=badge" class="ig-b- ig-b-32"><img src="//badges.instagram.com/static/images/ig-badge-32.png" alt="Instagram" /></a></div>

HTML:

<style>.ig-b- { display: inline-block; }
.ig-b- img { visibility: hidden; }
.ig-b-:hover { background-position: 0 -60px; } .ig-b-:active { background-position: 0 -120px; }
.ig-b-24 { width: 24px; height: 24px; background: url(//badges.instagram.com/static/images/ig-badge-sprite-24.png) no-repeat 0 0; }
   [MENTION=16931]medi[/MENTION]a only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
.ig-b-24 { background-image: url(//badges.instagram.com/static/images/ig-badge-sprite-24@2x.png); background-size: 60px 178px; } }</style>
<div align="center"><a href="http://instagram.com/TUUSUARIOAQUÍ?ref=badge" class="ig-b- ig-b-24"><img src="//badges.instagram.com/static/images/ig-badge-24.png" alt="Instagram" /></a></div>

HTML:

<style>.ig-b- { display: inline-block; }
.ig-b- img { visibility: hidden; }
.ig-b-:hover { background-position: 0 -60px; } .ig-b-:active { background-position: 0 -120px; }
.ig-b-16 { width: 16px; height: 16px; background: url(//badges.instagram.com/static/images/ig-badge-sprite-16.png) no-repeat 0 0; }
   [MENTION=16931]medi[/MENTION]a only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
.ig-b-16 { background-image: url(//badges.instagram.com/static/images/ig-badge-sprite-16@2x.png); background-size: 60px 178px; } }</style>
<div align="center"><a href="http://instagram.com/TUUSUARIOAQUÍ?ref=badge" class="ig-b- ig-b-16"><img src="//badges.instagram.com/static/images/ig-badge-16.png" alt="Instagram" /></a></div>

HTML:

<style>.ig-b- { display: inline-block; }
.ig-b- img { visibility: hidden; }
.ig-b-:hover { background-position: 0 -60px; } .ig-b-:active { background-position: 0 -120px; }
.ig-b-v-24 { width: 137px; height: 24px; background: url(//badges.instagram.com/static/images/ig-badge-view-sprite-24.png) no-repeat 0 0; }
   [MENTION=16931]medi[/MENTION]a only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
.ig-b-v-24 { background-image: url(//badges.instagram.com/static/images/ig-badge-view-sprite-24@2x.png); background-size: 160px 178px; } }</style>
<div align="center"><a href="http://instagram.com/TUUSUARIOAQUÍ?ref=badge" class="ig-b- ig-b-v-24"><img src="//badges.instagram.com/static/images/ig-badge-view-24.png" alt="Instagram" /></a></div>

Seleccionamos el que mas te gusta y vamos a nuestro blog y añadimos un nuevo widget tanto para wordpress , como para blogger

luego pegamos alguno de estos codigo que hallas seleccionado y donde dice TUUSUARIOAQUI

ponemos nuestro usuario de instagram

y ya

asi queda en nuestro blog 🙂

espero que te haya ayudado en alguito

me agrada si te gusto y muchas gracias
[MENTION=9679]cicklow[/MENTION] sera que puedes editar mi mensaje de botos por bonton gracias 😉

Darwin Fernandez · 10 Feb 2016

Gracias por el tutorial , creo que empezare con este de instagram veo que muchos le sacan buen $$$ 🙂

Fernando SEO · 10 Feb 2016

Es bueno saber algunas cosas. Instagram cada dia va tomando fuerza y entre mas seguidores reales tengamos mucho mejor sera para todos.

gastre · 10 Feb 2016

coño darwin, te pareces a mi jejej.

- - - Actualizado - - -

Gracias por el tuto!
saludos.

- - - Actualizado - - -

JisuWeb dijo:
Es bueno saber algunas cosas. Instagram cada dia va tomando fuerza y entre mas seguidores reales tengamos mucho mejor sera para todos.

y atentos a snapchat, puede ser el futuro, o ya lo está siendo en otros paises.

MrAdsense · 10 Feb 2016

gracias por el tutorial me interesa para integrarlo en mi paginita web q apenas voy creando 🙂

skrill3x · 10 Feb 2016

Darwin Fernandez dijo:
Gracias por el tutorial , creo que empezare con este de instagram veo que muchos le sacan buen $$$ 🙂

JisuWeb dijo:
Es bueno saber algunas cosas. Instagram cada dia va tomando fuerza y entre mas seguidores reales tengamos mucho mejor sera para todos.

gastre dijo:
coño darwin, te pareces a mi jejej.

- - - Actualizado - - -

Gracias por el tuto!
saludos.

- - - Actualizado - - -

y atentos a snapchat, puede ser el futuro, o ya lo está siendo en otros paises.

MrAdsense dijo:
gracias por el tutorial me interesa para integrarlo en mi paginita web q apenas voy creando 🙂

de nada para eso estamos para ayudarnos entre todos , pronto el de wpp y el de snapchat , toca averiguar en foros gringos si lo encuentro bien lo subo 🙂

Carlos Arreola · 11 Feb 2016

Muchas gracias, buen tutorial 🙂

cocholo21 · 11 Feb 2016

Gracias por el tuto! muy bueno.

skrill3x · 12 Feb 2016

Carlos Arreola dijo:
Muchas gracias, buen tutorial 🙂

cocholo21 dijo:
Gracias por el tuto! muy bueno.

gracias , pronto mas tutoriales de wpp y depronto de hasta snapchat :sorrow:

Tutorial: Como poner un boton de seguir en INSTAGRAM en nuestro blog

skrill3x

Darwin Fernandez

Fernando SEO

gastre

MrAdsense

skrill3x

Carlos Arreola

cocholo21

skrill3x

Temas similares

Privacidad y transparencia

Privacidad y transparencia