Header Ads

Dekorera din bloggmall med en animation


Sugen på att dekorera bloggen lite inför Halloween och jul?
Ett enkelt sätt är att lägga in en eller ett par bilder, gärna rörliga animationer - smileys, gifs och liknande - i en kod i en gadget i din bloggs layoutläge.

Gör så här:

Leta rätt på en eller flera bilder som du vill ha på bloggen.
Kopiera dem till din dator och lägg upp dem på Photobucket eller liknande så att de får en webadress. Länka inte bilden direkt från sidan där du hittar den, det kallas hotlinking och är väldigt illa sett på internet eftersom du då stjäl den websidans bandvidd.

Gå till din bloggs Layoutläge och lägg till en ny gadget, välj HTML/Javascript.

Klistra in den här koden:

<div id="tag" style="position:absolute; right:60px; top:60px; width:153px; height:122px;">
<a href="http://fixa-din.blogspot.com" target="_blank">
<img border="0" src="http://i38.photobucket.com/albums/e123/Buschiq/Bat1b3.gif"/>
</a></div>

Byt ut den röda webadressen mot din bilds direktlänk. Eller, om du vill ha kvar pumpan i exemplet, låt den vara. Det är en animerad bild med en fladdermus i pumpan.


Nästa steg är att ändra de gröna siffrorna till din bilds mått. Om du är osäker så håll musen över bilden du har sparad på din dator, då visas måtten.

De blå siffrorna indikerar vart bilden ska ligga på skärmen. De utgår, i det här fallet, från höger och toppen på sidan. Du kan byta ut de orden mot left och/eller bottom om du vill. Siffrorna talar om hur långt från webläsarens kant bilden ska ligga och här får du prova dig fram.

Tänk på att det finns ett flertal olika skärmstorlekar så alla kanske inte ser samma resultat som du, men någonstans ska ju bilden ligga. Testa dig fram till det du tycker passar!

Du kan lägga in flera bilder med varsin kod i samma gadget om du vill. Tänk dock på att de inte kan ligga på samma ställe, så du får anpassa koderna.

5 comments:

-------------------------------
Lämna gärna en hälsning! Har du en bloggfråga är du välkommen att ställa den på vårt forum. På så vis kan fler svara alternativt få hjälp om de har samma problem. Tack!
Du hittar en länk till forumet högst upp till vänster här på Fixabloggen.
-------------------------------