Att lägga ut en video med hjälp av JW Player
En vanlig HTML 4.1 kod ser ut som nedan
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
</head>
<body>
</body>
</html>
En vanlig HTML 5 kod ser ut som nedan. HTML5 är en officiell webbstandard
från World Wide Web Consortium (W3C). Html 5 fungerar inte i alla
webbläsare och man har kommit olika långt med att implementera de olika
funktionerna. Den populära webbläsaren Internet Explorer ligger tyvärr lite
efter i utvecklingen men stort hopp sätts till den kommande IE9.
<!DOCTYPE html>
<html lang="en">
<head> <meta charset="utf-8" />
<title>Smashing HTML5!</title>
<link rel="stylesheet" href="css/main.css" type="text/css" />
<!--[if IE]> <script
src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]--> <!--[if lte IE 7]>
<script src="js/IE8.js" type="text/javascript"></script>
<![endif]--> <!--[if lt IE 7]>
<link rel="stylesheet" type="text/css" media="all" href="css/ie6.css"/>
<![endif]-->
</head>
<body id="index" class="home">
</body>
</html>
Tanken med HTML 5 är att förenkla möjligheten att lägga ut video på Internet.
Ett sätt att lägga ut en video är att använda JW Player. Antingen kan man
signa in på http://www.jwplayer.com/about-jwplayer/. Det finns en free
version med fem upplagda video som max. Om du tittar på länken
http://patrickhjorth.weebly.com/elevexempel.html kan du se min video
Raindance som ett exempel med en inlagd JWPlayer.
Så här gör man:
1. Signa in på http://www.jwplayer.com/about-jwplayer/ eller skapa först
ett konto.
2. Klicka på Your Computer
3. Ladda upp din video.
JW Player fungerar bäst med mp4 filer. Till slut skriver man in vad videon
heter. Webbplatsen kommer att processa din video. Därefter klickar
man på View code knappen.
Kopiera koderna
Denna kod skall läggas mellan taggarna <head><head/>
<script src="http://jwpsrv.com/library/tq4dzJrWEeOM6yIACmOLpg.js">
</script>
Och den andra koden skall läggas innan för taggarna <body> <body/>
<div id='playercxqiNkR7'></div>
<script type='text/javascript'>
jwplayer('playercxqiNkR7').setup({
playlist: 'https://jwpsrv.com/feed/cxqiNkR7.rss', width: '100%', aspectratio:
'16:9' });
</script>
Den slutliga HTML 5 koden kommer att se ut som nedan. Denna kod lägger
man sedan in i på Weebly under Embed Code </>.
<!DOCTYPE html>
<html lang="en">
<head> <meta charset="utf-8" />
<title>Smashing HTML5!</title>
<link rel="stylesheet" href="css/main.css" type="text/css" />
<!--[if IE]> <script
src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]--> <!--[if lte IE 7]>
<script src="js/IE8.js" type="text/javascript"></script>
<![endif]--> <!--[if lt IE 7]>
<link rel="stylesheet" type="text/css" media="all" href="css/ie6.css"/>
<![endif]-->
<script src="http://jwpsrv.com/library/tq4dzJrWEeOM6yIACmOLpg.js">
</script>
</head>
<body id="index" class="home">
<div id='playercxqiNkR7'></div>
<script type='text/javascript'>
jwplayer('playercxqiNkR7').setup({
playlist: 'https://jwpsrv.com/feed/cxqiNkR7.rss', width: '100%', aspectratio:
'16:9' });
</script>
</body>
</html>
4. Gå till din webbplats adress och pröva din video.