Tutorial: Calificación: Poner publicidad sobre cualquier iframe con boton cerrar

riqueza

Gamma
Verificación en dos pasos desactivada
Verificado por Whatsapp
¡Usuario con pocos negocios!
Desde
7 Jun 2014
Mensajes
189
Buenos días usuarios de forobeta el dia de hoy les traigo este sencillo tutorial de como poner publicidad sobre cualquier iframe que tengan en su sitio sin la necesidad de estar editando cada entrada solamente ponemos este código y ponemos el código de nuestra publicidad y listo en automático detectara todos los iframes de nuestro sitio y pone la publicidad sobre el video y con un botón de cerrar que se mueve de lugar cuantas veces nosotros queramos sin mas les dejo los pasos:

1. Primero que nada debemos de ir a nuestro editor de plantillas y buscar <body> justo debajo de esta linea colocamos el siguiente código:
:welcoming:
Código:
<script type="text/javascript" src="a-bloggers.googlecode.com/svn/trunk/publicidad.js">
<script type="text/javascript">
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 (true o false)
var segundos = 180; //Si se recargara, en cuantos segundos
window.onload = cicklow_XcVCCW;
</script>
<img src="a-bloggers.googlecode.com/svn/trunk/cerrar.png?" width="1" height="1" id="XcVCCW">
<div id="cod">
AQUÍ TU CÓDIGO DE PUBLICIDAD
</div>

Solamente debemos de recordar editar si el botón de cerrar se mueve o no, cuantas veces se mueve, si recargamos nuestra publicidad a cierto tiempo o no y cuantos segundos si es que recargamos nuestra publicidad, también cambiar "aqui tu codigo de publicidad" por nuestro script o iframe que nos a dado nuestra empresa de publicidad.
Ahora deberemos de añadir en nuestro style.css o en donde tengamos nuestro css del theme o diseño el siguiente código que es lo que le da el diseño a la ventana de publicidad que se muestra sobre cada iframe:

Código:
#cod{
display: none;
}
.cod{
position: absolute;
}
.cod div {
width: 300px;
height: 250px;
margin: auto;
background: #EEE;
}
#cerrar {
position: absolute;
width: 15px;
cursor: pointer;
}
#IDDIVIFRAME{
display: inline-block;
}

Ahora por ultimo solo debemos de colocar nuestro iframe dentro del siguiente div de esta manera:

Código:
<div id="IDDIVIFRAME">
<iframe width="800" height="500" src="https://www.youtube.com/embed/FHtvDA0W34I" frameborder="0" allowfullscreen></iframe>
</div>

y listo ya quedara nuestra publicidad dentro de cada iframe
 

ferron2002

Baneado
Zeta
Verificación en dos pasos desactivada
Desde
7 Ago 2015
Mensajes
1.525
buen codigo lo probare a ver q tal
 

HeroBeta

Baneado
Gamma
Redactor
Verificación en dos pasos desactivada
Desde
11 May 2016
Mensajes
249
Gracias buen post
 

riqueza

Gamma
Verificación en dos pasos desactivada
Verificado por Whatsapp
¡Usuario con pocos negocios!
Desde
7 Jun 2014
Mensajes
189
De nada amigo
 

H3CBL

Delta
Verificación en dos pasos activada
Verificado por Whatsapp
Desde
25 Ene 2015
Mensajes
743
Gracias por el aporte... es de buena utilidad :encouragement:
 
Última edición:

tavitooo

Épsilon
Verificación en dos pasos desactivada
Verificado por Whatsapp
Desde
4 Jun 2013
Mensajes
981
Del link inicial de donde jala js no carga la web por lo que imagino no cargara el js.!! este es el link a-bloggers.googlecode.com/svn/trunk/publicidad.js
 

Janlysp

Épsilon
Verificación en dos pasos desactivada
Desde
28 Abr 2015
Mensajes
773
Gracias por el aporte!!
 

Amenazzy

Baneado
Gamma
Diseñador
Verificación en dos pasos desactivada
Desde
1 Jun 2016
Mensajes
379
Lo leeré mas tarde
 

Crap

Gamma
Verificación en dos pasos desactivada
Verificado por Whatsapp
Desde
25 Mar 2014
Mensajes
309
Muy bueno, gracias por el aporte:encouragement:
 

ferron2002

Baneado
Zeta
Verificación en dos pasos desactivada
Desde
7 Ago 2015
Mensajes
1.525
EFECTIVAMENTE no funciona el publicidad.js

esta roto y el boton de cerrar tb

- - - Actualizado - - -

he conseguido el js pero sigue sin funcionar el anuncio no se muestra :( [MENTION=110269]riqueza[/MENTION]
 

Doroteo78

Iota
Verificación en dos pasos desactivada
Desde
30 Jun 2014
Mensajes
2.249
No me funciona el enlace, alguna otra opción para hacerlo que se muestre correctamente? Parece bueno el truco
 

chobo3

Gamma
Verificación en dos pasos desactivada
Verificado por Whatsapp
¡Usuario con pocos negocios!
Desde
10 Ago 2014
Mensajes
250
gracias por el aporte..
mas tarde lo pruebo,,,
 

Elinauta

Baneado
Delta
Programador
Verificación en dos pasos desactivada
Desde
19 Abr 2014
Mensajes
621
excelente aporte
 

Siken

Delta
Diseñador
Verificación en dos pasos desactivada
Desde
11 Jul 2011
Mensajes
681
Alguien que lo tenga funcionando? el .js no va :D
 

kj2

Iota
Verificación en dos pasos activada
Desde
1 Abr 2011
Mensajes
2.163
Será cosa de preguntarle a [MENTION=9679]cicklow[/MENTION], ese código me parece que fue hecho por él :p.

kj
 

cicklow

Admin
VIP
Gamma
Verificado con documento
Verificación en dos pasos activada
Verificado por Whatsapp
¡Ha verificado su Paypal!
Desde
30 May 2011
Mensajes
151
Alguien que lo tenga funcionando? el .js no va :D
PHP:
function cicklow_XcVCCW(){if(document.getElementById("XcVCCW")==null || document.getElementById("XcVCCW").offsetHeight<=0){$('#IDDIVIFRAME').css({width:$('#IDDIVIFRAME').find('iframe').attr('width'),height:$('#IDDIVIFRAME').find('iframe').attr('height')});}else{publicidad();}}function publicidad(){var $frm=$('#IDDIVIFRAME').find('iframe'),Mtop=$frm.attr('height')/2,x=0;Mtop=Mtop-125;$('#IDDIVIFRAME').css({width:$frm.attr('width'),height:$frm.attr('height')});$('#IDDIVIFRAME').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="//a-bloggers.googlecode.com/svn/trunk/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>'+$('#IDDIVIFRAME').html());if(mover){$('#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);}});}}
http://web.archive.org/web/20160113125140/http://a-bloggers.googlecode.com/svn/trunk/cerrar.png
 

kanikase

Préstamo
Ómicron
Programador
Verificación en dos pasos activada
Verificado por Whatsapp
Desde
22 Feb 2014
Mensajes
4.566
Será cosa de preguntarle a [MENTION=9679]cicklow[/MENTION], ese código me parece que fue hecho por él :p.

kj
Ese código es mío XD
"a-bloggers" = "Ayudar Bloggers", un blog que yo tenía... :neglected:
 

kj2

Iota
Verificación en dos pasos activada
Desde
1 Abr 2011
Mensajes
2.163
Del foro me sonaba, aunque tocó que al final cicklow si tenía el código del js.

kj
 

Arriba