05 SWF Tools

http://127.0.0.1:51235/temp_print_dirs/eXeTempPrintDir_wjazkf/05_s...
Contidos Flash (SWF Tools)

As SWF Tools ofertan a integración de © Macromedia Flash con reproductores de Vídeo, de MP3 e de visores de imaxes.
Neste documento veremos a configuración dos módulos que integran estas ferramentas así como a publicación de distintos tipo de
medios.
1 de 19 11/03/2014 19:01
Configuración básica inicial
Na ruta Inicio » Administrar » Construción do sitio » Módulos podemos ver o conxunto de módulos activos na nosa web.
Como se pode ver na seguinte imaxe, o conxunto de módulos activos das SWF Tools na configuración inicial dun novo sitio de Webs
Dinámicas está formado por estes módulos:
SWF Tools: é o nucleo destas ferramentas e imprescindible para empezar a traballar con elas.
1 Pixel Out: é un reproductor de ficheiros de audio en formato MP3
JW Media Player 3: trátase dun reproductor de vídeos en formato flash e audios en formato MP3.
SWFObject2: Método de integración habilitado por defecto.
Este conxunto de módulos podemos clasificalos en tres grupos, segundo a súa funcionalidade:
O módulo SWF Tools: é o nucleo destas ferramentas e é preciso que esté activo para poder activar calquera dos outros.
Módulos de soporte de reproductores. Estes módulos permiten que podamos utilizar distintos reproductores de medios. Son
os seguintes: 1 Pixel Out, Flow Player, Flow Palyer 3, JW Image Rotator 3, JW Media Player 3, JW Media Player 4,
SimpleViewer.
Métodos de integración. Estes módulos permítennos utilizar distintos métodos de integración dos contidos multimedia no
código das páxinas HTML que se descargan á hora de visitar a web. Son os seguintes módulos: jQuery Flash Plugin,
SWFObject, SWFObject2, UFO.
2 de 19 11/03/2014 19:01
Informe de estado das SWF Tools
Na ruta Inicio » Administrar » Informes» SWF Tools Status podemos ver un informe sobre o estado de configuración das SWF
Tools que permítenos comprobar se temos unha configuración axeitada para a correcta reproducción dos nosos contidos multimedia.
Infórmasenos dos seguintes aspectos:
Métodos de integración dispoñibles e cal está seleccionado por defecto.
Amosarase unha proba de reprodución de contido Flash.
O reprodutor selecionado por defecto para cada tipo de contido.
Os reprodutores dispoñibles.
3 de 19 11/03/2014 19:01
O estado da librería Zlib.
4 de 19 11/03/2014 19:01
Publicación de vídeo, audio e flash
Nesta sección veremos distintas formas de incluir contidos multimedia nos contidos publicados na web.
Traballeremos con estes tipos de medios:
Ficheiros de vídeo en formato Flash (extensión .flv)

