Publicidad en vídeos

Hola amigos 😀 hoy en este tutorial les enseñaré a agregar publicidad en vídeos (iframe), pero primero que nada explicaré algunas cosas:

Yo antes cuando tenía un blog de vídeos, quería mostrar publicidad en los vídeos así como lo hacen otras webs, por ejemplo las de TV Online, y hasta el mismo Youtube, estuve buscando muchooo en Google, encontré pocos resultados, y entre esos pocos, solo una fracción de los tutoriales que habían “funcionada” (sí, entre comillas). No lo hacían de forma automática si no que cada vez que agregaba un vídeo, tenía que volver a agregar el código de publicidad y era bastante tedioso.

Importante!
No se debe agregar publicidad de AdSense, está en contra de sus normas.

Por eso es que mejor yo pensé en mejor hacerlo yo, así que empecé a escribir código, y hasta que al final dio resultado 😀 como se que algunos de ustedes también buscan, compartiré con ustedes el código.

Agregando la publicidad

Para empezar, primero nos vamos a ir a nuestros Panel de Blogge -> el blog -> Plantilla -> Editar HTML, ya ahí bamos a buscar <body> si no les aparece, buscar solo body pero debe ser igual, debe ser la etiqueta HTML, bueno ya encontrada esa línea, justo debajo vamos agregar el siguiente código HTML y javascript (JQuery):

<script type=’text/javascript’ src=’//a-bloggers.googlecode.com/svn/trunk/publicidad.js’></script>
<script type=’text/javascript’>
var mover = true; //Se mueve o no se mueve el boton cerrar (true o false)
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>

Sólo editaremos la parte que dice “AQUÍ TU CÓDIGO DE PUBLICIDAD”, y como dice, en su lugar agregaremos el código de nuestro anuncio, que debe ser 300×250.
Ahora vamos a agregar los estilos, para eso vamos a buscar ></b:skin> y justo arriba agregamos los siguientes estilos:

#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;
}

Una vez hecho eso guardamos, y ahora vamos a lo más fácil 😀 poner el iframe y la publicidad en él de forma automática, para esto vamos a donde queramos que aparezca, ya sea una entrada, un Gadget o en el mismo código HTML, pegamos el siguiente código:

<div id=”IDDIVIFRAME”>
<iframe width=’800′ height=’500′ src=’https://www.youtube.com/embed/FHtvDA0W34I” frameborder=’0′ allowfullscreen></iframe>
</div>

Sólo cambian width por el ancho que quieran en pixeles, height por el alto que quieran, igual en pixeles y src por la url del iframe, también lo pueden obtener solo de Youtube, agregando el código del iframe dentro del div, eliminando el otro iframe.
Y eso sería todo en este tutorial 😀

Demo:



AQUÍ TU CÓDIGO DE PUBLICIDAD