Nedávno jsme ve firmě řešili, jak nejlépe umístit video (.flv formát) na naše webové stránky. V podstatě existují dvě základní možnosti – uložit video na YouTube, či jiný podobný server a z vlastních stránek se jen odkazovat, případně použít jejich přehrávač.
A nebo video uložit na vlastní server a mít nad ním plnou kontrolu – což byla naše volba. K přehrávání pak ale potřebujete najít vhodný flashový přehrávač (celou dobu tu píšu o videu ve formátu FLV – Flash Video). Popravdě existuje jich spousta (viz například články tady nebo tady), stačí si jen vybrat
Já jsem požadoval takový, co je nezávislý na JavaScriptu, snadno se zabuduje do stránek, nabízí spoustu parametrů, kterými můžu ovlivnit jeho vzhled a chování, podporuje konfiguraci v externím souboru (výhodné pro vkládání vícero videí) a je zdarma i pro komerční použití (pro nekomerční je tu bezkonkurenční JW FLV Media Player).
FLV Player
Všechna tato má očekávání nakonec splnil open source FLV Player (ve verzi Maxi).
Jeho hlavní funkce a možnosti nastavení jsou tyto:
- základní konfigurace v txt nebo xml souboru, jednotlivé parametry lze „přebít“ jejich opětovným uvedení v HTML kódu pro vložení přehrávače do stránek
- lze přizpůsobit vzhled přehrávače – které prvky bude obsahovat jaké budou mít barvy, „skin“ nebo spíše obrázek na pozadí přehrávače
- podporuje titulky (v srt formátu)
- umí zobrazovat překryvný obrázek (například logo v rohu videa)
- přehrávání lze ovládat klávesnicí
- možnost zobrazit úvodní obrázek a popisku videa
- přehrávač lze ovládat i JavaScriptem (lze udělat vlastní tlačítka pro přehrávání, nastavení hlasitosti atd)
- na stránkách je generátor kódu pro vložení do stránek
- verze MULTI podporuje playlisty
- existují pluginy pro různé CMS systémy
Další podrobnosti najdete v dokumentaci přehrávače.
Vložení videa do stránek
Zabudování do stránek je poměrně jednoduché:
<object type='application/x-shockwave-flash' data='player_flv_maxi.swf' width='420' height='261' id='video-object'> <param name='movie' value='player_flv_maxi.swf'> <param name='allowFullScreen' value='true'> <param name='FlashVars' value='config=config.txt&flv=video.flv&startimage=video.jpg'> </object>
Textový soubor s nastavením přehrávače config.txt:
showvolume=1 showtime=1 showfullscreen=1 showiconplay=1 showplayer=always playercolor=FFFFFF bgcolor=FFFFFF bgcolor1=FFFFFF bgcolor2=FFFFFF buttoncolor=888888 buttonovercolor=000000 slidercolor1=DDDDDD slidercolor2=DDDDDD sliderovercolor=999999 loadingcolor=999999 videobgcolor=FFFFFF
A výsledek (zde pouze obrázek) vypadá takto:
Ale abych jen nechválil, ještě mi u tohoto přehrávače chybí například podpora Google Analytics – možnost sledovat ve statistikách kolik návštěvníků si video přehrálo (celé nebo jen částečně).
26. 6. 2009
hele ja to dam do stranek a ukaze mi to jen prazdne bile okno , co je s tim?
26. 6. 2009
pls posli mi zpravu na e-mail jak se to ma udělat dik
26. 6. 2009
Pošli mi adresu, kde to máš a já se na to kouknu.
17. 7. 2009
Ako sa dá vložiť logo, resp. krátky popisok (napríklad meno osoby)?
19. 7. 2009
[4] Je to popsáno v dokumentaci – odkaz na ni je v článku uveden.
14. 10. 2009
Dik, zrovna jsem to uspesne pouzila na nove Friendz 🙂
2. 3. 2010
ahoj.já se chci zeptat,taky mi to stále nejede a to sem skusil mnoho přehrávačů.
ale asi tušim co to je ale neumim to spravit
mě se to nerozběhne hned: http://fyzweb­.tym.cz/ele.avi
ale tadky třeba jo: http://l2.futuregaming.cz/navod.wmv
7. 3. 2010
ahoj, mám problém stejný jako ti přede mnou, mám pouze prázné bílé okno…a jaký formát videí to podporuje? díky za odpověď na mejl :))
27. 3. 2010
zdravím,
jen jsem chtěl autorovi poděkovat za fajn návod ke vkládání videa na web.
Zdravím
5. 4. 2010
Pozdravujem,
skúsil som si vložiť video podľa vášho nástroja, ale akosi mi to nefunguje. Nepozreli by ste sa mi na môj web prečo? Musí byť veľkosť flv nejako obmedzená?
Srdečná vďaka
5. 4. 2010
Upresním, že v Mozille mi to ide v IE8 nie a nevšimol som si, že sa v mojej predošlej správe nezobrazil web
http://www.mkregion.sk/videjko.htm
Ešte raz vďaka
13. 4. 2010
Mám stejný problém. V IE8 to funguje pouze tehdy, když je flv spouštěno z lokálního disku typicky c:\neco\video.htm. Když je spouštěno z webu, je výsledkem bílá obrazovka a také se nezobrazí úvodní fotografie.
13. 4. 2010
Zdravím,
Petrik1, mrknul jsem na tvůj kód a máš tam chybu v tomto řádku:
<param name=video
Správně má být
<param name=movie
18. 5. 2010
Ahoj, chci se zeptat,jak nastavit video tak,aby se nespustilo s otevřením stránky a nebo přejetím videa myší?
25. 7. 2010
Děkuji!
Konečně stránka, podle které jsem si vytvořil své HTML soubory tak, abych v nich mohl přímo sledovat FLV nebo MP4 soubory bez připojení na internet. A uvedený FLV Player Maxi mi k tomu bohatě stačí.
30. 7. 2010
Zdravím, předem chci autorovi poděkovat za jeho skvělý návod na umístění videa na web.
Mám však problém, že se moje videa nezobrazí v IE8 ani IE6. Mohl by mi někdo prosím pomoci ?? Jedná se o videa umístěná na webu http://www.strongman.tym.cz Díkes:)
13. 8. 2010
Po oprave kódu mi to funguje! Jééh
Vďaka 🙂
13. 8. 2010
takže videjko mi ide. Len sa mu snažím nastviť nejaké parametre (prehrávaču), ale to sa mi akosi nedarí. Napr. biely podklad chcem vymeniť za modrý, spúšťaciu ikonu v strede videa dať preč a pod. Parametre som menil v config.txt, ale zmena žiadna
showvolume=1
showtime=1
showfullscreen=1
showplayer=always
playercolor=00CCFF
bgcolor=00CCFF
bgcolor1=00CCFF
bgcolor2=00CCFF
buttoncolor=888888
buttonovercolor=000000
slidercolor1=00CCFF
slidercolor2=00CCFF
sliderovercolor=999999
loadingcolor=00CCFF
videobgcolor=00CCFF
Kde robím chybu?
:-/
21. 10. 2010
používám tento způsob asi 5 let. Dosud vše OK, ale v nových W7 hlásí player „video nepodporováno nebo zakázáno“. Při spuštění stejné stránky z flešky (na stejném PC) nebo z web. serveru je vše ok. Pouze z HDD to nejede! To je záhada(?!). Zkoušel jsem player_flv_maxi, player JW a další… vše stejné. Nezáleží na prohlížeči. Na ostatních OS vše chodí OK.Jo, přehrávám soubory flv, které normálně chodí na tomtéž compu v běžném FLV playeru.
29. 3. 2011
Hej… Petře. Hledám na webu kde by mi poradily s videem na stránkách a nakone jsem skončil u Tebe 🙂
Super prográmek, dík za tip.
Ta možnost si to nagenerovat přímo na jejich stránkách je super…
http://flv-player.net/…i/generator/
8. 7. 2011
prosimvas jestly byste se mohli podivat na muj web ktery sem ted zacal a nechci dal pokracovat nez rozjedu to video http://ceprik­.wz.cz/ mohly byste se mi podivat nato prosimvas někdo ukazuje to bule okno jenom
15. 12. 2011
Poprosil bych o radu, článek mne potěšil, našel jsem co jsem hledal, ale nedaří se mi stáhnou player_flv_maxi.swf. Po kliknutí na odkaz jsem čekal nabídku k uložení souboru, ale zatím se v prohlížeči objeví okno přehrávače a program nestáhnu. Co a jak bych měl nastavi, abych player_flv_maxi.swf stáhnul.
15. 12. 2011
Mělo by stačit na odkaz kliknout pravým tlačítkem a z kontextové nabídky pak vybrat Uložit odkaz jako…
15. 12. 2011
Díky, nebo použít klik s klávesou Alt… taková prkotina 🙂
21. 10. 2012
vie prosím niekto poradiť prečo sa v IE nezobrazí startimage???
pozri môj web http://andrejhlavaty.sk/