Dagens fråga - Kategorierna



hur delar man upp kategorierna?:o

Fick någon förklaring men fattade inte:)

- Ett inlägg om hur man delar upp själva menyn har jag skrivit förut.
Det kan ni läsa HÄR.
Att dela in kategorierna är inte heller så värst svårt om man nu förstår och gör rätt hehe.

Gå in på Design>Kodmall och skrolla ned till detta stycke:
<div>Allt om bloggdesign</div>
<ul>
<tag:categorylist>
<li><a href="${CategoryLink}">${CategoryName}</a></li>
</tag:categorylist>
</ul>
<div>Kategorier</div>
<ul>
<tag:categorylist>
<li><a href="${CategoryLink}">${CategoryName}</a></li>
</tag:categorylist>
</ul>

Ta bort det som jag markerat med fetstil.
Men det kan vara smart att klistra in det i något dokument eller något så att man har kvar det utifall något skulle bli fel.
Ett till tips då är att inte testa det här första gången på sin "vanliga blogg" utifall det nu blir fel, för tro mig det är inte kul när hela kodmallen fuckar upp sig.
Så gör en till blogg under samma användare som du använder som en såkallad "testblogg"
Då kan du experimentera med bloggdesigner där!
Nu kommer vi till delen när man får använda hjärnan lite.
Gå till din blogg, och tryck dig in på en av dina kategorier.

Kopiera sedan adressen som står i adressfältet, kan t.ex. se ut såhär http://elinsuundgren.blogg.se/category/dagens-outfit.html
Klistra in det i något dokument.

Kopiera sen det här:
<font face="verdana" size="2"color="#000000">
<div>RUBRIK</div> <br />
<a href="länk till kategori">Kategorinamn</a>
<br />
<a href="länk till kategori">Kategorinamn</a>
<br />
<a href="länk till kategori">Kategorinamn</a>
<br />

Den texten ska klistras in där du klippte ut texten som satt där från början.
Där det står "RUBRIK" ska du skriva rubriken, i mitt fall "Personligt". Där det står "länk till kategori" så klistrar du in sökfältet med kategorilänken. Där det står kategorinamn skriver du vad namnet på kategorin ska heta, i mitt fall "Dagens outfit".

Det kan t.ex. se ut såhär när det är klart:
<font face="verdana" size="2"color="#000000">
<div>PERSONLIGT</div> <br />
<a href="
">Shopping</a>
<br />
<br />
Sen fortsätter man bara så på alla sina kategorier.
Om man vill ha fler eller mindre länkar under är det bara att ta bort eller klistra ditt en ny rad och göra samma sak.
Sen är det bara att ha tålamod och försöka antar jag, lycka till!

<font face="verdana" size="2"color="#000000">
Betyder förresten att man bestämmer vad det ska vara för typsnitt, storlek och färg på texten!

Dela upp menyn

hur har du gjort mellanrummen mellan alla katergorier i menyn , och sen mellanrummen meller menyn och där inläggen syns ?

- Jag fick en fråga om min meny som jag nu tänkte försöka svara på, kan inte garantera att någon förstår.
Jag har aldrig haft speciellt stora problem med att förstå mej på webbdesign, har alltid tyckt att det har varit rätt enkelt, men det är svårt att förklara för andra ;)
♥ Först lägger du till denna koden under #side i din stilmall.
#box {
width: 212px;
padding: 10px 10px 10px 10px;
background: #FFFFFF;
border: 1px solid #FF4A7D;
}

♥Ta bort (background: #FFFFFF;) i #side.  I din stilmall.

Den behövs inte där eftersom att det redan finns en background i #box {.
Så det ska se ut så här:

#side {
border:0 solid #D4C8BE;
float:left;
margin-top:-254px;
padding:0 8px;
position:absolute;
width:190px;
}
#box {
background:none repeat scroll 0 0 #FDFBF9;  <-- Background=bakgrunden #FDFBF9 = färgen på BG
border:1px solid #D4C8BE;      <<--- Border = ramen runt  #D4C8BE = färgen på ramen
padding:0 8px;
width:190px;
}
Nu ska du göra själva boxarna/rutorna i ALLA kodmallar.

Kodmalllarna är följande:

Framsidan
Inläggsidan
Kategorisidan
Arkivsidan

Du lägger in koderna för boxarna under #side i kodmallen, kom ihåg det!
Om du inte lägger dom under #side så hamnar dom inte i menyn.

KOD
<div id="box"> INNEHÅLLET SOM DU VILL HA I DIN BOX </div><br />
Du lägger alltså till  <div id="box"> där du vill att boxen ska börja, och    </div><br />
där du vill att boxen ska sluta.

Det är bara att upprepa det så får du fler boxar, tills allt i menyn är i olika boxar!
♦ Först lägger du till denna koden under #side i din stilmall.
#box {

