Det var en tjej som mejlade om hur jag gör min design till arkiv så jag tänkte jag skulle tipsa er om hur man gör sig sitt eget Arkiv i menyn. En sak man måste tänka på är att varje ny månad som kommer så måste man fylla på med html-koder, annars syns inte det i arkivet. Det kommer inte automatiskt alltså...:)

Det första du ska göra är att gå in i din kodmall,framsidan. (Till att börja med) Leta upp
<div class="navheader">Arkiv</div>.
I mellan <ul> och </ul> ska du lägga till dina koder för arkivet. (Ta bort allt som finns där emellan, men spara det i tex. anteckningar så länge så att du kan ändra tillbaka, om det skulle bli något fel)

Förklaring på koderna du ska lägga till:
<font color="#färgkod" size="storleken" face="teckensnittet">2011</font>  <-- Året
<br>                                                                                                        <-- Radbrytning
<a href="http://tessbloggar.blogg.se/2011/january">Januari</a>               <-- Html-koden för Januari och
<a href="http://tessbloggar.blogg.se/2011/february">Februari</a>                    Februari.(Du ändrar ju min bloggadress till din)
<font color="#färgkod">Mars  April  Maj  Juni  Juli  Augusti  September  Oktober  November  December</font>                                                                                                    <-- Här är koderna för de månader som komma skall.

Där det står january och february...de ska alltid stå på engelska. Annars länkas arkivet fel.
january february march april may june july august september october november december


Det ska alltså se ut så här:

<div class="navheader">Arkiv</div>
<ul>
<font color="#färgkod" size="storleken" face="teckensnittet">2011</font>
<br>
<a href="http://tessbloggar.blogg.se/2011/january">Januari</a>
<a href="http://tessbloggar.blogg.se/2011/february">Februari</a>
<font color="#färgkod">Mars  April  Maj  Juni  Juli  Augusti  September  Oktober  November December </font>
</ul>

(Om du har flera år i arkivet så ändrar du bara året i länken och fortsätter med koderna...)
Om du nu vill ha detta arkivet på alla dina sidor måste du lägga till koderna i dina kodmallar: Framsidan, inläggssidan, kategorisidan och arkivsidan. (Glöm inte spara och se om det fungerar först...:))

Lycka till!

Tänkte jag skulle tipsa er om hur jag får olika sorters "ramar" runt många av mina bilder. Blir väldans snyggt tycker jag. :) Snyggt också om man vill ha bilderna i sin Header eller i menyn..:) Det är ett gratis program som jag använder mig av, PhotoScape. Finns att ladda hem gratis här.

