SummArg | Cursos y recursos para webmasters

Mostrar contenidos sólo al clickear “me gusta” en nuestra página de Facebook

Con este recurso se pueden captar muchos fans para nuestras páginas en Facebook y de ese modo nos aseguramos que nuestro contenido tenga un poco mas de llegada. Además no es dificil de implementar.

Primero debemos establecer una sección en donde estará nuestro contenido “solo para fans” y la sección para los que aún no son fans. Creamos dos clases CSS y la clase wrapper será un contenedor de ambas:

.wrapper{
width: 100%;
float: left;
position: relative;
overflow: hidden;
}
.fan_content{
width: 520px;
height: 500px;
float: left;
position: relative;
background: #ccc;
z-index: 9;
}
.non_fan_content{
width: 520px;
height: 500px;
float: left;
position: relative;
background: #666;
margin-top: -500px;
z-index: 0;
}

Ahora ya podemos introducir en nuestro HTML las secciones para fans y no fans.

<fb:fbml version="1.1">
<div class="wrapper">
  <fb:visible-to-connection>
    <div class="fan_content">Contenido sólo para Fans de nuestra página!</div>
  <fb:else>
    <div class="non_fan_content">Contenido para los no-fans.</div>
  </fb:else>
  </fb:visible-to-connection>
</div>
</fb:fbml>

Simple, no? Listo para usar en cualquier página de Facebook!

Visto en daddydesign.com

 

Dejar un comentario

  1. Cesar

    Hola, he hecho este ejemplo pero me salen los 2 mensajes, no me funciona, si me puedes colaborar sería genial. Gracias.

  2. Nekko

    Hola Cesar! El código funciona pero es un poco “vueltero”. Fijate de probarlo no como administrador, sino como usuario con otra cuenta FB. También seguí los consejos que recomiendan en este artículo. http://www.hyperarts.com/blog/facebook-fan-pages-content-for-fans-only-static-fbml/

  3. Felipe

    No me funciona?

    sea o no Fan veo todo!!

  4. Nekko

    Les recuerdo que este snippet es para utilizar dentro de una página FBML

Dejar un comentario