width: 212px;
padding: 10px 10px 10px 10px;
background: #FFFFFF;
border: 1px solid #FF4A7D;
}
♦Ta bort (background: #FFFFFF;) i #side.  I din stilmall.
Den behövs inte där eftersom att det redan finns en background i #box {.
Så det ska se ut så här:

#side {
border:0 solid #D4C8BE;
float:left;
margin-top:-254px;
padding:0 8px;
position:absolute;
width:190px;
}
#box {
background:none repeat scroll 0 0 #FDFBF9;  <-- Background=bakgrunden #FDFBF9 = färgen på BG
border:1px solid #D4C8BE;      <<--- Border = ramen runt  #D4C8BE = färgen på ramen
padding:0 8px;
width:190px;
}
Nu ska du göra själva boxarna/rutorna i ALLA kodmallar.
Kodmalllarna är följande:

Framsidan
Inläggsidan
Kategorisidan
Arkivsidan
Du lägger in koderna för boxarna under #side i kodmallen, kom ihåg det!
Om du inte lägger dom under #side så hamnar dom inte i menyn.

KOD
<div id="box"> INNEHÅLLET SOM DU VILL HA I DIN BOX </div><br />
Du lägger alltså till  <div id="box"> där du vill att boxen ska börja, och    </div><br />
där du vill att boxen ska sluta.
Det är bara att upprepa det så får du fler boxar, tills allt i menyn är i olika boxar!

Så för att då göra som jag har och få "senaste inlägg" "kategorier" och "arkiv" var för sig leta bara reda på då te.x. arkiv i kodmallen och sätt koden framför och bakom så blir det en egen "box" och sen gör du så på allt du vill ska ha en egen "box" liksom.
Åh, svårt att förklara..
Hoppas att någon stackare förstod annars är det bara att fråga så ska jag försöka förklara mer.



Dagens fråga - Kommentar knapp


Hur har du gjort så att man kan ändra va de står där man skickar kommentarer? :)


(Min kommentar knapp ser ut såhär)

För att ändra texten som står där går du in i din kodmall, gå sen in i "inläggssidan"
Där bläddrar du ner ett tag till du hittar ett stycke som börjar såhär :

<form action="${AppUrl}index.bd?fa=comment.insert"

fortsätt sen bläddra ner till slutet av det stycket och då ska det stå en text där, den texten som det står på din knapp och då är det bara att ändra den texten.
I min kodmall ser det ut såhär :



Texten som är understruken med rött är den text som ska ändras för att ändra kommentarknappen.
Det är bara att skriva in där vad du vill att det ska stå, jag skrev in Tack för din kommentar

Hoppas att jag hjälpte till lite iallafall, annars är det bara att fråga igen så kan jag försöka förklara bättre!

Bild på sidan

Kan du visa i ett inlägg hur man får in en bild på sidan? (där man skriver en presentation osv.)
Asså hur man får den stor osv. tacksam för svar

-
Jovisst kan jag försöka visa det, det kanske blir lättare att göra en video eller nåt :)
Men jag gör det inte nu då jag inte sitter vid min dator som fortfarande inte funkar, men håll utkik!





Fallande snö i bloggen

1)   Gå in i din kodmall

2)   Leta upp kodstycket <head>

3)   Klistra sedan in följande kod under <head>



<script type="text/javascript">

Width =1200; // Här anger du bredden på sidan som ska snöas in

Height =7000; // Här anger du höjden på sidan som ska snöas in

Count =50; // Här skriver du in antal snöflingor

MaxStep=3; // Här skriver du in max steg i rörelsen

MinStep=1; // Här skriver du in min steg i rörelsen

MaxFlake=10; // Här skriver du max storlek på snöflinga

MinFlake=4; //  och min storlek på snöflinga

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:#f0feff; 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>





Kom ihåg att detta måste göras i alla kodmallar d.v.s i arkivsidan, kategorisidan, inläggsidan & framsidan.
Och glöm inte heller att trycka på spara i varje kodmall.

Lycka till!



Fredagens fråga

        
              
Anna om Drar nu:
Vet du hur man får rubriken att stå på mitten? :)
Vill jätte gärna veta. och egentligen vill jag väl kanske ha den på höger sida. så om du kan så är jag tacksam för svar!

Svar: Ja , det är inte så svårt att få rubriken i mitten , kan även visa hur man får den på höger sida :)

1) Gå först in i din stilmall.

2) Leta upp kodraden som ser ut såhär:

/** Entry headers **/
h3 {
background: #FFFFFF;
font-family: Bodoni MT Condensed, Bodoni MT Condensed, Bodoni MT Condensed;
font-size: 44px;
font-weight: bold;
padding: 5px 5px 5px 0px;
color: #4F4F4F;
margin: 0px 0px 10px;
text-transform: normal;
border-bottom: 2px solid black;
border-top: 3px solid black;
text-align: left;

3) Ändra nu på text-align: left;
Om du vill ha rubriken i mitten ändrar du till center och om du vill ha rubriken till höger ändrar du till right

Så att det ser ut såhär:

/** Entry headers **/
h3 {
background: #FFFFFF;
font-family: Bodoni MT Condensed, Bodoni MT Condensed, Bodoni MT Condensed;
font-size: 44px;
font-weight: bold;
padding: 5px 5px 5px 0px;
color: #4F4F4F;
margin: 0px 0px 10px;
text-transform: normal;
border-bottom: 2px solid black;
border-top: 3px solid black;
text-align: center;

eller såhär:

/** Entry headers **/
h3 {
background: #FFFFFF;
font-family: Bodoni MT Condensed, Bodoni MT Condensed, Bodoni MT Condensed;
font-size: 44px;
font-weight: bold;
padding: 5px 5px 5px 0px;
color: #4F4F4F;
margin: 0px 0px 10px;
text-transform: normal;
border-bottom: 2px solid black;
border-top: 3px solid black;
text-align: right;

Hoppas att jag har varit till någon hjälp , ni får fråga om det är något som ni undrar över.

Fråga

                            
                            

 
                       Johanna om Vilken var snyggast?
Hejsan, hur får du stjärnorna i menyn? (dom bredvid varje kategori) Riktigt snyggt!:)

sv:
Vad kul att du tyckte att det var fint , jag tänkte försöka förklara det här nedanför :-)


1) Välj först vilken bild du vill ha och tryck på bild nedanför skapa nytt inlägg  på första sidan.
Ladda upp bilden du har valt där.

2) När du har tryckt på laddat upp bild så kommer det synas en bild av din bild på vänster sida , tryck då på den.

3) Kopiera sedan adressen för din bild  ( adressen som står i adressfältet )

4) När du har kopierat adressen så går du in i din stilmall och letar upp kodraden där det står

.nav ul {
padding: 0px;
font-weight: normal;
margin: 0px 0px 8px;
}

5)  Koipera sedan denna kod rad :
list-style: url(adressen till din bild här);

6) Klistra in adressen till din bild där det står så.

7) Såhär ska det se ut om du har gjort som jag skrev :

.nav ul {
padding: 0px;
font-weight: normal;
margin: 0px 0px 8px;
list-style: url(adressen till din bild här);
}

8) Lite nedanför den här kodraden finns det en annan kod rad som ser ut såhär:

.nav li {
list-style: none;
padding: 0px 0px 2px;
font-weight: normal;
margin: 0px;
list-style: none;
}

Om det ser ut såhär på din kodrad så radera list-style: none; som står längst ner.

9) Klicka sedan på spara och se så att det fungerar.





Fixa en signatur

Det var några som undrade hur man fixade en signatur till sin blogg, och det är faktiskt inte så svårt :)
Tänkte iallafall försöka att förklara för er här.

1) Börja med att göra en signatur som du vill ha på t ex Paint , Photoshop eller något annat liknande program och när du har gjort klart den så döper du den och sparar den på ett ställe där du kan hitta den.
Min ser ju t ex ut såhär:





2) Logga sedan in på din blogg och tryck på bild som finns på ena sidan under nytt inlägg
sen ska du trycka på bläddra och där väljer du din bild.
När du valt bild trycker du på ladda upp bild.

3) Då kommer din bild att dyka upp i litet format på vänstra sidan och då ska du trycka på den
Det kommer då se ut såhär :


4) Kopiera adressen som står i rutan jag har gjort en röd ram runt
(Ett tips är att ni kan klistra in den i något dokument eller nåt annat för det kommer mer där ni ska kopiera)
Backa sedan tillbaka och tryck på design.


5) När ni har tryckt på design så gå in i era kodmallar
och leta upp kodraden där det står såhär:


<div class="entrybody">${EntryBody}</div>
<div class="entrymeta">

Såhär ser det ut:
(Det är ganska högt upp)


<div id="header">
   </div>
<div id="content">
  <tag:entrylist limit="15">
   <a name="a${EntryNum}"></a>
   <h3>${EntryTitle}</h3>
    <div>${EntryBody}</div>
<div class="entrymeta">
   ${EntryDate} @ ${EntryTime}
    <a href="${EntryPermaLink}">Permalink</a>
   Kategori: <a href="${EntryCategoryLink}">${EntryCategoryName}</a>
    <a href="${EntryPermaLink}#comment">Kommentarer (${EntryCommentCount})</a>
 <a href="${EntryPermaLink}#trackback">Trackbacks (${EntryTrackbackCount})</a>





6) kopiera sedan det här:

<div align="center"><img src="adressen till din bild"></div>

Och klistra in det emellan de 2 kodraderna så att det ser ut såhär :


<div>${EntryBody}</div>
<div align="center"><img src="adressen till din bild"></div>
<div class="entrymeta">

7)  Sen tar du adressen till din bild som du kopierade tidigare och klistrar in den där det står
"adressen till din bild
Sen är det bara att spara och då ska signaturen synas längst ner i alla dina inlägg :)



Hoppas att jag var till någon hjälp , om du inte förstod så kan du skriva en kommentar till mej så ska jag försöka att hjälpa dej ;)