- Gå in i din Stilmall, leta upp ↓
.commentform {

- Under .commentform så letar du upp background. Om du inte har background, lägg bara till det.

↓
.commentform {
background: #ffe3e5; ← tex. här. (Kvittar vart du lägger koden bara den hamnar inom .commentform { och  } Här är det en färg på bakgrunden, om du vill ha en bild som du gjort ska det se ut så här: background: url(din bildkod här) no-repeat;


Om du vill ha en ram runt ditt kommentarsfält så lägger du också till:
↓
border-top: 1px dashed #din färgkod;
border-right: 1px dashed #din färgkod;
border-left:1px dashed #din färgkod;
border-bottom: 1px dashed #din färgkod;


LYCKA TILL!

Det är enkelt att få Snö på bloggen nu i Vintertid! Bara följ med nedan...

> Gå till Design - Dina Kodmallar
> Leta upp </head>
> Lägg denna kod:
<script type="text/javascript"> Width =1200; // Height =8000; // Count =30; // MaxStep=3; // MinStep=1; // MaxFlake=7; // MinFlake=4; // PosX = new Array(); PosY = new Array(); StepX = new Array(); StepY = new Array(); StarSize=new Array(); for (i = 0; i < Count; i++) { PosX[i] = Math.random()*Width; PosY[i] = Math.random()*Height; StepX[i] =MinStep+Math.random()* -MaxStep; StepY[i] =MinStep+Math.random()* MaxStep; StarSize[i]=MinFlake+Math.random() * MaxFlake; document.write("<div id='Obj" + i + "' style='position:absolute; left:0px; top:-20px; z-index:10000; visibility:hidden; color:#fff; font-weight:normal; font-family:Verdana; font-size:"+StarSize[i]+"pt'>•</div>"); } function animate() { for (i = 0; i < Count; i++) { PosY[i] += StepY[i]; PosX[i] += StepX[i]; document.getElementById("Obj"+i).style.visibility = "visible"; if (PosY[i] > Width || PosX[i] > Height || PosX[i]<0) { // starta om från toppen av sidan när mitten nås PosX[i] = Math.random()*Width; ///2 PosY[i] = -20; StepX[i] = MinStep+Math.random()* -MaxStep; StepY[i] = MinStep+Math.random()* MaxStep; } document.getElementById("Obj"+i).style.top = PosY[i] + "px"; document.getElementById("Obj"+i).style.left = PosX[i] + "px"; } setTimeout("animate()", 50);// hastighet } setTimeout("animate()", 1000); </script>
ovanför </head>
> Klicka Spara kodmall
> Om du vill ha snö på alla sidor på bloggen måste du även lägga in koden på Inläggsidan,Kategorisidan och Arkivsidan.

LYCKA TILL!

Vill tipsa om en fin detalj man kan lägga till i sin blogg. Se nedan på bilden. ↓




Dessa iconer kan du bl.a. hitta [här]. Du sparar den som en bild och laddar upp den på din blogg.


Du går in i dina kodmallar, letar upp: </head>



Lägg till detta nedanför </head>:
<link rel="shortcut icon" href="din-bildadress till din favicon">



Glöm inte lägga till den koden i varje Kodmall. (Framsida, Inläggssida, Kategorisidan & Arkivsidan)

Lycka till!

- Först går du in i dina Stilmallar.
- Sedan letar du upp #side



- Så här ser det ut hos mig, se ovan ↑, kika där pilen är. Du lägger alltså till: margin-top: -Xpx;
Där X är hur många pixlar du vill flytta sidan(side) uppåt. Du får prova dig fram...:)


Lycka till!

Detta tips fungerar bara i Mozilla Firefox, fungerar alltså inte i Internet Explorer.
Om du vill ha rundade hörn utan att lägga in bilder...
- Gå in i dina Stilmallar
- Leta upp där du vill ha dina rundade hörn, kanske menyn/sidan och Content. Leta då upp side/content och lägg in denna kod:

-webkit-border-top-left-radius:10px; -webkit-border-top-right-radius:10px; -webkit-border-bottom-left-radius:10px;-webkit-border-bottom-right-radius:10px;-khtml-border-radius-topleft:10px;-khtml-border-radius-topright:10px;-khtml-border-radius-bottomleft:10px;-khtml-border-radius-bottomright:10px;-moz-border-radius-topleft:10px;-moz-border-radius-topright:10px;-moz-border-radius-bottomleft:10px;-moz-border-radius-bottomright:10px;

Där det står 10px; kan du öka eller minska storleken på de rundade hörnen....


Lycka till!

Om du vill ändra bakgrunden/färgen bakom inläggen så går du in i dina Stilmallar sedan letar du upp:
#content {    


Under #content letar du upp:
background-color: #FFFFFF;       <--- Där ändrar du till vilken färg du vill ha eller om du vill ha en bild då lägger du till:
background-color: #FFFFFF url(din bildadress) repeat;


Repeat eller no-repeat menas om man vill att bilden ska upprepas eller inte. Här ovan vill vi att den ska repeteras annars får vi inte bilden över hela Content.


Tänk på att kolla padding & margin så att man ser själva bilden bakom inläggen...=) Kolla också:
/** Post's body text **/
.entrybody {

att där det står background har en färg. Om inte background står, skriv dit det.

Det första du ska göra är att ta bort koden till Profilbilden som är standard på bloggen. Det gör du genom att gå in i dina Kodmallar och leta upp:
<div id="profile">

Under där ska du leta upp dessa rader:
<a href="${AppUrl}index.bd?fa=pf.view&amp;pf_id=${ProfileID}"><img src="${AppUrl}shared/img/profiles/${ProfileImage}" alt="Min profilbild" /></a>


Ta bort det och spara.
Klart, nu är din profilbild borta.


Tänk på att om du vill ha tillbaka den "vanliga" profilbilden i framtiden, spara koden i ett Word-dokument eller får du komma tillbaka hit och kopiera in denna kod härifrån igen. =)



