|
Tutorial de como montarte
una galería fotográfica utilizando flash. Una forma
sencilla y fácil de crearte tus propias galerías en tus
paginas con muy poco peso ( descarga rápida ) muy vistosa
y funcional. Agradecemos a
AIRTIGHT Interactive por esta estupenda
aplicación
gratuita denominada SimpleViewer

Lo primero necesitaremos algunos
archivos. Nos hemos tomado la libertad de modificarlos a
nuestras necesidades y simplificarlos para el uso que
nosotros le vamos a prestar, utilizando esta galería Flash
en una pagina simple HTML sin necesidad de otros
parámetros ( Sin bases de datos, ni PHP, ASP, ni muchas
otras opciones y maneras de poder utilizar esta aplicación.
Para usuarios de alguno de los leguajes de programación
anteriores en la pagina de sus autores tenéis todo lo
necesario para poder utilizarla también. PHP, ASP,
ColdFusion, Perl. )
Solo con HTML Bajatelos de aquí
Descargar
( Archivos comprimidos en zip )
Lo primero necesitaras crearte una carpeta donde
descomprimir los archivos que vamos a utilizar para
nuestra galería, no estaría de mas que ya te la crees en
el directorio de tu Web. ( llámala "Mi Galería" por
ejemplo ) como si montáramos otro apartado o sección de
nuestras paginas. Dentro una vez descomprimida
encontraremos estos archivos
Una
pagina normal html. Que es donde mostraremos la
galería. Podemos utilizar cualquier pagina que necesitemos
( para los que utilizan su misma plantilla ya configurada
y diseñada a su gusto ) ya que lo único que
tendremos que hacer es incrustarle el archivo SWF para que
funcione junto a los otros componentes. ( quiero decir que
estén los otros archivos en el mismo directorio que la
pagina, se entiende ¿ no ? En realidad esta pagina
no será necesaria si utilizas una creada por ti. Te puede
servir como pruebas y ejemplo.
El archivo ImageData XML. Que es otra pagina desde
donde configuraremos el aspecto de nuestra galería, color
de fondo, bordes, tamaño de la imagen principal que se
muestra, ,,,,,
Una carpeta THUMBS Donde guardaremos las imágenes
miniaturas de la galería.
IMPORTANTE
estas tienen que ser de 45x45 píxeles.
Una carpeta IMAGES Donde pondremos las fotos
originales.
Aclaración: Nosotros utilizamos el XnView un programa
gratuito y de insuperables prestaciones para tratamiento
de imágenes, lo puedes descargar de
AQUÍ y en Español. Entre algunas de sus
opciones tienes la de conversión por lotes, eliges la
carpeta donde tienes las imágenes grandes IMAGES y te las
convierte todas a otro tamaño directamente, las miniaturas
por ejemplo, solo le tenemos que decir que la conversión
la guarde en la carpeta Thumbs y trabajo listo.
Últimamente se dispone de infinidad de programas
gratuitos y que realizan esta función, incluido el que te
ofrece GOOGLE el
Picasa.
La galería Flash. VIEWER.swf Este
será el resultado y donde se mostrara nuestro trabajo,
solo tenemos que insertar este complemento en nuestra
pagina.
Comencemos a trabajar. Si ya lo tienes
todo listo y preparado , las imágenes grandes ( originales
) en la carpeta Images, las imágenes pequeñas ( las
mismas que las grandes pero en miniatura de 45x45 ) en la
carpeta Thumbs la pagina Web donde piensas poner la
galería con su hueco preparado para insertarla,
empezaremos a configurar nuestra galería.
Editaremos el archivo ImageData.XML
Muy
fácil , con el propio bloc de notas, el FrontPage, ,,,,,
Fijémonos en el código: Todo es configurable y lo
podemos modificar a nuestra necesidad y gusto.
<SIMPLEVIEWER_DATA
maximageDimension="450" ( Este será el tamaño
de la imagen principal que se mostrara en la galería )
textColor="0x0066ff" (
Este será el color en el que aparecerán los textos y
flechas de la galería. Modifica a tu gusto después de la
x, para que lo entiendas mejor las ultimas 6 cifras )
ROJO = FF0000
VERDE = 00FF00
AZUL = 0000FF
NARANJA = FF8000
BLANCO = FFFFFF
NEGRO = 000000
Si buscas en google colores HTML
encontraras cientos de tablas y sus valores.
frameColor="0x......"
( Este es el color que tendrá el borde que rodea las
miniaturas )
bgColor="0x......" (
Este será el color del fondo al cambiar la imagen
principal de la galería )
frameWidth=".." ( Este
será el borde que tendrá la imagen principal de la galería
)
stagePadding=".." (
Esta será la separación que tendrá la imagen principal de
las miniaturas )
thumbnailColumns="." (
Aquí defines cuantas columnas de miniaturas quieres en la
galería. Verticales.)
thumbnailRows="." (
Aquí cuantas columnas Horizontales )
navPosition="....." (
Aquí si quieres la imagen principal a la izquierda,
derecha, arriba, abajo. ) navDirection="..."
( Aquí la dirección. Puedes dejarlo como esta )
title="........" ( Aquí el titulo que quieras ponerle a tu
galería ).
Ahora configuramos las imágenes nuestras: <IMAGE>
<NAME> NOMBRE DE TU FOTO </NAME>
<CAPTION> Descripción o titulo de la foto, además
puedes incluir código como enlaces al exterior, etc,etc.
</CAPTION></IMAGE>
Todo esto, ( de la etiqueta <image> a </image> ) lo
podemos repetir cuantas veces sea necesario, según nuestra
necesidad y cantidad de fotos que queramos incluir.
Automáticamente se crearan las diferentes tablas de
miniaturas en nuestra galería.
Recuerda al terminar tu configuración de GUARDAR el
archivo con el mismo nombre y en el mismo lugar que lo
tenias ImageData.xml Ahora si abres la pagina
index.html tendrías que ver correctamente funcionando tu
galería.
AQUÍ TIENES UN EJEMPLO de como funciona una de las
nuestras.
Para insertar la galería en una pagina
diseñada a tu manera y con las características de tu
sitio. Lo único que tienes que hacer es insertarle el
archivo viewer.swf en el lugar que quieras que aparezca y
redimensionarlo a tus medidas. ¿ como ? En FrontPage
seria: Desde el menú superior de nuestro editor, Insertar
→ Componente Web → Controles avanzados
→ Complemento. ( con
el botón examinar localizamos el archivo viewer.swf ) Lo
agrandamos a la medida necesitada y listo. Ya tendremos
nuestra galería insertada en nuestra pagina. Para cambiar
el color de fondo de la galería, una vez insertada en tu
pagina mira el código fuente y en atributo dentro de la
etiqueta <embed> cambia el valor de este parámetro
bgcolor="#0000FF"> RECUERDA
guardar tu pagina en la misma carpeta donde están los
otros archivos. ( Puedes guardar la pagina con el nombre
que quieras lo importante es que este esta en la misma
carpeta que todo lo demás, ahora solo tienes que enlazarla
como una pagina mas en tu sitio y a disfrutar. ) Puedes
crearte tantas carpetas como galerías necesites, pero
siempre en carpetas distintas, quiere decir en otros
subdirectorios. Añade los archivos xml, swf, las carpetas
thumbs, images modifica su configuración a tu nueva
necesidad y podrás montar otra galería. Bueno espero que
esto os sirva de gran ayuda y por supuesto lo disfrutéis
tanto como nosotros.
JoseWEB.
|