Ficheiros de audio en formato MP3 (extensión .mp3)
Ficheiros de animacións Flash (extensión .swf)
Vídeos flash embebidos.
5 de 19 11/03/2014 19:01
Ficheiro de vídeo Flash (.flv) con [swf file]
1. Para que a visualización do vídeo sexa posible é preciso que estea activo o filtro das SWF Tools no formato de entrada que
vaiamos a utilizar, normalmente Full HTML. Para comprobalo ou activalo iremos á ruta Inicio » Administrar » Configuración
do sitio » Formatos de entrada e iremos á configuración do formato desexado:
2. Unha vez dentro da configuración do formato de entrada elixido, marcamos o cadro de seleción do filtro "SWF Tools filter" e
logo pinchamos no botón Gardar a configuración:
Estes dous primeiros pasos só hay que facelos unha vez, xa que pertencen á configuración da web, non á creación do
contido.
3. Agora que cumprimos os requisitos previos, procederemos a editar ou crear o contido no que queremos publicar o vídeo
Flash.
4. Na sección de Ficheiros Adxuntos achegaremos o ficheiro FLV que queremos publicar. Recoméndase que o nome do
ficheiro non conteña espazos en blanco. Neste exemplo o ficheiro é TheDrupalSongMusicVideo.flv
6 de 19 11/03/2014 19:01
5. Unha vez rematado de subir o ficheiro, no cadro donde aparece o nome o selecionamos e copiamos para logo pegalo no
corpo do contido.
6. Agora imos á sección Formato de entrada e selecionamos o formato para o cal activamos o filtro "SWF Tools filter".
7. Fáltamos ir ao cadro de edición do corpo do contido, sen desactivar o texto enriquecido, e escribir no lugar donde queremos
que apareza o vídeo unha etiqueta como a seguinte cambiado en cada caso, por suposto, o nome do ficheiro. Esta etiqueta
ten o formato [swf file="NOME_DO_FICHEIRO_FLV"].
É moi importante que respetemos o formato exacto da etiqueta: limitada por corchetes [], o nome do ficheiro entre comiñas
dobles, sen máis espazos en blanco que o que hai entre as palabras swf file. Como podemos ver nesta imaxe anterior, a
etiqueta que fai referencia ao ficheiro a reproducir pode ir entre o texto ou outros elementos do contido.
8. Xa podemos ver a Vista previa ou directamente Gardar o contido.
9. Este contido de exemplo quedaría así:
7 de 19 11/03/2014 19:01
10. Fin.
8 de 19 11/03/2014 19:01
Ficheiro de audio MP3 con [swf file]
Para a publicación dun ficheiro de audio en formato MP3 mediante a etiqueta [swf file=""] podemos utilizar exactamente o mesmo
método que usamos para os ficheros de vídeo Flash. A direfencia estará na aparencia final do contido se o reproductor configurado
para ficheiros MP3 (por defecto 1 Pixel Out) e distinto do configurado para FLV (por defecto JW Media Player 3).
1. Para que a reproducción do audio sexa posible é preciso que estea activo o filtro das SWF Tools no formato de entrada que
vaiamos a utilizar, normalmente Full HTML. Para comprobalo ou activalo iremos á ruta Inicio » Administrar » Configuración
do sitio » Formatos de entrada e iremos á configuración do formato desexado:
2. Unha vez dentro da configuración do formato de entrada elixido, marcamos o cadro de seleción do filtro "SWF Tools filter" e
logo pinchamos no botón Gardar a configuración:
Estes dous primeiros pasos só hay que facelos unha vez, xa que pertencen á configuración da web, non á creación do
contido.
3. Agora que cumprimos os requisitos previos, procederemos a editar ou crear o contido no que queremos publicar oaudio MP3.
4. Na sección de Ficheiros Adxuntos achegaremos o ficheiro MP3 que queremos publicar. Recoméndase que o nome do
ficheiro non conteña espazos en blanco. Neste exemplo o ficheiro é romance_sonambulo.mp3
9 de 19 11/03/2014 19:01
5. Unha vez rematado de subir o ficheiro, no cadro donde aparece o nome o selecionamos e copiamos para logo pegalo no
corpo do contido.
6. Agora imos á sección Formato de entrada e selecionamos o formato para o cal activamos o filtro "SWF Tools filter".
7. Fáltamos ir ao cadro de edición do corpo do contido, sen desactivar o texto enriquecido, e escribir no lugar donde queremos
que apareza o reproductor, unha etiqueta como a seguinte cambiado en cada caso, por suposto, o nome do ficheiro. Esta
etiqueta ten o formato [swf file="NOME_DO_FICHEIRO_MP3"].
É moi importante que respetemos o formato exacto da etiqueta: limitada por corchetes [], o nome do ficheiro entre comiñas
dobles, sen máis espazos en blanco que o que hai entre as palabras swf file. Como podemos ver nesta imaxe anterior, a
etiqueta que fai referencia ao ficheiro a reproducir pode ir entre o texto ou outros elementos do contido.
9. Este contido de exemplo quedaría así:
10 de 19 11/03/2014 19:01
10. Fin.
11 de 19 11/03/2014 19:01
Ficheiro de animación Flash (.swf)
Para a publicación dun ficheiro flash seguiremos un método distinto ao que utilizamos para os ficheiro de vídeo e de audio. Neste
caso utilizaremos o obxecto que nos proporciona o editor HTML de contidos.
1. Creamos ou editamos o contido no que queremos publicar a animación Flash.

2. Na sección de Ficheiros adxuntos, adxuntamos ao contido o ficheiro .swf coa animación. Neste exemplo é o ficheiro
rebotes.swf.
3. Seleccionamos e copiamos (Ctrl+c ou Menú: Editar->Copiar) a ruta completa do ficheiro que aparece debaixo do cadro de
texto co nome do mesmo.
4. Imos ao editor do texto do contido e co cursor situado lo lugar donde queremos que apareza a animación pulsamos no botón
de "Inserir / editar medio embebido"
5. Ábrese entón unha ventana para introducir os datos da animación, na que pegamos a ruta do ficheiro antes copiada no campo
Arquivo/URL da pestaña Xeral. Tamén podemos introducir as dimensións da visualización ou modificar as obtidas
automáticamente do ficheiro. Normalmente xa poderemos ver nesta ventana unha previsualización da animación. Pinchamos
no botón Insertar.
6. Se o desexamos podemos modificar a aliñación do obxecto flash creado.
12 de 19 11/03/2014 19:01
13 de 19 11/03/2014 19:01
Vídeo embebido mediante URL
Hoxe en día existen numerosas páxinas que prestan servicio de vídeo baixo demanda (Streaming), por exemplo o popular YouTube,
que nos ofrecen unha gran variedade de vídeos para poder reproducir directamente. Con este sistema, para poder ver un vídeo no
noso ordenador non é preciso descargalo previamente.
Pero estos servidores non só nos ofrecen a posibilidade de velos vídeos visitando a súa web, senón que tamén nos ofrecen a
posibilidade de insertalos na nosa páxina web ou blog mediante o enlace a unha URL ou mediante un código HTML.
Neste manual imos ver como facelo mediante un enlace a unha URL coa axuda do editor de texto enriquecido que utilizamos en Webs
Dinámicas para editar un contido. Vexamos paso a paso como facelo cun vídeo de Youtube como exemplo:
1. Navegamos por Youtube neste caso hasta chegar a páxina que nos permite visualizar o vídeo desexado.
2. Vemos que debaixo do marco de visualización aparece unha liña de enlaces: Me gusta, Información, Compartir, Añadir a. Se
pinchamos en Compartir e logo en Compartir este vídeo aparecerá debaixo un cadro de texto cunha dirección URL que
debemos copiar para logo pegar no noso contido.
Ademáis, á dereita desa URL aparece un cuadro de marcar e un contador de minutos e segundos que vai contando o tempo
transcurrido de visualización. Se marcamos o cuadro, a URL cambiará para que a visualización do vídeo logo desde a nosa
web non comence desde o principio senón desde o tempo marcado, o que nos sirve para saltar unha primeira parte do vídeo
14 de 19 11/03/2014 19:01
que non nos interese.

3. Copiada a URL anterior imos ao formulario de creación ou edición do contido da nosa web no que queremos visualizar o
vídeo, e sen desactivar o texto enriquecido, situamos o cursor na posición do corpo do contido na que queremos insertar o
vídeo e pulsamos no botón do editor de "Insertar/editar medio embebido".
4. Ábrese entón unha ventana para introducir os datos do vídeo, na que pegamos a URL antes copiada no campo Arquivo/URL
da pestaña Xeral. Tamén podemos introducir as dimensións da visualización ou modificar as obtidas automáticamente. No
campo Tipo xa cambiará automáticamente por iframe, senón o cambiamos nos. Normalmente xa poderemos ver nesta
ventana unha previsualización da animación. Pinchamos no botón Insertar.
Podemos observar que cando pegamos a URL antes copiada, esta cambia automáticamente, pero esto é correcto así, non
debemos modificala de novo. Neste exemplo, a que copiamos era "http://youtu.be/KRidWDCyk6Y" e a que queda ao pegar é
"http://www.youtube.com/embed/KRidWDCyk6Y".
5. Se o desexamos podemos modificar a aliñación do obxecto flash creado.
15 de 19 11/03/2014 19:01
Vídeo embebido mediante HTML
Hoxe en día existen numerosas páxinas que prestan servicio de vídeo baixo demanda (Streaming), por exemplo o popular YouTube,
que nos ofrecen unha gran variedade de vídeos para poder reproducir directamente. Con este sistema, para poder ver un vídeo no
noso ordenador non é preciso descargalo previamente.
Pero estos servidores non só nos ofrecen a posibilidade de velos vídeos visitando a súa web, senón que tamén nos ofrecen a
posibilidade de insertalos na nosa páxina web ou blog mediante o enlace a unha URL ou mediante un código HTML.
Neste manual imos ver como facelo mediante código HTML, opción que podemos utilizar por exemplo se o servidor de streaming non
nos ofrece o servizo mediante URL. Vexamos paso a paso como facelo, neste caso, cun vídeo de Vimeo como exemplo
(http://vimeo.com/20950555):
1. Navegamos por Vimeo neste caso ata chegar a páxina que nos permite visualizar o vídeo desexado.
2. Sobre a propia imaxe de visualización do vídeo (actualmente na esquina superior dereita) cando movemos o rato por enriba,
aparece un botón coa palabra "SHARE" (Compartir), pinchamos nel e aparécenos un panel que nos ofrece tódalas opción de
compartición do vídeo: Por enlace a URL, por correo electrónico e por inserción (Embed). Sobre esta última podemos pinchar
sobre o enlace +Show Options para poder elixir distintas opcións.
As opcións máis importantes que podemos elixir están: As dimensións da visualización (se modificamos unha a outra mantén a
proporción automáticamente); Reproducir automaticamente, Repetir ao rematar, Amosar un enlace a este vídeo en Vimeo;
Amosar unha descripción do vídeo.
3. Elixidas as opcións desexadas, selecionamos e copiamos o código HTML que aparece nun cadro de texto sobre a
previsualización no panel de opcións (<iframe src="...).
Ao pinchar neste cadro de texto selecionase automáticamente todo el. Así que o copiamos (CTRL+c ou Botón dereito ->
16 de 19 11/03/2014 19:01
Copiar).
4. Copiada o código HTML anterior imos ao formulario de creación ou edición do contido da nosa web no que queremos
visualizar o vídeo. Debaixo do cadro de edición do texto do Corpo pinchamos en Desactivar texto enriquecido para poder
escribir directamente código HTML, situamos o cursor na posición do corpo do contido na que queremos inserir o vídeo e
pegamos (CTRL+v ou Botón dereito -> Pegar) o código antes copiado.
5. Agora podemos activar de novo o texto enriquecido para continuar coa edición do contido e modificar a aliñación do obxecto
creado.
NOTA 1: Recoméndase gardar tamén este código HTML nun ficheiro de texto plano no noso ordenador, xa que quizais posteriores
edicións do contido poderían alterar este código e deixar de funcionar, así temos unha copia para voltar a pegalo se é necesario, sen
necesidade de buscalo de novo no servidor de orixe.
NOTA 2: O procedemento aqui descrito serve para inserir calquera código HTML sexa dun vídeo ou de outro tipo de obxecto, en
calquera tipo de contido.
17 de 19 11/03/2014 19:01
Autoría
Este contido está desenvolto no marco do "Proxecto Websdinámicas" pola Consellería de Cultura
Educación e Ordenación Universitaria en colaboración coa Axencia para a Modernización Tecnolóxica de
Galicia (Xunta de Galicia).
Este contido está elaborado coa ferramenta de software libre eXeLearning que pode descargar da páxina eXeLearning.net.
Pertence aos materiais dos cursos imparticos no marco dos Plans de Formación do Profesorado. Pode acceder a estes
materiais na Aula Virtual Aberta do Proxecto Webs Dinámicas.
Neste enlace pode acceder ao ficheiro fonte deste contido.
Pode comunicar os erros atopados neste contido no seguinte formulario.
Vostede é libre de compartir, copiar, distribuír, comunicar a obra, facer obras derivadas e facer un uso comercial desta obra baixo as
condicións de atribución (Licenza: CC-BY-SA)
RECOÑECEMENTO de autores e recursos empregados:
The Drupal Song Music Video http://www.youtube.com/watch?v=lZ-s3DRZJKY

El cinturón de Seguridad, seguridad vial para niños - Luz verde http://www.youtube.com/watch?v=KRidWDCyk6Y
Andy Thornton - Drupal Performance and Optimization http://vimeo.com/20950555
18 de 19 11/03/2014 19:01
Obra colocada bajo licencia Creative Commons Attribution Share Alike 3.0 License
19 de 19 11/03/2014 19:01

05 SWF Tools

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

05 SWF Tools

Uploaded by

Copyright:

Available Formats

http://127.0.0.1:51235/temp_print_dirs/eXeTempPrintDir_wjazkf/05_s...

Contidos Flash (SWF Tools)

Configuración básica inicial

Informe de estado das SWF Tools

Infórmasenos dos seguintes aspectos:

Métodos de integración dispoñibles e cal está seleccionado por defecto.

Amosarase unha proba de reprodución de contido Flash.

O reprodutor selecionado por defecto para cada tipo de contido.

O estado da librería Zlib.

Publicación de vídeo, audio e flash

Traballeremos con estes tipos de medios:

Ficheiros de vídeo en formato Flash (extensión .flv)

Ficheiro de vídeo Flash (.flv) con [swf file]

Ficheiro de audio MP3 con [swf file]

Ficheiro de animación Flash (.swf)

1. Creamos ou editamos o contido no que queremos publicar a animación Flash.

6. Se o desexamos podemos modificar a aliñación do obxecto flash creado.

7. Xa podemos ver a Vista previa ou directamente Gardar o contido.

Vídeo embebido mediante URL

que non nos interese.

Vídeo embebido mediante HTML

RECOÑECEMENTO de autores e recursos empregados:

The Drupal Song Music Video http://www.youtube.com/watch?v=lZ-s3DRZJKY

You might also like