Nu ska du ladda upp din bild så du får din bildadress. Sedan går du in i dina kodmallar igen och letar upp:
<div class="nav">


Efter där lägger du in följande kod:
<img src="din bild-adress här">



Tänk på att inte ladda upp bilden för stor så den får plats på din menysida.

Om du vill lägga in en egen text i menyn, en presentation av dig själv eller vad du nu vill.

- Gå in i dina Kodmallar.
- Leta upp:
<div class="nav">

- Under där lägger du in vad du vill skriva. Här är det bra om du vet lite om HTML-grunder. Kolla ---> här om du är osäker.

<center><font face="tahoma" size="1" color="#696969">din text här</font></center>
<br /><br />

osv.



Lycka till!

Detta är inte så svårt som det låter...

Gå in i dina Kodmallar och leta upp:

<div class="navheader">SENASTE INLÄGGEN</div>  eller vilket du nu vill ändra på.


Där det står SENASTE INLÄGGEN, ändra till vad du vill och spara din Kodmalll. Tänk på att göra likadant i de Kodmallar du har "Senaste inläggen" eller va det nu är du vill ändra.



Inte så svårt eller hur? =)

Stycket du ska leta upp finns i dina Stilmallar och leta upp denna:


.navheader {
font-family: Courier New ,Century Gothic;     <--- Välj teckensnitt
font-size: 13px;                         <--- Storlek
font-weight: bold;                      <--- Fet stil eller normal
color: #696969;                        <--- Vilken färg på teckensnittet
background: #FFFFFF;                <--- Bakgrundsfärg eller bild.
text-align: left;                          <--- Placering av rubriken, left, center el. right.
margin: 0px 15px 0px 15px;
border-bottom: 1px dotted #696969;      <--- Om du vill ha en linje under, som jag.
}



Om du vill ändra bokstäverna till stora bokstäver, lägg till text-transform: uppercase; så får du alltid stora bokstäver.




Lycka till!

Om du vill ta bort ordet OM vid din profilbild så ska jag visa dig var du ska göra det...lätt som en plätt är det. =)

Om du går in i dina Kodmallar så letar du upp:

<div id="profile">

och under där någonstans så ser det ut så här:
<h4>OM</h4>


Ta bort den raden...och spara din kodmall.

Nu är OM borta...

Man kanske vill ha en egen signatur efter varje inlägg. Jag ska försöka förklara hur man gör, det är inte så svårt.


- Först gör du en bild i Gimp/Paint eller vad du har för program.
- Ladda upp den på din blogg och spara bildadressen. Kika ----> HÄR om du är osäker på hur man gör.
- Sedan går du in i dina kodmallar...Letar upp detta stycke (Finns under <div id="content">):
<div>${EntryBody}</div> 
- Nedanför denna skriver du in:
<div align="right"><img src="din bildadress kod"></div> <--- Där det står right, alltså till höger, kan du ändra till Center eller Left om du nu vill det.

- Spara din Kodmall.

- Tänk på att göra detta på alla sidor i dina kodmallar; Framsida, Inläggssida, Kategorisida och Arkivsidan. (Och glöm inte spara mellan varje)


Lycka till!

Detta kanske man vill göra om man gör en egen Header med sitt bloggnamn i.
Du går in i dina kodmallar och letar upp: <div id="header">
Nedanför där så hittar du detta stycke:


<h1><a href="${BlogUrl}">${BlogTitle}</a></h1>
<h2>${BlogDescription}</h2>


Ta bort det!
Så enkelt va det! =)


Tänk på att ta bort de två raderna i både Framsida, Inläggssidan, Arkivsidan & Kategorisidan.

Ändrar inläggsrubriken gör du i dina Stilmallar. Gå in där och så bläddrar du ner till detta stycke:

/** Entry headers **/
h3 {
background: #FFFFFF;        <--- En vit bakgrund..Om du vill ha mönster eller en bild så ser det ut så här: background: url(din bildadress här);
font-family: tahoma,Courier New  <--- ditt teckensnitt du vill ha ex. Arial osv.
font-size: 1.1em;    <--- Vilken storlek på rubriken
font-weight: normal;   <--- Om du vill ha texten i fet stil skriv: bold istället.
color: #696969;   <--- Vilken färg texten ska ha.
letter-spacing: 0em;
margin: 0px 0px 0px 0px; 
text-align: left;       <--- Var du vill ha rubriken...left, center eller right.
border-bottom: 1px dotted #696969;   <--- Om du vill ha en linje under rubriken (som jag har)
}



Här är olika linjer man kan använda: solid, dashed, dotted, double, groove, ridge, outset, inset. Prova dig fram vem du tycker är bäst!


Om du vill ha linjer runt om hela Rubriken lägg till:

border-top: 1px dotted #696969;     
border-right: 1px dotted #696969;
border-left: 1px dotted #696969;


Sedan kan du ändra om du vill ha en annan färg (jag har grå) och om du vill ändra storleken på linjen ändrar du det med att öka 1px till det du vill ha.



Efter du har lagt till linjen/linjerna så får du kanske ändra margin lite...Läsa om Margin? Tryck ---> här.

Detta tips tycker jag är lite skoj, blir fint tycker jag. Ser lite avancerat ut men det är det inte.


- Du går in i din blogg, Design och stilmallarna.

- Jag har min kod precis under Body och den ser ut som nedan, men de länkarna finns lite överallt och de börjar med a och a:hover


a {color: #f9c5cd;text-decoration: none;}
a:hover {color: #696969; text-decoration:none; cursor: crosshair;}  <---- Detta (som är markerat med fet stil) lägger du till så får du ett snyggt kryss.


Förklaring av:
a betyder en länk hur den ser ut innan du tar pilen över den.
a:hover betyder en länk som du håller pilen över, hur den ser ut då.



Prova dig fram hur du vill ha dina länkar.

...i ett inlägg. Inte så svårt som det låter, jag ska försöka förklara.

- Skapa ett inlägg.


1. Markera det ord du vill länka.
2. Tryck på Infoga/redigera länk.




- Då kommer denna upp.

Där det står Länkens URL ska du skriva in dit du vill länka ditt ord. Där det står Mål - inte satt-, Klicka på nedåt pilen och välj om du vill att länken ska öppnas i samma fönster eller i ett nytt fönster.

Tryck Infoga
- Nu så är ordet länkat.

 

Om du ska länka en bild så måste du ladda upp en bild i inlägget.

1. Markera bilden.
2. Tryck Infoga/redigera länk.

Sedan gör du som jag förklarat ovan..=) Nu är ordet länkat och bilden länkad. =)

Nu tänkte jag tipsa dig om en grundläggande sak, att skapa, radera & ändra en Kategori.

- Det första du ska göra är att logga in på din blogg, trycka på fliken Blogg nr1.

- Sedan trycker du på underkategorien Kategori nr2.

- Där ser du nu dina Kategorier nr1, bl.a. kanske Allmänt.

 

- Nu kan du trycka på Ny kategori (nr2) uppe till höger för att skapa en ny kategori tex, Mode, tips eller vad du nu vill ha för någon ny Kategori. Det skriver du under Alias/namn. (Se pilen nedan) Sedan trycker du helt enkelt Lägg till Kategori.

 

- Om du vill radera en Kategori (Tänk på att inte radera en kategori om du redan har inlägg sparade där, då måste du spara dem på en annan kategori) tryck så att just den Kategorin markeras. Sedan längst ner så står Ta bort markerade, tryck på den (se bilden nedan). Då ska den Kategorin vara borta.

 

- Om du vill ändra namnet på en befintlig Kategori så klickar du på namnet på Kategorin du vill ändra och sedan ändrar du där det står Alias/Namn till det namn du vill ha, tryck sedan på spara ändringar.

 

Så enkelt var det, hoppas du förstår. Om inte, säg till så försöker jag förklara närmare.