Hvordan lage sitat?

Sindre fra bloggen Secretpages... spurte meg forleden hvordan man lager en slik sitatfunksjon som jeg bruker på bloggen min. Jeg lovte at jeg skulle poste en forklaring på hvordan dette kunne gjøres i dag, det ble litt sent på meg men her kommer mitt forsøk(hvis jeg ikke sovner før jeg rekker å poste he he).

Sitatfunksjonen bruker man når man vil vise at enkelte deler av teksten skiller seg ut fra resten av artikkelen. Her ser dere hvordan mine sitat blir seende ut:

Du vet slik som dette her.
I dag har jeg lekt meg litt for anledningen.

Bildene i denne posten er klikkbare, ønsker du å se et større bilde enn det som vises her er det bare å klikke i vei. Første steg for å legge inn en sitatfunksjon er å gå til bloggmenyen din:

Der velger du fanen som heter Design eller kanskje den heter noe annet hvis du har på norsk språk. Selv har jeg valgt å ha min konto på engelsk for det er enklest når jeg skal følge diverse tips :)

Nå skal du ha kommet deg til en side som ser omtrent slik ut. 

I undermenyen velger du "Template Designer". Så velger du, i menyen på venstre side "Advanced/avansert".

 I menyen som da dukker opp til venstre scroller du ned til "Add CSS"(det står helt nederst, usikker på hva som står i den norske oversettelsen).

I dette skjermbildet skal du lime inn en kode som beskriver hvordan sitatfunksjonen din skal se ut. Koden jeg bruker i dag ser slik ut:

blockquote {

    font-family: Helvetica, "Bold", Times, serif;

    font-size: 22px;

    line-height: 20px;

    color: #FFF;

    padding: 15px;

    background-color: #FF6666;

    border: 10px double #FFCC00;

    margin-bottom: 25px;

}

font-family: Fonten styrer hvilken skrifttype sitatet vises med, dette kan du selv endre ved å putte inn navnet på en annen skrifttype der jeg har valgt Helvetica, man kan også velge italic(kursiv) i steden for bold/fet som jeg har valgt. Man kan helt sikkert også bruker andre fonter enn de som er standard for blogger men da må dette lastes inn. Hvis du vil forsøke deg på det så foreslår jeg at du tar deg en tur til Google og søker på fonter.

font-size: Størrelse på skriften

line-height: Linjeavstand, enkelt og greit.

color: De stedene i koden hvor det står color så er det snakk om farge. Her kan du endre farger. Lurer du på hvilke koder de forskjellige fargene har så kan du ta en titt på f,eks, denne siden.

border: Her bestemmer du hvordan borden på sitatet ditt skal se ut. Hvor bred og om det skal være hel linje, stiplet også videre. Mer om  border og hvilke stiler man kan bruke her og her.

Alle tallene som det står px bak angir størrelser. Lek med tall, farger, bord og skrifttyper til du har funnet ut av hvordan du vil ha det :) Du kan ta utgangspunkt i koden jeg har brukt eller kanskje du vil bruke en du finner i linkene under? Lykke til! Husk å trykk apply forresten når du legger inn koden.

Hvordan bruker man sitatfunksjonen når den først har blitt lagd?
Når du skriver en bloggpost markerer du teksten og velger sitattegnet som står i redigeringsmenyen nesten helt til høyre.

Gode lenker:
22 eksempler på hvordan style sitater.
Lag stilige sitater.

Er det noe dere lurer på så bare spør? Det er sikkert mye jeg ikke kan men jeg hjelper gjerne til hvis jeg har kunnskapen, men det får bli etter at jeg har fått skjønnhetssøvnen min. Go' natt!