FARGEKODER KAN DU FINNE HER:
http://www.myspacedev.com/color-codes/
RAMME RUNDT BLOGGEN
Hvordan gjør jeg dette?
Du limer bare inn koden i Stilsettet.
Koden du skal legge inn er:
border: 2px solid #000000;Hvor legger jeg den inn?Du legger den inn under #wrapper og #footer. Ca. sånn her skal det se ut:
(Du kan også legge koden inn under #header, hvis du vil ha en ramme rundt headeren også).
#wrapper {
background-color: #FFFFFF;
border: 2px solid #000000;}
#footer {
background-color: #FFFFFF;
border: 2px solid #000000;
istedet for
solid, som betyr helstrukken linje rundt bloggen, kan du putte inn disse:
dotted = prikker
dashed = strekerFor å endre tykkelsen på rammen, så kan du for eks. skrive
3px eller hvis rammen skal være mindre så skrive du bare
1px.
MENYEN FRA HØYRE TIL VENSTRE
Hvordan gjør jeg dette?
Du limer bare inn koden i Stilsettet.
Koden du skal legge inn er:
}
#main {
float: right;
}
#side {
float: left;
Hvor legger jeg den inn?Du legger den inn under #wrapper.
Slik skal det se ut sånn ca:
#wrapper {
background-color: #FFFFFF;
border: 2px dotted #000000;
}
#main {
float: right;
}
#side {
float: left;
}
#footer {
background-color: #FFFFFF;
border: 2px dotted #000000;
MIDTSTILLE BLOGGEN DIN
Koden du skal bruke:
margin-left: auto;
margin-right: auto;
Hvor legger jeg den inn?
Den skal du legge inn under #header, #wrapper og #footer.
Slik skal det se ut:
#header {
background-color: #FFFFFF;
height: 236px;
margin-left: auto;
margin-right: auto;}
#wrapper {
background-color: #FFEFFC;
margin-left: auto;
margin-right: auto;}
#footer {
background-color: #FFFFFF;
margin-left: auto;
margin-right: auto;
SMAL BLOGG
Koden:width: 610px;
Hvor legger jeg den inn?
Du legger den under #header, #wrapper og #footer.
Slik skal det se ut da:
#header {
background-color: #FFFFFF;
height: 236px;
margin-left: auto;
margin-right: auto;
width: 700px;}
#wrapper {
background-color: #FFEFFC;
margin-left: auto;
margin-right: auto;
width: 700px;}
#footer {
background-color: #FFFFFF;
margin-left: auto;
margin-right: auto;
width: 700px;
}
Nå er det bare å endre tallet til hva du måtte ønske. 600px eller kanskje 800px. Du bestemmer.
ENDRE "X ANTALL KOMMENTARER"
Vil du at for eksempel at det skal stå "x søte små" istedenfor "x kommentarer", så gjør du dette:
Design -> Rediger -> Maler
- Trykk på CTRL + F tasten på tastaturet.
- Søk på "comment".
- Der skal det stå: " <a href="${EntryPermaLink}#comment">${EntryCommentCount} kommentarer</a> "
- Det du skal gjøre er å endre litt på koden slik:
<a href="${EntryPermaLink}#comment">${EntryCommentCount}
søte små</a>
MINDRE/STØRRE SKRIFT PÅ INNLEGGENE DINE
Koden du skal bruke:
font-size: 10pt;
Hvor skal jeg legge den inn?
Den skal du legge inn under wrapper.
Slik for eks. skal det se ut;
#wrapper{
background-color: #FFFFFF;
font-size: 10pt;}
Det eneste du trenger å gjøre nå er å endre tall, vil du ha større skrift skriver du for eksempel 12, eller kanskje du vil ha mindre skrift, så skriver du 8...
HORISONTAL MENY (KNAPPEMENY)
Først må du gå inn på "design" så "rediger" og så "stilsett". Helt nederst i stilsettet ditt setter du inn denne koden:<style type="text/css">
/*Credits: Dynamic Drive CSS Library */
.mattblacktabs{
width: 100%;
overflow: hidden;
border-bottom: 1px solid black; /*bottom horizontal line that runs beneath tabs*/
}
.mattblacktabs ul{
margin: 0;
padding: 0;
padding-left: 10px; /*offset of tabs relative to browser left edge*/
font: bold 12px Verdana;
list-style-type: none;
}
.mattblacktabs li{
display: inline;
margin: 0;
}
.mattblacktabs li a{
float: left;
display: block;
text-decoration: none;
margin: 0;
padding: 7px 8px; /*padding inside each tab*/
border-right: 1px solid white; /*right divider between tabs*/
color: white;
background: #414141; /*background of tabs (default state)*/
}
.mattblacktabs li a:visited{
color: white;
}
.mattblacktabs li a:hover, .mattblacktabs li.selected a{
background: black; /*background of tabs for hover state, plus tab with "selected" class assigned to its LI */
}
</style>
Nå må du lagre stilsettet (selv om det ikke vises noe på forhåndsvisningen, ikke vær redd). For at disse skal vises må du nå gå inn i "maler". Finn så denne linja:
<div id="wrapper" class="yui-gc">
Rett under den linja setter du inn denne koden:
<div class="mattblacktabs">
<ul>
<li><a href="URL-ADRESSE">valgfritt</a></li>
<li><a href="ULR-ADRESSE">valgfritt</a></li>
<li><a href="URL-ADRESSE">valgfritt</a></li>
<li><a href="URL-ADRESSE">valgfritt</a></li>
<li><a href="URL-ADRESSE">valgfritt</a></li>
</ul>
</div>Så må du redigere litt i koden. La oss si at du vil ha en "knapp" som heter f.eks HOME og som linker til fremsiden din. Da må du skrive inn url-adressen til fremsiden der jeg har skrevet URL-ADRESSE, og skrive HOME der jeg har skrevet valgfritt. for eksempel slik:
<li><a href="http://www.eksempel.blogg.no/">HOME</a></li>
Url-adressen finner du ved å gå inn på din blogg (OBS: som besøkende) og klikke deg dit du vil linke knappen til. Da ser du url-adressen i søkelinja.
Det har lagt til linjer så du kan lage deg 5 knapper i en slik meny, men vil du ha flere legger du til enda ei linje med dette:<li><a href="URL-ADRESSEN">valgfritt</a></li>
men vil du ha bare 4, fjerner du en av disse linjene.
Pass på at dette alltid står på slutten, så du ikke legger til linjer under det:
</ul>
</div>
Når det er gjort er det bare å lagre. Så må du sette inn dette i alle malene: index er den du har satt det inn i nå, men du må gjøre det i ?kategorier? ?arkiv? og ?enkeltinnlegg? også. Du kommer inn på disse malene ved å gå til ?maler? og velge rett over koderuten. Da er det bare å lagre alt.
MELLOMROM
Har du lyst på mellomrom mellom header og innhold? Da går du inn på "design", "rediger" også "stilsett".
sånn ca sånn skal det se ut:
#header {
background-color: #FFFFFF;
background-image: url(''HER ER URL'EN TIL DIN HEADER);
height: 480px;
background-repeat: repeat;
margin: 0px 0px 10px 0px; <--- HER!
Sett inn denne koden margin: 0px 0px 10px 0px; slik som jeg har gjort over. vil du ha større eller mindre mellomrom, bare endrer du der det står 10px.
FARGE BAK OVERSKRIFT
lyst på farge bak overskriftene dine?
det eneste du trenger å sette inn er:
h2 { background-color: #FFCCCC; }
selvfølgelig der det står
#FFCCCC; setter du inn den fargekoden du har lyst på.
det skal se ca sånn ut:
a { color: #000000}
a:link { color: #000000}
a:visited { color: #000000}
a:active { color: #000000}
h1, h2, h3, h4, h5 { font-family: Palatino Linotype, Book Antiqua, Palatino, serif; }
#header h1, #header p { display:none }
#header { color: #000000; }
h1 a, h1 a:link, h1 a:visited, h1 a:active { text-decoration: none; color: #000000; }
h2 { background-color: #FFCCCC; } <---- HER !h1, h2, h3, h4, h5 { font-family: Trebuchet MS, Helvetica, sans-serif; }
^alt dette ligger UNDER #footer
FÅ BORT NAVNET OVER HEADEREN
Koden:
#header h1, #header p { display:none }
Hvor skal jeg legge den inn?Den skal du legge nesten helt nederst i stilsettet ditt.
Slik skal det noenlunde se ut;
#header { color: #FFFFFF; }
#header h1, #header p { display:none }h1 a, h1 a:link, h1 a:visited, h1 a:active { text-decoration: none; color: #FFFFFF; }
FÅ BORT LINKEN (BLOGG.NO) UNDER HEADEREN DIN
Slik gjør du det:
Design -> Rediger -> Maler.
Ctrl + f. Søk på blogg.no, så skal du lete etter linjen;
<div class="breadcrumbs"><a href="http://blogg.no/">blogg.no</a> » ${BlogTitle}</div>
Denne skal du fjerne altså.
Etter du har tatt bort den, så skal du lagre malen, og da skal linken under headeren være borte.
RAMME RUNDT HVERT INNLEGG
Koden:
.entry {
border: 1px solid #708090;
background: #FFFFFF;
text-align: center;
}
Det har stått tidligere at du skal legge den helt nederst i stilsettet, men dette var visst feil, og det er derfor mange av dere har hatt problemer med denne koden! Men du skal nemlig legge koden der
#footer { slutter, altså nedenfor tegnet:
}
FÅ BORT RAMMEN RUNDT PROFILBILDET DITT
Koden du skal bruke:
<img style="float: left; border: 0;" src="URL-ADRESSEN TIL BILDET DITT" height="200">
Forklaring:
200 = der kan du velge hvor stort bildet skal være.
URL = Der skal du sette inn adressen for profilbildet ditt.
Hvor skal jeg legge inn koden?
Design -> Rediger -> Maler.
Søk (ctrl + f) på "profile".
Slik skal det ca. se ut:
<div id="profile" class="clearfix">
<div>
<a href="${ProfileUrl}" title="${ProfileName}">
<img style="float: left; border: 0;" src="URL-ADRESSEN TIL BILDET DITT" height="200">
</a>
</div>
FJERNE "SISTE KOMMENTARER", "AKIV"...
Du må først gå til maler (design -> Rediger -> Maler).
Når du har gjort det så søker du på f.eks. 'siste kommentarer'. Da skal du finne dette fram i maler:
<h3>Siste kommentarer</h>
<ul>
<tag:commentlist global="true" limit="10" sort="desc">
<li>${CommentAuthorLinkIf} om ${CommentArticleLink}</li>
</tag:commentlist>
</ul>
</div>
---
Dette skal du fjerne rett og slett. Det samme gjør du med 'Arkiv', 'Kategorier' osv. Du fjerner de du vil.
Etter det så trykker du på Lagre Malen, og da skal de være borte.
BAKGRUNN SOM STÅR "FAST"
Koden:
background-attachment:fixed;Hvor skal jeg legge den?
For at bakgrunnen din skal stå fast, legg den under
#wrapper {, men hvis
du ønsker at headeren din skal sitte fast, legger du den under
#header {
