"Hoy es: . Comparte tu Blog Hablachento a tus amigos en tus redes sociales...
jueves, 28 de mayo de 2015




Hoy vamos a compartir unos códigos para que coloques en tu Blogger de videos de Youtube, cuando un usuario desee ver el video, tenga que compartirlo primero en las redes sociales.

https://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fhablachento.blogspot.com%2F2015%2F05%2Ftutorial-codigo-html-compartir-en-redes.html&title=Tutorial%3A+C%C3%B3digo+HTML+Compartir+en+Redes+Sociales+para+poder+verlo+http%3A%2F%2Fhablachento.blogspot.com%2F2015%2F05%2Ftutorial-codigo-html-compartir-en-redes.html+V%C3%ADa%3A+%40oloman

https://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fhablachento.blogspot.com%2F2015%2F05%2Ftutorial-codigo-html-compartir-en-redes.html&title=Tutorial%3A+C%C3%B3digo+HTML+Compartir+en+Redes+Sociales+para+poder+verlo+http%3A%2F%2Fhablachento.blogspot.com%2F2015%2F05%2Ftutorial-codigo-html-compartir-en-redes.html+V%C3%ADa%3A+%40oloman

1.- Paso:

- Instalar el jQuery

Para mostrar y ocultar el contenido, se necesita jQuery. Por lo tanto, incluya el código por encima de </head>

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js' type='text/javascript'/>

    Si ya lo tienes instalado en tu plantilla, pasa al siguiente paso.



2.- Paso:

- Buscar </head> justo y por encima de ella pega el siguiente código CSS.

<link href="https://googledrive.com/host/0BwZ7Sm1QQc1lTnlVZG1DS3V0N3c/compartir.css" rel="stylesheet" type="text/css"></link>



3.- Paso:

- Instalar la App de Facebook:

- Buscamos <body> o <body expr:class='&quot;loading&quot; + data:blog.mobileClass'> y justamente debajo colocamos lo siguiente:

 <div id='fb-root'/>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = &quot;//connect.facebook.net/es_LA/all.js#xfbml=1&quot;;
fjs.parentNode.insertBefore(js, fjs);
}(document, &#39;script&#39;, &#39;facebook-jssdk&#39;));</script>

- Una vez puesto los codigos, le damos clic " Guardar "




4.- Paso:- Ahora nos vamos a crear entrada, y colocamos el codigo en donde ustedes quieran y listo.

 <article id="default-usage">
<div class="to-lock" style="display: none;">

Código,imagen o link a ocultar

</article>
</div>

<script type="text/javascript" src="https://googledrive.com/host/0BwZ7Sm1QQc1lTnlVZG1DS3V0N3c/LOCKE.js"></script>
<script>
jQuery(document).ready(function ($) {
$("#default-usage .to-lock").socialLock({

text: {
header: "Comparte para desbloquear",
message: "Si quieres ver el contenido, comparte en cualquiera de las Redes"
},

style: "ui-social-locker-secrets",
buttons: {
order: ["twitter", "facebook", "google"] },
// twitter options
twitter: {
url: "URL DE LA ENTRADA",
text: "Título de la entrada!"
},
// facebook options
facebook: {
url: "URL DE LA ENTRADA",
appId: "588590114535104"
},
google: {
url: "URL DE LA ENTRADA"}});});;;;</script> 

Anuncio Patrocinado



-- Suscribete gratis AQUI para enviarte las actualizaciones por E-Mail --



Escribe un comentario...

Protegido por Copyscape Herramienta plagio

0 comentarios:


Fotos Google El 90% de las personas que duran 10 minutos viendo estas imágenes se reñajan y eliminan el estrés del día.

Etiquetas