Ir al contenido principal

Conseguir mas visitas desde redes sociales en Blogger

Crear un contenido bloqueado el cual solo sera disponible cuando el usuario de un me gusta, o un Tweet, es genial ya que con esto ganamos fans para nuestras redes sociales y hacemos que nuestro blog tenga una sección "premium" por decirlo de cierta forma.

Contenido Social Bloqueado en Blogger

Para agregar este truco a tu blog, primero ve a Plantilla y antes de </head> pega lo siguiente:
<link href='http://mybloggerlab.com/StyleSheet/locker.css' rel='stylesheet' type='text/css'/>
Ahora en la edición HTML de una entrada pega lo siguiente:
<article id="default-usage">
<div class="to-lock" style="display: none;">
     
<!--Hidden Content Starts (You can Use HTML BELOW)-->


<div style="text-align: center; margin-bottom: 20px;">
<img src="http://www.totalcar.rs/wp-content/uploads/2010/10/ferrarilogo.jpg" alt="" style="margin: auto;" />
</div>

<div style="text-align: justify">
<div class="separator" style="clear: both; text-align: center;"><img border="0" src="http://www.wilvalencia.com/img/visto_bueno_logo.jpg" /></a></div>

<b>Gracias por compartir, ahora puedes disfrutar del contenido que estaba oculto 
</b></div>

<!--Hidden Content Ends (You can Use HTML ABOVE)-->

</article>
</div><div id="mblunlocker"> </div>
<script type="text/javascript" src="https://mybloggerlab.googlecode.com/files/lock.js"></script>

<script>
jQuery(document).ready(function ($) {
$("#default-usage .to-lock").socialLock({

text: {
header: "Comparte y Descubre lo que esta oculto",
message: "Aquí se encuentra el contenido oculto, solo comparte y lo descubriras."
},

style: "ui-social-locker-secrets",
buttons: {
order: ["twitter", "facebook", "google"]
},

// twitter options
twitter: {
url: "URL DE TU TWITTER",
text: "Upgrade your social buttons to get more social traffic!"
},

// facebook options
facebook: {
url: "URL DE TU FACEBOOK",
appId: "418044881593120"
},

google: {
url: "URL DE TU GOOGLE+"
}
});
});;;;
     
</script>

Reemplaza lo que esta resaltado en color azul por lo que se indica en cada caso.

Lo que esta resaltado en color verde son los parámetros que puedes personalizar, entre ellos se encuentra el contenido que se va a ocultar.

Luego de que el usuario comparta se vera lo siguiente:


Puedes ver el truco funcionando en el siguiente blog de pruebas.

El código pertenece a My Blogger Lab, yo por mi parte he traducido el script al español y he agregado un par de cosas mas, dando como resultado un código mas optimizado.

Espero que les haya sido de mucha utilidad este truco, y si ya usaste este truco, coméntanos que tal te ha parecido.

Comentarios

Entradas populares de este blog

Compartir presentaciones en línea con SlideShare

Si eres de los usuarios que suelen trabajar en equipo, sabes de lo difícil que a veces resulta compartir la información relativa al trabajo que estamos realizando, muchas veces seguramente nos ha sucedido que a algunos miembros del equipo, o no les ha llegado la información, o directamente la han perdido. Y nuevamente debemos crear un correo, adjuntarles el archivo y esperar a que salga de la bandeja. Aburrido y cansador, sobre todo en el caso de las pesadas presentaciones.

Pasos Para Instalar Windows XP

Cuando nos hablan de instalar sistemas operativos, creemos que es muy difícil y que seguramente no seremos capaces de de hacerlo solos. Pues me he tomado a la tarea de realizar este pequeño tutorial para demostrarles paso a paso que no es tan complejo como parece. Para que se ahorren un buen dinerito a la hora de enfrentarse una instalación promovida por un daño en el disco duro o quizás por un virus informático.

Curso Gratis Para Aprender a Programar en Dreamweaver

Introducción   El programa Dreamweaver de Macromedia es uno de los programas más utilizados en todo el mundo para la creación de paginas WEB . Es empleado tanto por profesionales como por personas que se inician en la creación de su primera pagina web. De hecho muchos lo consideran ampliamente superior a otros programas similares, tales como FrontPage de Microsoft . Aquí no vamos a entrar en quien tiene o deja de tener razón. Lo que si vamos a hacer es tener una primera aproximación a la última versión de Dreamweaver : la versión 7 de Macromedia Dreamweaver MX 2004.