Ver Mensaje Individual
  #1 (permalink)  
Antiguo 15/10/2006, 04:11
Avatar de metacortex
metacortex
Viejo demente
 
Fecha de Ingreso: junio-2004
Ubicación: Caracas - Venezuela
Mensajes: 9.027
Antigüedad: 19 años, 10 meses
Puntos: 832
Tutorial: Rotador de banners en tu web

Hace un tiempito tuve la necesidad de montar un rotador de banners para cierto proyecto. Probé como 9 y me quedé con uno, el cual me resultó el más sencillo, ligero y versátil que pude encontrar.

Características del Ruscom Ad-Rotator:

a) Un archivo liviano, configurable y bastante escalable.

b) Acepta cualquier medida de banners.

c) Puedes colocar la cantidad de imágenes que desees, con distintas medidas y en cualquier parte de tu web.

d) Muy importante: Como no actúa con iframes, mantiene tu página dentro de los estándares y 100% validada por la W3C aunque la tengas como Strict.

Instalación:

Se trata de 1 solo archivo PHP que puedes colocar en cualquier parte de tu web. Luego haces la llamada al mismo con un simple código. Veamos cómo se hace esto:

1.- Baja el archivo comprimido desde aquí: http://russcom.net/scripts/russcom.adrotator.zip

2.- Luego que lo descomprimes te encuentras con 2 archivos, el ad-rotator.php (luego lo puedes renombrar como quieras) y un Readme.txt que tiene información de instalación, así como del creador del script.

3.- Sube el archivo por FTP al directorio de tu preferencia de tu web. O créate uno si es tu deseo.

4.- Sube tus imágenes a ese o cualquier directorio de tu web. Las dimensiones de las mismas son libres, tú decides.

5.- Ya teniendo todo subido abres el archivo ad-rotator.php con un editor online (También puedes editarlo offline y luego subirlo, como quieras). Examinemos de qué se compone el archivo:

Cita:
// State how many ads there are in total (max: 15)
$total_ads = 1;
En esta línea vas a colocar el número de banners que tengas disponibles para esa sección de la página. El archivo acepta máximo 15, pero puedes colocar los *.php que desees, así que no hay límites.
____________________________________

Cita:
// No need to edit
$rand_ban = rand(1,$total_ads);
No necesitas editar esto.
____________________________________

Cita:
// Banner size
$banner_width = 468;
$banner_height = 60;
Esto se explica por sí mismo. Aquí defines el ancho y alto de la imagen.
____________________________________

Cita:
// Decide on if you want it to create a new window or not when
// the ad is clicked.
// 1 = new window
// 2 = same window
$window = 1;
"1" para que las páginas linkeadas abran en una nueva ventana y "2" para que abran en la misma.
____________________________________


Ok, ya teniendo esto configurado pasemos a la parte buena, que es donde vamos a colocar los datos de los banners y sus respectivos links. De hecho en el primer array te dan un ejemplo. Veamos:

Código:
$ad_1 = array("http://hostrs.com/banner.jpg",
              "http://hostrs.com",
              "hostrs.com | Get Your best Scripts here");
Como puedes notar existen 3 líneas:
  • La ruta de la imagen.
  • El link donde ésta va.
  • El texto alternativo de esa imagen. Con eso ya queda configurado tu archivo para ir a la acción.
____________________________________


6.- Colocar el banner en nuestra página

Simple. Sólo agregas el siguiente código a la parte de tu web que desees:

Código PHP:
<?php include("ad-rotator.php"); ?>
Un ejemplo sería éste:
Código HTML:
<div id="pepe">
	<div class="banner">
		<?php include("ad-rotator.php"); ?>
	</div>
</div> 
... donde cada clase debes definirla en tu hoja de estilos (Para más información al respecto visita el foro de CSS).


FAQ

• Sólo me muestra pocas imágenes ¿Cuál será el problema?

R: Hay un detalle que debes arreglarle a ese script. Vé a la zona de las variables (Aprox. línea 85) y fíjate en las primeras líneas, sobre todo la parte resaltada:

Cita:
if($rand_ban == 1){
$show_ad_image_url = $ad_1[0];
$show_ad_url = $ad_1[1];
$show_ad_description = $ad_1[2];

} elseif($rand_ban == 2) {
$show_ad_image_url = $ad_2[0];
$show_ad_url = $ad_2[1];
$show_ad_description = $ad_2[2];

} elseif($rand_ban == 3) {
$show_ad_image_url = $ad_3[0];
$show_ad_url = $ad_3[1];
$show_ad_description = $ad_3[2];
Como puedes ver hay un [1] siempre al final. No sucede así con la 4ta variable en adelante, mira:

Cita:
} elseif($rand_ban == 4) {
$show_ad_image_url = $ad_4[0];
$show_ad_url = $ad_4[4];
$show_ad_description = $ad_4[2];
Ese [4] cámbialo a [1] y problema resuelto. Haz así con todas las demás también. No sé por qué está así. Quizás está hecho con intención pero la solución es esa.

Por lo demás espero que te sirva este rotador de banners, ya que a mí me ha caído como anillo al dedo. Cualquier duda o problemas puedes formularla por aquí mismito.

Saludos.

Última edición por metacortex; 29/01/2007 a las 20:45