Rullande bilder eller text

Rullande bilder och rullande text... Lite förvirrande är det...




Rullande bilder eller text på bloggen kan upplevas som både engagerande och rörigt, det beror på vad besökaren föredrar. En rullande textremsa under headern kan meddela något viktigt som bloggägaren inte vill att besökaren ska missa och rullande bilder i ett inlägg eller en gadget kan vara utrymmesbesparande. Men - kom ihåg att det inte uppskattas av alla!

Men, hur gör man då?

Börja med att bestämma vart du vill att dina bilder eller din text ska ligga.
I en gadget i sidebaren eller i ett blogginlägg?
Om du vill ha en text/bild i en lång gadget under din header men inte har en bloggmall med den valmöjligheten kan du kika här hur du lägger till en sådan gadget.

Om du vill använda en gadget - välj HTML/Javascript.
Om du vill lägga remsan i ett inlägg, välj Redigera HTML-läget.


Om du vill ha en rullande bildremsa, klistra in följande kod.

<div class="widget-content"><marquee direction="down"><center><a href="ADRESSEN_DU_VILL_LÄNKA_TILL"><img src="BILDENS_DIREKTLÄNK_HÄR" /></a><br><a href="ADRESSEN_DU_VILL_LÄNKA_TILL"><img src="BILDENS_DIREKTLÄNK_HÄR" /></a><br><a href="ADRESSEN_DU_VILL_LÄNKA_TILL"><img src="BILDENS_DIREKTLÄNK_HÄR" /></a><br><a href="ADRESSEN_DU_VILL_LÄNKA_TILL"><img src="BILDENS_DIREKTLÄNK_HÄR" /></a></center></marquee></div><div class="clear"></div>

Den här koden ger utrymme för fyra bilder. Om du vill ha fler bilder klistrar du in fler delar av den här koden:

<a href="ADRESSEN_DU_VILL_LÄNKA_TILL"><img src="BILDENS_DIREKTLÄNK_HÄR" /></a>

Den nya adresslänken ska ligga precis efter den sista likadana kodsnutten, var noga när du klistrar in den.

Du kan nu välja om du vill länka varje bild till en websida (kanske ett visst blogginlägg som handlar om bilden eller en annan blogg/websida) Det är inte nödvändigt att länka bilderna, du kan låta den här raden vara som den är.

Ser du att det på första raden i koden står direction="down"?
Du kan byta ut ordet down mot up, beroende på åt vilket håll du vill att bilderna ska rulla.


När du har laddat upp dina bilder hos den webhost du föredrar (t.ex. Photobucket) kopierar du den första direktlänken och klistrar in den på den första raden i koden där det står BILDENS_DIREKTLÄNK_HÄR. Fortsätt med nästa bilds direktlänk och så vidare tills du är klar. Du kan nu spara din gadget/ditt inlägg.


Om du tycker att det här verkar rörigt eller känner att bilderna rör sig för ryckigt (vilket jag kan känna personligen) så rekommenderar jag att du lägger in ett bildspel istället, hur du gör det kan du läsa här


Om du istället vill lägga in en rullande text ska du använda dig av följande kod i din gadget/ditt inlägg. Fortfarande är det HTML-läge/gadget som gäller.

<br /><br /><marquee>DIN_TEXT_HÄR</marquee><br /><br />

Byt ut DIN_TEXT_HÄR mot texten du vill ha!

Spara din gadget/ditt inlägg.

Lägg till ett bildspel

Om man har många bilder som man vill dela med sig av på bloggen kan ett bildspel vara lösningen. De flesta web-hosts (bilduppladdningssidor) har sina egna bildspel som du kan integrera i din blogg, välj efter din egen smak.

Här visar jag hur du kan lägga in ett bildspel med Picasa, din bloggs eget bildbibliotek där dina redan uppladdade bilder finns och så ett exempel från Photobucket som är den webhost jag oftast använder mig av själv.

Om du vill använda Picasa går du till ditt album, http://picasa.google.se/ klickar på Picasa Webalbum och loggar in med samma användarnamn och lösenord som du använder till din blogg. Picasa är en del av Google.





När du har loggat in kan du välja att ladda upp nya bilder eller att använda dig av dina befintliga bilder. Klicka på överför om du vill ladda upp nytt.



Om du vill skapa ett nytt album för just de bilder du ska ha i ditt bildspel väljer du skapa ett nytt album.
Namnge ditt album.

Nu får du ladda upp de bilder du vill ska ingå i bildspelet.

Ditt nya album finns nu bland de gamla.

Nu är det dags att lägga till bildspelet. Det finns två varianter, vi börjar med den lättaste.
Gå till din bloggs Layoutläge och klicka på lägg till gadget/sidelement.
Välj bildspel
Välj Picasa Webalbum och sedan Album.
Fyll i ditt användarnamn och välj vilket album du vill visa.

Om allt ser bra ut - spara!

Ibland kan det ta en stund innan ditt nya bildspel visas i den här listan och därför kommer jag att visa ett alternativt sätt, så var inte orolig om du inte ser ditt utvalda album.

Om du inte hittar ditt album i listan kan du gå tillbaka till ditt Picasa konto och klicka på ditt utvalda album. Till höger på websidan ser du då nedanstående text.
Klicka på Länka till det här albumet

Klicka på Bädda in bildspel
Välj hur stort du vill att ditt bildspel ska vara för att passa i din blogg och kopiera sedan html-koden.
Gå tillbaka till din bloggs Layoutläge och klicka på Lägg till gadget
Välj HTML/javascript


Klistra in din kod i rutan och spara.

Nu ska du kunna se ditt bildspel i din blogg.

Så går vi vidare till Photobucket. Personligen tycker jag att deras bildspel är roligare eftersom det finns ett antal olika utformningar att välja på.

Photobucket hittar du på http://photobucket.com/

Om du redan har ett konto loggar du in på det, annars kan du skapa ett genom att välja Join Now. Följ instruktionerna.


Ladda upp de bilder du vill ha i ditt bildspel genom att klicka på Choose files. Du kan också skapa ett särskilt album bara för bildspelet genom att välja Add a new album i den vänstra kolumnen men det är inte nödvändigt.

När bilderna är på plats klickar du på Slideshows och sedan på More styles.
Du får nu upp en sida där dina bilder finns till vänster (1.) och du väljer vilka du vill ha med i ditt bildspel genom att klicka på dem. De läggs då till i rutan nedertill på sidan och där kan du flytta runt dem till den ordning du vill ha och även lägga till en bildtext om du vill ha det.

Välj sedan vilken stil du vill ha på ditt bildspel i ruta 2 och även vilken storlek du vill ha.
Avsluta med att spara. (3.)

Namnge ditt bildspel.

Kopiera HTML-koden och klistra in den i din bloggs Layout enligt instruktionerna ovan i Picasa-exemplet där vi använde en HTML-gadget.

Spara och njut av ditt bildspel.