Tutorial: Publicidade "InFrame"

Zentraedi · 24/01/2015

Muy bueno el tutorial, gracias por aporte, siempre aparecen ese tipo de publicidades con el botón que se mueve, ahora ya se hacerlo, gracias✌

"write once, run anywhere”

Andres128 · 24/01/2015

Funcionando al 100% 🙂

Como técnica adicional para los nuevos en blogger, no hay necesidad de pasar el javascript a texto plano:
Agregando esto al inicio.
/*<![CDATA[*/
Y al final del javascript:
/*]]>*/

Es decir quedaría así el javascript:

Inserir CODE, HTML ou PHP:

<script type="text/javascript">
  /*<![CDATA[*/
var mover = true; //Se mueve o no se mueve el boton cerrar
var mueve = 2; // Número de veces que se mueve el botón cerrar
var recargar = true; //Se recarga  o no el anuncio
var segundos = 180; //Si se recargara, en cuantos segundos
//Funcion para quitar y agregar la publicidad
$(document).ready(function() {
	// NO MOVER
	var frm=$('#publicidad').find('iframe'),Mtop=frm.attr('height')/2,x=0;
	Mtop = Mtop-125;
	$('#publicidad').css({
		width : frm.attr('width'),
		height : frm.attr('height')
	});
	$('#publicidad').html('<div class="cod" style="width:'+frm.attr('width')+'px;height:'+frm.attr('height')+'px"><div style="margin-top:'+Mtop+'px"><img alt="cerrar" id="cerrar" src="cerrar.png" title="Cerrar" style="margin:'+Math.floor(Math.random()*230+5)+'px 0 0 '+Math.floor(Math.random()*280+5)+'px"/>'+$('#cod').html()+'</div></div>'+$('#publicidad').html());
	if(mover == true){
		$('#cerrar').mouseover(function() {
			if (x == mueve) {
				$(this).click(function() {
					$('.cod').fadeOut('fast');
					if(recargar){
						x = 0;
						setTimeout(function() {
							$(".cod").css('display','block');
							$(this).css({
								marginTop: Math.floor(Math.random()*230+5),
								marginLeft: Math.floor(Math.random()*280+5)
							});
						}, segundos*1000);
					}
				});
			} else {
				x++;
				$(this).animate({
					marginTop: Math.floor(Math.random()*230+5),
					marginLeft: Math.floor(Math.random()*280+5)
				});
			}
		});
	} else {
		$('#cerrar').click(function() {
			$('.cod').fadeOut('fast');
			if(recargar){
				setTimeout(function() {
					$(".cod").css('display','block');
					$(this).css({
						marginTop: Math.floor(Math.random()*230+5),
						marginLeft: Math.floor(Math.random()*280+5)
					});
				}, segundos*1000);
			}
		});
	}
});
  /*]]>*/
</script>
<div id="cod">
	AQUÍ TU CÓDIGO DE PUBLICIDAD
</div>

Ahh y no olviden el jQuery antes del </head>:

Inserir CODE, HTML ou PHP:

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

A OTRO TRICK PARA QUE CARGUE MAS RÁPIDO EL SCRIPT EN BLOGGER:

Van a esta pagina y pegan el javascript y click en encode:
JavaScript Obfuscator - Free Online JavaScript Packer

Luego copian el Obfuscation result:

Y quedaría su javascript algo así: no olvidar el /*<![CDATA[*/ al inicio y /*]]>*/ al final.

Inserir CODE, HTML ou PHP:

<script type="text/javascript">
  /*<![CDATA[*/
