Cómo agregar banners rotativos a tu sitio web en WordPress

  • Autor Autor Usuario eliminado 7982
  • Fecha de inicio Fecha de inicio
U

Usuario eliminado 7982

Hola, hace poco puse banners rotativos como logo en mi pagina y quedo muy bien, asi que lo comparto con ustedes.

Lo que tienen que hacer es pegar este codigo en el archivo header.php en el "Editor" en Wordpress. (Enlace eliminado sitio web .com/wp-admin/theme-editor.php). Lo pegan debajo de

Insertar CODE, HTML o PHP:
	<div id="branding" class="clearfix">

o por allí cerca donde vean la palabra "logo".

Código:


Insertar CODE, HTML o PHP:
<SCRIPT language=JavaScript>
 /*
  +---------------------------------------------------------+
  | Ad Simple                 Copyright www.YugDesign.com   |
  +---------------------------------------------------------+
  | This program may be used and hosted free of charge by   |
  |anyone for personal purpose as long as this copyright    |
  |notice remains intact.                                   |
  +---------------------------------------------------------+
 */
 
 var img_width = "980";
 var img_height = "100";
 var img_title = "Titulo de las imagenes";

 
 var ad=new Array()
 //insert here your images src
 ad[0]='http://imagen 0.png';
 ad[1]='http://imagen 1.png';
 ad[2]='http://imagen 2.png';
 

 var xy=Math.floor(Math.random()*ad.length);
 document.write('<img src="'+ad[xy]+'" width="'+img_width+'" height="'+img_height+'" alt="'+img_title+'">');
 </SCRIPT>


Datos importantes: No se olviden de poner el numero de la imagen dentro del "ad[2]=" llendo desde 1 en adelante (como esta en el codigo que les pase)

Pueden agregar todos los que quieran (yo tengo 23, por ahi).

Si quieren que ese banner tenga un link (por ejemplo, a la pagina principal) tienen que usar este codigo:



Insertar CODE, HTML o PHP:
<SCRIPT language=JavaScript>
/*
 +---------------------------------------------------------+
 | Ad Simple                 Copyright www.YugDesign.com   |
 +---------------------------------------------------------+
 | This program may be used and hosted free of charge by   |
 |anyone for personal purpose as long as this copyright    |
 |notice remains intact.                                   |
 +---------------------------------------------------------+
*/

var img_width = "468";
var img_height = "60";
var img_title = "Titulo de la Imagen";


var ad=new Array()
//insert here your images src
ad[0]='http://imagen 0.png';
ad[1]='http://imagen 1.png';
ad[2]='http://imagen 2.png';

var links=new Array()
//insert here your links
links[0]='http://www.links1';
links[1]='http://www.links2';
links[2]='http://www.links3';

var xy=Math.floor(Math.random()*ad.length);
document.write('<a href="'+links[xy]+'" target="_blank"><img src="'+ad[xy]+'" width="'+img_width+'" height="'+img_height+'" alt="'+img_title+'"></a>');
</SCRIPT>



Eso tambien lo pueden usar para mostrar aununcios aleatorios, cada uno con su link diferente. En caso que lo usen como logo simplemente ponen la misma url para todas las imagenes en los links y listo.


Espero que les sirva, a mi me gusto como quedo en la mia.

un saludo a todos!.
 
Última edición por un moderador:
No se puede enlazar pornografia.

8. Prohibido enlazar cualquier referencia pornográfica. Tanto enlaces a contenidos pornográficos como presentar blogs de esta categoría.
(10 puntos de infracción / expiración de 1 mes).

Modifica el post please.
 
Lo probé y funciona, aunque tengo una duda (debido a que el tema es de hace años, si alguien quiere responderla...), ¿cada cuánto cambia de anuncio?
 
Lo probé y funciona, aunque tengo una duda (debido a que el tema es de hace años, si alguien quiere responderla...), ¿cada cuánto cambia de anuncio?

con cada carga del sitio
 
con cada carga del sitio

¿No habría una forma de modificar el script para que cambie cada ciertos segundos? ¿O eso es un script completamente diferente?
 
¿No habría una forma de modificar el script para que cambie cada ciertos segundos? ¿O eso es un script completamente diferente?

Tendras que usar: Window setTimeout() Method para el tiempo. Y meter todo en una funcion...

HTML:
<SCRIPT language=JavaScript>
function RotarBanners(){
 var img_width = "468";
 var img_height = "60";
 var img_title = "Titulo de la Imagen";

 var ad=new Array()
 //insert here your images src
 ad[0]='http://imagen 0.png';
 ad[1]='http://imagen 1.png';
 ad[2]='http://imagen 2.png';

 var links=new Array()
 //insert here your links
 links[0]='http://www.links1';
 links[1]='http://www.links2';
 links[2]='http://www.links3';

 var xy=Math.floor(Math.random()*ad.length);
 document.write('<a href="'+links[xy]+'" target="_blank"><img src="'+ad[xy]+'" width="'+img_width+'" height="'+img_height+'" alt="'+img_title+'"></a>');
setTimeout(function(){ RotarBanners() },10000); //10 segundos
}
setTimeout(function(){ RotarBanners() },10000); //10 segundos
</SCRIPT>
 
Tendras que usar: Window setTimeout() Method para el tiempo. Y meter todo en una funcion...

HTML:
<SCRIPT language=JavaScript>
function RotarBanners(){
 var img_width = "468";
 var img_height = "60";
 var img_title = "Titulo de la Imagen";

 var ad=new Array()
 //insert here your images src
 ad[0]='http://imagen 0.png';
 ad[1]='http://imagen 1.png';
 ad[2]='http://imagen 2.png';

 var links=new Array()
 //insert here your links
 links[0]='http://www.links1';
 links[1]='http://www.links2';
 links[2]='http://www.links3';

 var xy=Math.floor(Math.random()*ad.length);
 document.write('<a href="'+links[xy]+'" target="_blank"><img src="'+ad[xy]+'" width="'+img_width+'" height="'+img_height+'" alt="'+img_title+'"></a>');
setTimeout(function(){ RotarBanners() },10000); //10 segundos
}
setTimeout(function(){ RotarBanners() },10000); //10 segundos
</SCRIPT>

Gracias pero no le entendí muy bien, prácticamente no sé sobre programación. 😕

Aún así pude agregar un banner rotativo (por segundos). Indagué por Google y me topé con esto: Rotación de banners con Javascript, por si alguien tiene la misma duda que yo. :encouragement:
 
Atrás
Arriba