Jag är intresserad av:

Lämna dina uppgifter så ringer vi dig:

Eller ring oss:
0470 - 70 36 80

6 mars 2014

Så lägger du in video på din hemsida

Simon Östemar - Webmaster på Smelink.se Simon Östemar
Webmaster

Rörliga bilder gör din hemsida mer intressant att besöka och ökar chansen till konverteringar. Att lägga in video på hemsidan är inte alls svårt. Följ vår guide så är du igång på nolltid.

En av de stora trenderna på hemsidor nu är rörligt material. Ett par av anledningarna till detta är att video numera fungerar bra i mobiler samt att Internetanvändare vill konsumera sitt innehåll så snabbt och smidigt som möjligt, med minsta möjliga ansträngning, och att se en kort filmsnutt går snabbare än att läsa en artikel. Nu är det dags för dig att göra livet enklare för dina besökare.

Börja med att filma

Så, vad ska du filma för något? Det finns mycket som dina kunder kan tänkas vara intresserade att se: guider på hur man använder dina produkter, en film om företaget, information om nylanserade produkter, lyckade kundcase etc. När du har bestämt vad du ska filma ska du välja kamera.

Nu för tiden har alla tillgång till en videokamera. Kvaliteten på filmen från din mobiltelefon är inte optimal men för vissa ändamål räcker den gott. Vill du ha mer proffsig bildkvalitet kan du köpa en videokamera eller ännu hellre en ny digital systemkamera. De har nästan alltid videofunktion och med möjlighet att byta objektiv kan du bli lite mer kreativ.

Vilket format du filmar i spelar ingen större roll längre, då de flesta videosajterna stödjer de flesta filmformaten.

Ladda upp din video på YouTube eller Vimeo

YouTube och Vimeo är två riktigt bra videosajter och i vårt exempel kommer vi köra YouTube, mest för att det är den absolut vanligaste och mest välbesökta sajten. Så här gör du för att ladda upp din video på YouTube:

  • Logga in på YouTube med ditt Google-konto (har du inget, skapa här)
  • Välj Ladda upp
  • Se till att Sekretess är satt till Offentligt (så filmen visas i sökresultaten på YouTube och du kan bädda in den på hemsidan)
  • Välj din video från datorn

Dela videon och bädda in på din hemsida

När du laddat upp din film är det dags att bädda in den på hemsidan. Det gör du genom att välja Dela och sedan Bädda in på sidan där videon spelas. Kopiera koden som börjar med <iframe och klistra sedan in den på din hemsida i HTML-läget, där den ska visas.

Justera storlek andra och inställningar för videon

Du kan behöva justera storlek och andra inställningar på filmen innan du klistrar in koden på hemsidan. Vissa inställningar kommer du åt direkt under iframe-koden på YouTube men ibland behövder du ändra annat så här kommer de vanligaste. Glöm inte att byta ut //www.youtube.com/embed/SgqlVIFVbQg mot din egen videos adress om du använder koden i våra exempel.

100% bredd för responsiva hemsidor

Om du har en responsiv hemsida ändras bredden baserat på besökarens skärmstorlek. Om du alltid vill att YouTube-videon ska täcka hela hemsidans bredd måste du se till att width är satt till 100%. Höjden väljer du själv men runt 400 brukar fungera bra för de flesta skärmstorlekar Gör så här:

<iframe width="100%" height="400" src="//www.youtube.com/embed/SgqlVIFVbQg?rel=0" frameborder="0" allowfullscreen></iframe>

Dölj filmens titel

Lägg till &showinfo=0 så här:

<iframe width="100%" height="400" src="//www.youtube.com/embed/SgqlVIFVbQg?rel=0&showinfo=0" frameborder="0" allowfullscreen></iframe>

Dölj kontroller

Lägg till &controls=0 så här:

<iframe width="100%" height="400" src="//www.youtube.com/embed/SgqlVIFVbQg?rel=0&controls=0" frameborder="0" allowfullscreen></iframe>

Visa bara kontroller när muspekaren är över

Lägg till &autohide=1 så här:

<iframe width="100%" height="400" src="//www.youtube.com/embed/SgqlVIFVbQg?rel=0&autohide=1" frameborder="0" allowfullscreen></iframe>

Visa relevanta videor efter filmens slut

Ta bort ?rel=0 så här:

<iframe width="100%" height="400" src="//www.youtube.com/embed/SgqlVIFVbQg" frameborder="0" allowfullscreen></iframe>

OBS! Om du tar bort ?rel=0 men lägger till andra funktioner måste du sätta ett frågetecken framför den första.

Spela upp filmen automatiskt

Lägg till &autoplay=1 så här:

<iframe width="100%" height="400" src="//www.youtube.com/embed/SgqlVIFVbQg?rel=0&autoplay=1" frameborder="0" allowfullscreen></iframe>

Visa i HD-kvalitet automatiskt

Lägg till &hd=1 så här:

<iframe width="100%" height="400" src="//www.youtube.com/embed/SgqlVIFVbQg?rel=0&hd=1" frameborder="0" allowfullscreen></iframe>

Så här kan det se ut med en YouTube-film på hemsidan

Vi har valt att dölja titeln och autogömma kontrollerna för att snygga till spelaren lite. Njut nu av ett gammalt inslag från 1999 från oss på Smelink!

Här är koden:

<iframe width="100%" height="400" src="//www.youtube.com/embed/SgqlVIFVbQg?showinfo=0&rel=0&autohide=1" frameborder="0" allowfullscreen ></iframe>

Behöver du lägga in video på din hemsida?

Lämna dina uppgifter så ringer vi dig och pratar om alternativen:

Ny hemsida?

Öka din försäljning och få fler kunder. Låt oss skapa din nya hemsida.

Läs mer

Starta webshop?

Sälj dina produkter online genom e-handel. Snabbt, enkelt och säkert.

Läs mer

Prenumerera på vårt nyhetsbrev:

Lämna följande fält tomt.