roockbertoo
Gamma
Verificado
Verificación en dos pasos activada
Verificado por Whatsapp
Hola FB hoy les traigo un tutorial que tal vez algunos ya conozcan, es para crear un contenido social en Blogger o Social Content Locker, espero les sirva y saludos.
Les Dejo un Demo AquiI > DEMO CONTENIDO SOCIAL BLOQUEADO
Caracteristicas del contenido social bloqueado:
- Tu blog generara un gran impacto positivo en las redes sociales (Twitter, Facebook, Google+)
- Tiene 3 opciones para compartir: Twitter, Facebook, Google+
Añadir el contenido social bloqueado
Ahora instalaremos este pequeño script en nuestro blog de blogger, recuerda seguir cada paso para evitar problemas mas adelante.
Paso 1: Instalar el contenido social bloqueado
Primero vamos a Plantilla >> Edicion HTML
Luego buscamos: </head> y por encima pegamos el siguiente codigo:
Guardas los cambios, y procedemos al siguiente paso.
Paso 2: Añadir el contenido social bloqueado
Ahora es cuando lo vamos a insertar en nuestro blog, lo recomendable es que lo insertemos en alguna entrada, pero lo puedes insertar en cualquier parte de tu blog.
Para añadir el script hay que ir a Blogger >> Tu blog >> Añadir entrada
Seleccionamos HTML en la pestaña de la entrada y pegamos el siguiente codigo HTML.
Configuracion
Para Twitter: Remplaza TU-USUARIO-DE-TWITTER que se encuentra en la linea 34 por tu usuario de twitter.
Para Facebook: Remplaza TU-PAGINA-DE-FACEBOOK que se encuentra en la linea 40 por tu pagina de facebook.
También debes remplazar “575454754″ por la ID de de tu aplicación de facebook.
Para Google plus: Remplaza TU-PAGINA-DE-GOOGLE-PLUS que se encuentra en la linea 45 por tu pagina de google plus.
Remplaza: Añade_Imagen_Aqui por la imagen que quieres ocultar.
Remplaza: Añade el texto oculto aqui por el texto que quieres coultar, recuerda que tambien puedes agregar elementos HTML, tales como gadgets o scripts.
Con todo esto echo ya solo basta con guardar y ver el resultado final.
Si les falla algo vallan a How To Create a Social Content Locker in Blogger BlogSpot
Les Dejo un Demo AquiI > DEMO CONTENIDO SOCIAL BLOQUEADO
Caracteristicas del contenido social bloqueado:
- Tu blog generara un gran impacto positivo en las redes sociales (Twitter, Facebook, Google+)
- Tiene 3 opciones para compartir: Twitter, Facebook, Google+
Añadir el contenido social bloqueado
Ahora instalaremos este pequeño script en nuestro blog de blogger, recuerda seguir cada paso para evitar problemas mas adelante.
Paso 1: Instalar el contenido social bloqueado
Primero vamos a Plantilla >> Edicion HTML
Luego buscamos: </head> y por encima pegamos el siguiente codigo:
HTML:
<link href='http://mybloggerlab.com/StyleSheet/locker.css' rel='stylesheet' type='text/css'/>Guardas los cambios, y procedemos al siguiente paso.
Paso 2: Añadir el contenido social bloqueado
Ahora es cuando lo vamos a insertar en nuestro blog, lo recomendable es que lo insertemos en alguna entrada, pero lo puedes insertar en cualquier parte de tu blog.
Para añadir el script hay que ir a Blogger >> Tu blog >> Añadir entrada
Seleccionamos HTML en la pestaña de la entrada y pegamos el siguiente codigo HTML.
HTML:
<article id="default-usage">
<div class="to-lock" style="display: none;">
<!--Inicia el contenido oculta (Tambien puedes usar HTML)-->
<div style="text-align: center; margin-bottom: 20px;">
[B][COLOR="#FF0000"]<img src="Añade_Imagen_Aqui" alt="" style="margin: auto;" />[/COLOR]
</div>[/B]
<div style="text-align: justify">
[B][COLOR="#FF0000"]Añade el texto oculto aqui, recuerda que tambien puedes usar HTML[/COLOR][/B]
</div>
<!--Termina el contenido oculto-->
</article>
</div> <div id="mblunlocker" style="font-size:10px;"> </div>
<script type="text/javascript" src="http://mybloggerlab.com/Scripts/lock.js"></script>
<script>
jQuery(document).ready(function ($) {
$("#default-usage .to-lock").socialLock({
text: {
header: "Comparte esto, para desbloquearlo",
message: "Este es el contenido social bloqueado, para verlo da clic en cualquier botón de abajo."
},
style: "ui-social-locker-secrets",
buttons: {
order: ["twitter", "facebook", "google"]
},
// Opciones de Twitter
twitter: {
url: "[COLOR="#FF0000"][B]TU-USUARIO-DE-TWITTER[/B][/COLOR]",
text: "[COLOR="#FF0000"]Texto que quieres que aparezca a la hora de twittear el contenido oculto[/COLOR]"
},
// Opciones de Facebook
facebook: {
url: "[COLOR="#FF0000"][B]TU-PAGINA-DE-FACEBOOK[/B][/COLOR]",
appId: "[B][COLOR="#FF0000"]575454754[/COLOR][/B]"
},
google: {
url: "[B][COLOR="#FF0000"]TU-PAGINA-DE-GOOGLE-PLUS[/COLOR][/B]"
}
});
});;;;
</script>Configuracion
Para Twitter: Remplaza TU-USUARIO-DE-TWITTER que se encuentra en la linea 34 por tu usuario de twitter.
Para Facebook: Remplaza TU-PAGINA-DE-FACEBOOK que se encuentra en la linea 40 por tu pagina de facebook.
También debes remplazar “575454754″ por la ID de de tu aplicación de facebook.
Para Google plus: Remplaza TU-PAGINA-DE-GOOGLE-PLUS que se encuentra en la linea 45 por tu pagina de google plus.
Remplaza: Añade_Imagen_Aqui por la imagen que quieres ocultar.
Remplaza: Añade el texto oculto aqui por el texto que quieres coultar, recuerda que tambien puedes agregar elementos HTML, tales como gadgets o scripts.
Con todo esto echo ya solo basta con guardar y ver el resultado final.
Si les falla algo vallan a How To Create a Social Content Locker in Blogger BlogSpot
Última edición:
