Inserire un'animazione flash nel blog


image Tempo fa ho parlato di Flash Vortex, un sito che permette di creare diverse animazioni in flash pronte per essere inserite nel blog. Mentre prima le animazioni generate venivano ospitate dal sito stesso, adesso hanno deciso di lasciare a noi il compito di pubblicarle in rete.

Visto che è un argomento che non ho mai trattato, e per rispondere a tutti quelli che me l'hanno chiesto, ho deciso di spiegare come pubblicare nel blog un'animazione in flash.

Cos'è un'animazione in flash e come pubblicarla in rete

Un'animazione in flash non è nient'altro che un file con estensione SWF pubblicato in rete e che tutti i browser odierni riescono a visualizzare se si ha installato l'apposito player distribuito da Macromedia (anzi da Adobe, da quando l'ha acquistata nel 2005). Come tutti i file che diventano parte integrante del nostro blog, anche le animazioni in flash devono essere pubblicate su qualche servizio di file hosting, come SkyDrive di cui ho parlato in passato.

Per recuperare l'indirizzo effettivo dell'animazione, procederete allo stesso modo di come spiegato per un'immagine.

Inseriamola in un post o in un widget

Esistono molti modi per farlo, e la questione è al centro di lunghe diatribe in cui noi programmatori amiamo gongolarci, tra validazione W3C, SWFObject e così via. Espongo di seguito il metodo più veloce per farlo, e tranquilli che l'animazione si vedrà su Internet Explorer, Firefox, Safari e Chrome (tutti testati).

E' possibile inserire l'animazione sia in un post che in un widget di tipo HTML utilizzando la stessa porzione di codice html:

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=4,0,2,0" width="larghezza" height="altezza">
<param name=movie value="indirizzo animazione">
<param name=quality value=high>
<param name="BGCOLOR" value="#FFFFFF">
<embed src="indirizzo animazione" quality=high pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="larghezza" height="altezza" bgcolor="#FFFFFF">
</embed>
</object>

Personalizzando quanto segue:

  • larghezza, altezza: le dimensioni in pixel che avrà l'animazione
  • FFFFF: il colore di sfondo secondo la codifica RGB (primi due caratteri indicano la tonalità di rosso, quelli centrali di verde e gli ultimi due di blu). In questo caso con FFFFFF si avrà uno sfondo bianco
  • indirizzo animazione: l'indirizzo dell'animazione che avete pubblicato in rete

Se volete inserirlo in un post, basterà andare in Modifica HTML dello stesso e incollare il codice personalizzato, altrimenti se volete inserirlo in un elemento del blog aggiungetene uno di tipo HTML/Javascript (nel caso di Blogger) e incollate il codice lì. In una pagina html qualsiasi, il codice va incollate dentro la porzione di codice <BODY>.

Aggiornamento: dopo la pubblicazione ho visto che una riga andava fuori layout e veniva tagliata, ho quindi rimpicciolito il carattere.

Condividi su Facebook, Twitter o Google Buzz:
Condividi su Facebook Condividi su Twitter Pubblica su Google Buzz

Per ricevere direttamente in posta i nuovi articoli, inserisci il tuo indirizzo email:
oppure puoi iscriverti al feed per tenerti sempre aggiornato sui nuovi contenuti del blog!
Per maggiori informazioni sui feed, clicca qui!

29 commenti:

elena71 ha detto...

Ciao Orazio,

volevo chiederti se un'animazione flash non rallenta troppo il blog.

Tenebrae ha detto...

@elena: dipende dalle dimensioni della stessa, un'animazione flash in grafica vettoriale occupa di solito pochi kb... diciamo che fino agli 80-100 kb è tollerabile, oltre può essere un problema

DARKinside ha detto...

ciao tenebrae complimenti per questo blog...davvero interessante e UTILE!! ti ho linkato se ti fa piacere visitare il mio blog sei il benvenuto anche perchè quello che vedrai sara tutto frutto del tuo aiuto...A PRESTO!
DARKinside

fiore_labs ha detto...

Ciao,
vengo sempre a leggere le news nel tuo blog....
ma volevo chiederti una cosina: c'è modo di fare una classifica dei commentatori di un blog??
Grazie mille in anticipo :-)
Smak
Fiore

Controtango ha detto...

Ciao Tenebrae. Ho inserito un menu orizzontale di flashvortex nel mio blog dopo aver pubblicato il file swf generato su fileden (lo preferisco a skydrive...). Il menu viene visualizzato correttamente, animazioni comprese; purtroppo cliccando sui bottoni, non succede nulla, non vengo indirizzato sul link relativo. Ho seguito l'edit di flashvortex alla lettera, ma nulla. Shockwave plugin scaricato e provato il flash file anche su chrome, ma nessun risultato. Come indirizzio animazione, ho inserito il direct link al file salvato su fileden; forse avrei dovuto inserire il BB code o l'HTML code?
Grazie in anticipo

Tenebrae ha detto...

@controtango: purtroppo non ho mai provato a realizzare menù con flashvortex nè mai usato fileden (anche se me lo sono appuntato, un servizio di hosting in più fa sempre comodo), quindi in questo caso non so aiutarti, mi dispiace

ilaria ha detto...

Ciao..grazie x avermi risposto all'email..si ho risolto comuque:)spero almeno...buonaserata!!!

Controtango ha detto...

Per tua informazione, e per coloro che come me volessero utilizzare un oggetto in flash in maniera interattiva come il menu di cui ti ho parlato, ho risolto inserendo queste due righe di codice:

<PARAM name="menu" value="true">
<PARAM name="allowScriptAccess" value="always">

Adesso funziona a meraviglia. Se vuoi vieni a vedere sul mio blog controtango.blogspot.com

Grazie ancora

dodò ha detto...

ciao! come sempre i tuoi post sono super interessanti e utili! una domandina veloce veloce che non sapevo dove inserire...quando apro il mio profilo su "BLOGS PERSONALI" esce scritto "BLOG" e non il nome del mio blog. Come si cambia? sono sicura che è fcile,ma non capisco ome fare!
se ti va risp! grazie mille!

Den ha detto...

Nella mail che ti ho mandato ieri (oltre a qualcos'altro) ti avevo chiesto come si facesse a mettere un elemento per permettere ai visitatori di nominarsi "lettore del blog". Non avevo ancora visto che basta andare in layout-->elementi pagina-->aggiungi un gadget-->lettori. Chi vuole inserirlo nel suo blog, segua i passaggi, perchè è veramente un'utile attrattiva.

Maurizio ha detto...

Grazie per la visita e per lo scambio link... mi affaccio spesso nel tuo blog... è un ottima fonte di informazioni "tecniche"...
A presto

Boby ha detto...

@Den, l'hanno inserito su Blogger Italia da solo una settimana, comunque Tenebrae perché non l'aggiungi anche qui sul blog?

Tenebrae ha detto...

@boby: sto ancora valutando l'idea di metterlo o meno

Tenebrae ha detto...

@dodò: il titolo del blog puoi cambiarlo da impostazioni->generale

fammi sapere se risolvi

Tenebrae ha detto...

@controtango: grazie, potrebbe essere utile ad altri

ottimo l'effetto che hai ottenuto!

Il Profeta Elia ha detto...
Questo commento è stato eliminato dall'autore.
barbara ha detto...

ho creato un crossword con EclipseCrossword,è molto bello da usare ma non riesco ad inserirlo come applets java per farlo utilizzare in modo interattivo,hai una soluzione per questo problema ?

GioDemaggio ha detto...

Ciao a tt
cosa posso dirti di questo articolo, grazie e ancora grazie era tt la notte che cercavo quello che in poche righe hai spiegato esaurientemente ( devo ancora provare però). Inoltre ancora grazie per l'articolo su skypeDrive , molto molto interessante , anch'io dovendo cmq mettere in rete i file swf cercaco un servizio hosting ma di validi nn ce ne sono proprio e visto che sono un utente msn ora potrò caricare i file in questione. Ciao .
P.S. Bel blog e bei articoli li seguirò con passione.

GioDemaggio ha detto...

Detto e fatto funziona, devo segnalare ( perche lo stavo già testando) unservizio hosting che funziona , almeno in questi 10 minuti che lo stò utilizzando, che però è anonimo e in inglese e non conoscendolo nn sò come configurarlo. Servizio ( http://www.2and2.net/ ).

Come dicevo il codice funziona e anche il carico del file unica pecca è che mi rimane una porzione di codice visibile e nn capisco perchè in quanto il dilmato si vede benissimo. Ecco la porzione che rimane: [codice]27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=4,0,2,0" width="400" height="320">[/codice]

Preciso che nel forum dove ho messo questo script è tutto permesso ( solo in firma però dove lo stò inserendo).
Ora tento di cancellare la porzione rimasta sperando che poi funzioni tt. Se qualcuno sà spiegare il perche rimanga la porzione di script sopra citata me lo faccia sapere. Grazie.

GioDemaggio ha detto...

Funziona, benissimo togliendo la parte sopraindicata.

GioDemaggio ha detto...

Ciao a tutti
Bene ho ottenuto quello che cercavo. Inoltre voglio segnalare che lo script funziona benissimo nei post, compreso il codice che in firma mi rimaneva in +.
A questo punto vorrei chiedere un altra piccolissima info. Avendo un fil swf di una clip video in 16:9 , quando viene visualizzata è però in 4:3 con le bande nere è possibile stabilire anche l'aspetto del lettore ? in questo caso ho un file video da 512x216 (2.35). Grazie mille.

Tenebrae ha detto...

@gio: grazie per il feedback, e mi fa piacere che tutto funzioni come deve

riguardo alla tua domanda, non esiste proprio la possibilità di dire "lo voglio a 16:9" o "a 4:3", puoi però definire le dimensioni dell'animazione in flash come spiego, dandogli magari quelle stesse che tu indichi.

GioDemaggio ha detto...

Bhe grazie mille ugualmente, era per quelle barre nere che definisce il 16:9.

Luca ha detto...

Ciao,
innanzi tutto complimenti per il tuo blog, mi è stato veramente molto utile!!
Ti vorrei porre una domanda,io ho l'esigenza di inserire nel mio blog un animazione flash che carica le immagini tramite xml. Ho provato con il codice che hai scritto sopra, ma non carica le immagini.Mi puoi aiutare?

L'Altra Notizia ha detto...

spero di non andare fuori argomento, ma visto che si parla di flash, volevo chiederti se in un futuro non lontano potresti spiegare come inserire un menù in flash o comunque un widget simile a quello che c'è nella homepage di questo sito che l'autore ha chiamato "IN EVIDENZIA"

http://formicheinca.blogspot.com/

A me nello specifico servirebbe per far visualizzare le diverse categorie dei mie articoli.


GRAZIE MILLE COME SEMPRE E COMPLIMENTI ANCORA :)

Youreah ha detto...

Ciao. Ho letto e riletto il tuo post per la pubblicazione di file .swf nel blog, ho seguito tutta la procedura che descrivi, ma con mio grande rammarico non vedo nessuna animazione. Ho installato l'apposito player: niente. Ho letto e riletto il tuo precedente post "Pubblicare immagini e file online con Windows Live Skydrive", ho seguito anche qui le cose che hai descritto. Niente. Ho provato a simulare su post fittizi. Può darsi che io faccia l'errore di scrittura sull'indirizzo dell'animazione (da dove lo prendo questo indirizzo?). Sono molti gli interrogativi che mi pongo. Ad esempio: quello script "object... object" da dove devo prelevarlo stabilito che io ho un software di Flash 8 al quale mi dedico per le animazioni e mi dà file con estensione .swf.
Un'altra domanda: se ho un file .swf, già caricato in Skydrive, come faccio ad ottenere non già l'indirizzo quanto quello script "object... object" e vedere finalmente un'animazione in un post di blog.
Insomma, il mistero si fa fitto. Chissà se tu mi puoi fare uscire da queste "Tenebrae".
Scusa il gioco di parole e attendo con fibrillazione un tuo più esaustivo chiarimento.
Grazie, Youreah

italiasudsanita ha detto...

Scusa, ma nn va!
Su blogger nn va?
Io avevo pubblicato il filmato swf su un mio server ma nn funge!
Devo mettere anche http giusto?

dong dong23 ha detto...

coach outlet
coach factory outlet
nike air huarache
tory burch flats
louis vuitton handbags
oakley sunglasses
tiffany outlet
ray ban sunglasses
michael kors outlet
michael kors handbags
louis vuitton outlet
louis vuitton outlet
tory burch sale
tory burch outlet
nike uk
asics shoes
nike blazers
ray ban sunglasses
adidas originals shoes
kate spade handbags
adidas shoes
louis vuitton outlet
louis vuitton bags
louis vuitton outlet
michael kors outlet
cheap jordan shoes
ray ban sunglasses
louboutin pas cher
nike free run 2
coach outlet
ray ban sunglasses discount
true religion outlet
louis vuitton outlet
pandora jewelry
hollister clothing
oakley vault
coach outlet
coach outlet store online clearances
coach factory outlet
oakley vault
20165.4wengdongdong

raybanoutlet001 ha detto...

ralph lauren outlet online
washington redskins jerseys
cheap jordans
los angeles lakers
san antonio spurs jerseys
ferragamo shoes
nike store uk
michael kors handbags
cheap nike shoes sale
nike air huarache


Prima di lasciare un commento, leggete qui

Posta un commento