Designhjälp för din blogg

Bildspel som header

Kategori: Header, Roligheter
Nu kan du ha ett bildspel som header. Såhär gör du:

1.
Gå in i din HTLM-mall (Kugghjulet -> Design -> Redigera HTML (Startsida))

2. Efter <head> klistrar du in följande:

<script type="text/javascript">

<!--

var image1=new Image()

image1.src="BILDADRESS 1"

var image2=new Image()

image2.src="BILDADRESS 2"

var image3=new Image()

image3.src="BILDADRESS3"

//-->

</script>

 


3. 
Nu ska du lägga in bildspelet var du vill ha det. Eftersom vi i detta fall vill ha det i headern lägger vi in det direkt efter <div id="header"> och det är denna kod du ska lägga in:

<center>

 <img src="firstcar.gif" name="slide" width="900" height="430" />

<script>

<!--

//variable that will increment through the images

var step=1

function slideit(){

//if browser does not support the image object, exit.

if (!document.images)

return

document.images.slide.src=eval("image"+step+".src")

if (step<3)

step++

else

step=1

//call function "slideit()" every 3.0 seconds

setTimeout("slideit()",2500)

}

slideit()

//-->

</script>

</center>

4.
Spara 


5. Nu går du tillbaka till den första koden du klistrade in, den precis under <head>

Där det står BILDADRESS1 klistrar du in adressen till den första bilden du vill ha i bildsspelet. Där det står BILDADRESS2 klistrar du in den andra bilden du vill ha osv....

Du får din bildadress genom att ladda upp bilden på bloggen och sedan kopiera adressen som står under fullstort läge.  Se detta inlägg för hjälp!

6. Spara

 




Flytta header texten.

Kategori: Header
Vill du flytta på header texten? Där ditt bloggnamn och beskrving till bloggen står?


1. Klicka på fliken "Design" och sedan vidare på "Redigera stilmall".


2. Leta upp h1 { och h2 {. Det jag har markerat på bilden här:


Det är alltså fär du flyttar och ändrar utseendet på texten i headern. Under h1 ändrar du alltså texten för bloggnamnet (övre texten) och h2 texten för blogg beskrivning (nedre texten).

3. För att flytta på texten kan du ändra på margin och/eller padding. Läs inlägget här om margin och padding om du inte riktigt vet hur du ska göra ;)

Men det bästa jag tycker är att ta bort margin:50px; och istället skriva: 

margin-top: 20px;
margin-right: 10px;
margin-bottom: 15px;
margin-left: 10px;

Då är det bara att bestämma mellanrummen åt varje håll genom att öka eller minska på antal px ;)


4. "Spara stilmall" eller "Förhandsgranska".

Header

Kategori: Header
» Ändra utseende på header texten.

» Ändra vad det står i hedern.


Hos blogghjalparn.blogg.se finner du textguider om HTML & CSS. Guiderna riktar sig till bloggare som vill ha hjälp med sin bloggdesign. Man kan själv läsa sig till hur man ska göra eller så kan man beställa sin egna design alternativt köpa en redan färdig design.

Copyright © 2017 Blogghjälparn

BLOGGHJÄLPARN


Senaste inläggen

Portaler & Listor
Webbdesign