eval(function(p,a,c,k,e,d){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--){d[e(c)]=k[c]||e(c)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('f u=z;f E=1;f t=z;f s=M;$(K).P(9(){f 7=$(\'#b\').N(\'J\'),j=7.e(\'g\')/2,x=0;j=j-O;$(\'#b\').d({h:7.e(\'h\'),g:7.e(\'g\')});$(\'#b\').q(\'<k Q="8" r="h:\'+7.e(\'h\')+\'a;g:\'+7.e(\'g\')+\'a"><k r="v-H:\'+j+\'a"><I L="c" T="c" 11="10://13.12/14/R/15-b-Y-c.Z" S="U" r="v:\'+3.4(3.6()*m+5)+\'a 0 0 \'+3.4(3.6()*n+5)+\'a"/>\'+$(\'#8\').q()+\'</k></k>\'+$(\'#b\').q());i(u==V){$(\'#c\').X(9(){i(x==E){$(l).F(9(){$(\'.8\').G(\'B\');i(t){x=0;D(9(){$(".8").d(\'C\',\'y\');$(l).d({p:3.4(3.6()*m+5),o:3.4(3.6()*n+5)})},s*w)}})}A{x++;$(l).W({p:3.4(3.6()*m+5),o:3.4(3.6()*n+5)})}})}A{$(\'#c\').F(9(){$(\'.8\').G(\'B\');i(t){D(9(){$(".8").d(\'C\',\'y\');$(l).d({p:3.4(3.6()*m+5),o:3.4(3.6()*n+5)})},s*w)}})}});',62,68,'|||Math|floor||random|frm|cod|function|px|publicidad|cerrar|css|attr|var|height|width|if|Mtop|div|this|230|280|marginLeft|marginTop|html|style|segundos|recargar|mover|margin|1000||block|false|else|fast|display|setTimeout|mueve|click|fadeOut|top|img|iframe|document|alt|180|find|125|ready|class|tutoriales|title|id|Cerrar|true|animate|mouseover|inframe|png|http|src|com|forobeta|attachments|38687d1415092509'.split('|'),0,{}))
  /*]]>*/
</script>

Para decode del javascript ir a esta pagina:
UnPacker

kanikase · 24/01/2015

LuisNara disse:
Una pregunta, cuando dices "2.- Si se usa adblock no se cargará el iframe." por ejemplo, si tengo en el iframe un reproductor de video, entonces no va a cargar? hay forma de que cargue?

XD Ya lo arreglé, ya edité el código, cuando haya AdBlock o alguna otra extensión que bloque la publicidad, si se cargará el iframe en forma normal (sin publicidad), cuando no haya AdBlock si se cargará con publicidad 🙂 puedes verlo en el demo

P.D Usé el script de [MENTION=9679]cicklow[/MENTION] para detectar el AdBlock :witless:

- - - Actualizado - - -

Andres128 disse:

Funcionando al 100% 🙂

Como técnica adicional para los nuevos en blogger, no hay necesidad de pasar el javascript a texto plano:
Agregando esto al inicio.
/*<=!=[=C=D=A=T=A=[*/
Y al final del javascript:
/*]=]=>*/

Es decir quedaría así el javascript:

Inserir CODE, HTML ou PHP:

<script type="text/javascript">
  /*<=!=[=C=D=A=T=A=[*/
var mover = true; //Se mueve o no se mueve el boton cerrar
var mueve = 2; // Número de veces que se mueve el botón cerrar
var recargar = true; //Se recarga  o no el anuncio
var segundos = 180; //Si se recargara, en cuantos segundos
//Funcion para quitar y agregar la publicidad
$(document).ready(function() {
	// NO MOVER
	var frm=$('#publicidad').find('iframe'),Mtop=frm.attr('height')/2,x=0;
	Mtop = Mtop-125;
	$('#publicidad').css({
		width : frm.attr('width'),
		height : frm.attr('height')
	});
	$('#publicidad').html('<div class="cod" style="width:'+frm.attr('width')+'px;height:'+frm.attr('height')+'px"><div style="margin-top:'+Mtop+'px"><img alt="cerrar" id="cerrar" src="cerrar.png" title="Cerrar" style="margin:'+Math.floor(Math.random()*230+5)+'px 0 0 '+Math.floor(Math.random()*280+5)+'px"/>'+$('#cod').html()+'</div></div>'+$('#publicidad').html());
	if(mover == true){
		$('#cerrar').mouseover(function() {
			if (x == mueve) {
				$(this).click(function() {
					$('.cod').fadeOut('fast');
					if(recargar){
						x = 0;
						setTimeout(function() {
							$(".cod").css('display','block');
							$(this).css({
								marginTop: Math.floor(Math.random()*230+5),
								marginLeft: Math.floor(Math.random()*280+5)
							});
						}, segundos*1000);
					}
				});
			} else {
				x++;
				$(this).animate({
					marginTop: Math.floor(Math.random()*230+5),
					marginLeft: Math.floor(Math.random()*280+5)
				});
			}
		});
	} else {
		$('#cerrar').click(function() {
			$('.cod').fadeOut('fast');
			if(recargar){
				setTimeout(function() {
					$(".cod").css('display','block');
					$(this).css({
						marginTop: Math.floor(Math.random()*230+5),
						marginLeft: Math.floor(Math.random()*280+5)
					});
				}, segundos*1000);
			}
		});
	}
});
  /*]=]=>*/
</script>
<div id="cod">
	AQUÍ TU CÓDIGO DE PUBLICIDAD
</div>

Ahh y no olviden el jQuery antes del </head>:

Inserir CODE, HTML ou PHP:

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

A OTRO TRICK PARA QUE CARGUE MAS RÁPIDO EL SCRIPT EN BLOGGER:

Van a esta pagina y pegan el javascript y click en encode:
JavaScript Obfuscator - Free Online JavaScript Packer

Luego copian el Obfuscation result:

Y quedaría su javascript algo así: no olvidar el /*<=!=[=C=D=A=T=A=[*/ al inicio y /*]=]=>*/ al final.

Inserir CODE, HTML ou PHP:

<script type="text/javascript">
  /*<=!=[=C=D=A=T=A=[*/
eval(function(p,a,c,k,e,d){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--){d[e(c)]=k[c]||e(c)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('f u=z;f E=1;f t=z;f s=M;$(K).P(9(){f 7=$(\'#b\').N(\'J\'),j=7.e(\'g\')/2,x=0;j=j-O;$(\'#b\').d({h:7.e(\'h\'),g:7.e(\'g\')});$(\'#b\').q(\'<k Q="8" r="h:\'+7.e(\'h\')+\'a;g:\'+7.e(\'g\')+\'a"><k r="v-H:\'+j+\'a"><I L="c" T="c" 11="10://13.12/14/R/15-b-Y-c.Z" S="U" r="v:\'+3.4(3.6()*m+5)+\'a 0 0 \'+3.4(3.6()*n+5)+\'a"/>\'+$(\'#8\').q()+\'</k></k>\'+$(\'#b\').q());i(u==V){$(\'#c\').X(9(){i(x==E){$(l).F(9(){$(\'.8\').G(\'B\');i(t){x=0;D(9(){$(".8").d(\'C\',\'y\');$(l).d({p:3.4(3.6()*m+5),o:3.4(3.6()*n+5)})},s*w)}})}A{x++;$(l).W({p:3.4(3.6()*m+5),o:3.4(3.6()*n+5)})}})}A{$(\'#c\').F(9(){$(\'.8\').G(\'B\');i(t){D(9(){$(".8").d(\'C\',\'y\');$(l).d({p:3.4(3.6()*m+5),o:3.4(3.6()*n+5)})},s*w)}})}});',62,68,'|||Math|floor||random|frm|cod|function|px|publicidad|cerrar|css|attr|var|height|width|if|Mtop|div|this|230|280|marginLeft|marginTop|html|style|segundos|recargar|mover|margin|1000||block|false|else|fast|display|setTimeout|mueve|click|fadeOut|top|img|iframe|document|alt|180|find|125|ready|class|tutoriales|title|id|Cerrar|true|animate|mouseover|inframe|png|http|src|com|forobeta|attachments|38687d1415092509'.split('|'),0,{}))
  /*]=]=>*/
</script>

Para decode del javascript ir a esta pagina:
UnPacker

Gracias por el aporte 🙂

P.D ya edité el código, así quedaría el código ofuscado:

Inserir CODE, HTML ou PHP:

//<![CDATA[
eval(function(p,a,c,k,e,d){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--){d[e(c)]=k[c]||e(c)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('h M=s;h H=2;h v=s;h u=O;6 J(){f(t.I("K")==N||t.I("K").R<=0){$(\'#7\').b({c:$(\'#7\').q(\'p\').8(\'c\'),9:$(\'#7\').q(\'p\').8(\'9\')})}n{z()}}6 z(){h $d=$(\'#7\').q(\'p\'),j=$d.8(\'9\')/2,x=0;j=j-Q;$(\'#7\').b({c:$d.8(\'c\'),9:$d.8(\'9\')});$(\'#7\').o(\'<i P="a" r="c:\'+$d.8(\'c\')+\'e;9:\'+$d.8(\'9\')+\'e"><i r="F-10:\'+j+\'e"><11 T="g" 12="g" Y="g.Z" U="V" r="F:\'+1.4(1.3()*k+5)+\'e 0 0 \'+1.4(1.3()*l+5)+\'e"/>\'+$(\'#a\').o()+\'</i></i>\'+$(\'#7\').o());f(M==s){$(\'#g\').W(6(){f(x==H){$(m).D(6(){$(\'.a\').L(\'G\');f(v){x=0;E(6(){$(".a").b(\'A\',\'C\');$(m).b({y:1.4(1.3()*k+5),w:1.4(1.3()*l+5)})},u*B)}})}n{x++;$(m).X({y:1.4(1.3()*k+5),w:1.4(1.3()*l+5)})}})}n{$(\'#g\').D(6(){$(\'.a\').L(\'G\');f(v){E(6(){$(".a").b(\'A\',\'C\');$(m).b({y:1.4(1.3()*k+5),w:1.4(1.3()*l+5)})},u*B)}})}}$(t).S(J);',62,65,'|Math||random|floor||function|IDDIVIFRAME|attr|height|cod|css|width|frm|px|if|cerrar|var|div|Mtop|230|280|this|else|html|iframe|find|style|true|document|segundos|recargar|marginLeft||marginTop|publicidad|display|1000|block|click|setTimeout|margin|fast|mueve|getElementById|cicklow_XcVCCW|XcVCCW|fadeOut|mover|null|180|class|125|offsetHeight|ready|alt|title|Cerrar|mouseover|animate|src|png|top|img|id'.split('|'),0,{}))
//]]>

LuisNara · 25/01/2015

kanikase disse:

XD Ya lo arreglé, ya edité el código, cuando haya AdBlock o alguna otra extensión que bloque la publicidad, si se cargará el iframe en forma normal (sin publicidad), cuando no haya AdBlock si se cargará con publicidad 🙂 puedes verlo en el demo

P.D Usé el script de [MENTION=9679]cicklow[/MENTION] para detectar el AdBlock :witless:

- - - Actualizado - - -

Gracias por el aporte 🙂

P.D ya edité el código, así quedaría el código ofuscado:

Inserir CODE, HTML ou PHP:

//<=!=[=C=D=A=T=A=[
eval(function(p,a,c,k,e,d){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--){d[e(c)]=k[c]||e(c)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('h M=s;h H=2;h v=s;h u=O;6 J(){f(t.I("K")==N||t.I("K").R<=0){$(\'#7\').b({c:$(\'#7\').q(\'p\').8(\'c\'),9:$(\'#7\').q(\'p\').8(\'9\')})}n{z()}}6 z(){h $d=$(\'#7\').q(\'p\'),j=$d.8(\'9\')/2,x=0;j=j-Q;$(\'#7\').b({c:$d.8(\'c\'),9:$d.8(\'9\')});$(\'#7\').o(\'<i P="a" r="c:\'+$d.8(\'c\')+\'e;9:\'+$d.8(\'9\')+\'e"><i r="F-10:\'+j+\'e"><11 T="g" 12="g" Y="g.Z" U="V" r="F:\'+1.4(1.3()*k+5)+\'e 0 0 \'+1.4(1.3()*l+5)+\'e"/>\'+$(\'#a\').o()+\'</i></i>\'+$(\'#7\').o());f(M==s){$(\'#g\').W(6(){f(x==H){$(m).D(6(){$(\'.a\').L(\'G\');f(v){x=0;E(6(){$(".a").b(\'A\',\'C\');$(m).b({y:1.4(1.3()*k+5),w:1.4(1.3()*l+5)})},u*B)}})}n{x++;$(m).X({y:1.4(1.3()*k+5),w:1.4(1.3()*l+5)})}})}n{$(\'#g\').D(6(){$(\'.a\').L(\'G\');f(v){E(6(){$(".a").b(\'A\',\'C\');$(m).b({y:1.4(1.3()*k+5),w:1.4(1.3()*l+5)})},u*B)}})}}$(t).S(J);',62,65,'|Math||random|floor||function|IDDIVIFRAME|attr|height|cod|css|width|frm|px|if|cerrar|var|div|Mtop|230|280|this|else|html|iframe|find|style|true|document|segundos|recargar|marginLeft||marginTop|publicidad|display|1000|block|click|setTimeout|margin|fast|mueve|getElementById|cicklow_XcVCCW|XcVCCW|fadeOut|mover|null|180|class|125|offsetHeight|ready|alt|title|Cerrar|mouseover|animate|src|png|top|img|id'.split('|'),0,{}))
//]=]=>

Si se ve, pero ahora no se puede cerrar la publicidad :fatigue:

http://i.imgur.com/r0leiy8.png

Uso adblock plus.

kanikase · 25/01/2015

LuisNara disse:
Si se ve, pero ahora no se puede cerrar la publicidad :fatigue:

http://i.imgur.com/r0leiy8.png

Uso adblock plus.

Que raro :O eso te sale cuando usas AdBlock?

AlanGuerrero · 25/01/2015

kanikase disse:
Que raro :O eso te sale cuando usas AdBlock?

A mí igual. Cuando pauso el AdBlock sale todo normal, se puede cerrar, pero cuando lo activo sólo aparece el cuadro, sin la opción para cerrarlo.

Carambel · 25/01/2015

Genial aporte gracias :encouragement:

Sent from my Nokia Lumia 520 using Tapatalk

kanikase · 25/01/2015

LuisNara disse:
Si se ve, pero ahora no se puede cerrar la publicidad :fatigue:

http://i.imgur.com/r0leiy8.png

Uso adblock plus.

AlanGuerrero disse:
A mí igual. Cuando pauso el AdBlock sale todo normal, se puede cerrar, pero cuando lo activo sólo aparece el cuadro, sin la opción para cerrarlo.

A ver ahora.

AlanGuerrero · 25/01/2015

kanikase disse:
A ver ahora.

Sigue igual. 😱nthego:

kanikase · 25/01/2015

AlanGuerrero disse:
Sigue igual. 😱nthego:

A ver ahora :sorrow:

AlanGuerrero · 25/01/2015

kanikase disse:
A ver ahora :sorrow:

Me sigue apareciendo igual. Sólo desactivando AdBlock puedo cerrar el cuadro.

kanikase · 25/01/2015

Que mal :neglected: mañana veo, hoy ya tengo sueño :drunk:

LuisNara · 25/01/2015

Te envié un MP con un ejemplo :encouragement:

Mauri Olmedo · 25/01/2015

Eso de que se mueva la cruz es legal para adsense?

kanikase · 25/01/2015

elchicodelentes disse:
Eso de que se mueva la cruz es legal para adsense?

No, tampoco es legal usar AdSense así :distant:

magno16 · 26/01/2015

con que monetizan

amigos con que sistema de monetización es bueno para usar ese script?

gracias

kanikase · 26/01/2015

magno16 disse:
amigos con que sistema de monetización es bueno para usar ese script?

gracias

Cualquiera CPA :drunk: Adbooth o CPM Rocket :encouragement:

LuisNara · 26/01/2015

magno16 disse:
amigos con que sistema de monetización es bueno para usar ese script?

gracias

Juicyads me funcionó muy bien con esa publicidad :encouragement:

propa · 26/01/2015

LuisNara disse:
Juicyads me funcionó muy bien con esa publicidad :encouragement:

Pero creo que no esta permitida, que se mueva la "X"

LuisNara · 26/01/2015

propa disse:
Pero creo que no esta permitida, que se mueva la "X"

Pero ese movimiento se puede eliminar, yo lo hice con mi script.

Tutorial: Publicidade "InFrame"

Zentraedi

Andres128

kanikase

LuisNara

kanikase

AlanGuerrero

Carambel

kanikase

AlanGuerrero

kanikase

AlanGuerrero

kanikase

LuisNara

Mauri Olmedo

kanikase

magno16

kanikase

LuisNara

propa

LuisNara

Tópicos similares