Eppelskrutt -






Hur man får en kommentera knapp vid rubriken

Nu tänkte jag visa hur man får en kommentera knapp vid rubriken:



Börja med att gå in i KODMAKLLARNA och sök upp  <div id="content"> (det är under wrapper ganska högt upp).
I stycket finns <h3>${EntryTitle}</h3> och det är efter det vi skall sätta in en kod.
Lägg alltsp in nedanstående kod EFTER <h3>${EntryTitle}</h3>

<div>
<div style="text-align: right;"><a href="${EntryPermaLink}#comment">Kommentarer (${EntryCommentCount})</a></div></div>


Hur kan man ändra på denhär koden så att den blir som jag vill?
- ändra "text algin" till center eller left för att flytta på texten.
- ändra "Kommentarer" till något du tycker passar bättre
- ta bort "(${EntyCommentCount})" om du inte vill ha kvar siffran som visar hur många kommentarer man har
- om man vill ha det under rubriken kan man sätta ett <br> före koden


Fråga om det var något ni inte förstod eller om ni undrar något!

Hur man flyttar och lägger kategorierna som man vill

Jag har fått en fråga om hur jag fick mina kategorier att vara huller om buller och nu tänkte jag visa det.
Detta är lite klurigt, så läs noga igenom hur du skall göra.



Börja med att gå in på en (alla) kategori(er) och kopiera länk-adressen:
http://supereppel.blogg.se/category/dagbok.html

Det är bra att ha alla länkar sparade, för sedan är det lite klurigare att komma åt dessa länkar.
Bra att veta och komma ihåg är att kategorin alltid heter det som du först namngett den. Detta är bra att veta när du gör en ny kategori, och inte hittar någon länk till den.
OBS! Om du bytt namn på kategorin kommer den ändå att heta det den hette först i länken.
Ett exempel: Jag döper en kategori till "dagbok" men döper den senare till "panfu-dagbok", då kommer länken ändå vara http://supereppel.blogg.se/category/dagbok.html eftersom det var vad kategorin hette först.


När ni har alla länkarna från era kategorier går ni in i KODMALLARNA. Där söker ni upp
<div
class="navheader">Kategorier</div>
Ni hittar det under "side" och "senaste inlägg".
Ta sedan bort det understräckade:

<div class="navheader">Kategorier</div>
<ul>
<tag:categorylist>
<li><a href="${CategoryLink}">${CategoryName}</a></li>
</tag:categorylist>
</ul></div>



Istellet lägger ni in följande kod:
<a href="http://LänkenTillKategorin">KategorinsNamn</a><br>

Det skall finnas en kod för varge kategori. Så det är nu det blir petigt.
Ni kan lägga kategorierna i vilken ordning ni vill.

Den lilla koden <br> betyder BytRad och som namnet säger, gör den så att det blir en ny rad.
Vill ni ha kategorierna huller om buller som jag har dom, så har ni bara <br> efter några av kategori-koderna. Vilka? Det får ni testa er fram och avgöra själv vad som ser bäst ut!

Om ni inte har <br> efter varhe kategori-kod så kan det hända att ni tycker att kategorierna kommer väldigt nära varandra. Då kan ni använda er av &nbsp; som är ett mellanrum. Med koden &nbsp; bildas alltså ett mellanrum, sprecis som när du tycker på space-tangenten.



Hoppas att det var till hjälp. Har ni frågor eller problem är det bara att kommentera så skall jag försöka hjälpa er!

Hur man gör mouseover bilder

Jag har fått frågor om hur jag har gjort flikarna i menyn, så det tänkte jag berätta nu.
Detta är klurigt, så läs igenom allt två gånger så att du säkert har förstått.

Vad är en moseover bild?
- Det är en bild som övergår till en annan bild när man har musen över den.
Man behöver alltså två bilder!

Mina flikar består av dessa bilder:

Den första bilden syns när bloggen laddat och den andra när ni lägger musen på den första bilden.
Klickar man på bilden kommer man till ett inlägg eller sida, och det är det jag skall visa er hur man gör!

Såhär gör ni:
Börja med att göra själva bilderna, det som sedan blir själva "menyn".
Gå in i kodmallen och lägg in följande kod före </head> i alla kodmallar.


Sedan laddar ni upp bilderna på er blogg och kopierar URL-adressen. Alltså länken till bilderna (http:// )
Lägg in URL-adresserna i denna kod:

<div style="position:absolute; width:903px; x-index:0; left: 30px; top:370px;">
<a href="http://LÄNKditBILDERNAlänkar">
<img src="http://URLtillBILD1" oversrc="http://URLtillBILD2" border="0"></a></div>


Där det står "LÄNKditBILDERNAlänkar" skall ni skriva in URL-adressen dit bilden skall länka.
Där det står "URLtillBILD1" skall ni skriva in URL-adressen som den första bilden har. Alltså den som kommer att synas när bloggen laddat.
Där det står "URLtillBILD2" skall ni skriva in URL-adressen till den andra bilden. Alltså den som kommer att synas när man har musen på bilden.

Denna kod skall ni lägga in i kodmallara under <div id="wrapper">
Är flikarna på fel ställe så skall ni ändra siffrorna här --> left: 30px; top:370px;
"Left" ändrar hur mycket år vänster bilderna skall vara och "Top" ändrar hur högt upp bilderna skall vara. (Om man sätter ett minus tecken framför siffran så flyttas fliken åt andra hållet)
Skall man ha många flikar måste man ändra dehär siffrorna för alla flikar.


Förstod ni inte eller har ni frågor? Kommentera!

Hur man lägger till egna rubriker i menyn

Jag tänkte visa hur man lägger till egna rubriker i menyn, till exempel "Händer i bloggen" och "Kontakt".


Börja med att gå in på Design och Kodmallar.
Sök upp stycket <div id="side">, beroende på var du vill ha rubriken så söker du upp det stället i kodmallen.
Jag tar "Kontakt" som exempel. Jag har Kontakt under länkarna, så jag söker upp det.
När du har hittat stället du skall ha en ny rubrik på, så klistrar du in följande kod:

<div>RUBRIKHÄR</div><br>
TextTextTextText... <br>


( <br> betyder Byt rad. )
Om man tar mitt Kontakt-exempel så börjar koden att se ut såhär:

<br><div>Kontakt:</div>
[email protected]<br><br>



Och blir det inte rätt direkt, så är det bara att testa igen.
Har ni frågor? Kommentera!

Hur man delar upp menyn

Det jag tänkte visa nu är liite klurigare, så läs genom instruktionerna 2 gånger.

<-- Exempel på uppdelad meny. [Klicka på bilden för att göra den större]

Börja med att kopiera detta stycke:

#box {
padding: 0px 0px 0px 0px;
width: 190px;
padding: 10px 10px 10px 10px;
background: #dededb;
border-left: 0px solid #BAA89E;
border-right: 0px solid #BAA89E;
}


Gå sedan in i stilmallen och sök upp stycket "SIDE" alltså meny-stycket.
Ta bort menyfärgen ( background: #ffffff; ) skriv in "none" eller lämna det tomt.
Sen lägger du in stycket du nyss kopierade UNDER stycket side. Alltså inte i stycket utan under!



Gör de ändrigar i koden som behövs, bredden, färgen...
SPARA STILMALLEN!

Då är hälften avklarat, nu skall du gå in på kodmallarna.
Börja med framsidan och sök upp stycket "SIDE" där också.

För att få in ett stycke eller en text i menyn skall man skriva in följande kod:
<div id="box"> STYCKET/TEXTEN HÄR </div>

Vi kan ta "senaste inläggen" som exempel. Såhär ser det stycket ut:

<div>Senaste inläggen</div>
<ul>
<tag:recentlist limit="20">
<li><a href="${EntryPermaLink}">${EntryTitle}</a></li>
</tag:recentlist>
</ul>


För att få detta in i menyn så lägger du till <div id="box"> först i stycket och </div> i slutet så att det blir såhär:

<div id="box"><div>Senaste inläggen</div>
<ul>
<tag:recentlist limit="20">
<li><a href="${EntryPermaLink}">${EntryTitle}</a></li>
</tag:recentlist>
</ul></div>


SPARA KODMALLEN!
Detta skall man göra på ALLT man vill ha i menyn alltså; Profil, sök i bloggen, senaste inläggen, kategorier, arkiv, länkar, rss och bilder eller andra texter ni satt in i menyn.

När ni har gjort detta i kodmallens framsida så är det bara att byta kodmall till tex inläggssida och göra samma sak där.



Förstod ni inte eller är det något ni undrar över FRÅGA! :)

Färgkoder

#F4ED7C                                                                                  

#F4ED47

#F9E814

#C6AD0F

#AD9B0C

#82750F

#F7E859

#F9E526

#F9DD16

#F9D616

#D8B511

#AA930A

#99840A

#F9E55B

#F9E24C

#F9E04C

#FCD116

#F7B50C

#C6A00C

#AA8E0A

#897719

#F9E27F

#F7E8AA

#F9E070

#F9E08C

#FCD856

#FFCC49

#FFC61E

#FCB514

#E0AA0F

#BF910C

#B58C0A

#A37F14

#7C6316

#F4E287

#F4DB60

#F2D13D

#E29100

#C6930A

#9E7C0A

#705B0A

#FFD87F

#FFD691

#FCC963

#FCCE87

#FCBF49

#FCBA5E

#FCA311

#F99B0C

#D88C02

#CC7A02

#AF7505

#996007

#7A5B11

#6B4714

#F2CE68

#F2BF49

#EFB22D

#E28C05

#C67F07

#9E6B05

#725E26

#FFD69B

#FFB777

#FCCC93

#FF993F

#FCAD56

#F47C00

#F77F00

#DD7500

#B55400

#BC6D0A

#8C4400

#995905

#4C280F

#F4DBAA

#F9BF9E

#F2C68C

#FCA577

#EDA04F

#FC8744

#E87511

#F96B07

#C66005


#D15B05

#9E540A

#A04F11

#633A11

#843F0F
#F9C6AA

#F9A58C

#FC9E70

#F98E6D

#FC7F3F

#F97242

#F96302

#EA4F00

#F95602

#DD5900

#DD4F05

#BC4F07

#A53F0F

#6D3011

#843511

#F9BAAA

#F98972

#F9603A

#F74902

#D14414

#933311

#6D3321

#F9AFAD

#F99EA3

#F9B2B7


#F9827F

#F9848E

#FC6675

#F95E59

#FC4F59

#F43F4F

#EF2B2D

#D62100



#E23D28

#D62828

#CC2D30

#C13828

#AF2626

#A03033

#7C2D23

#7C211E

#5B2D28

#F9BFC1

#FC8C99

#FC5E72

#E8112D

#D11600

#CE1126

#AF1E2D

#7C2128

#FFA3B2

#FCBFC9

#FC758E

#FC9BB2

#F4476B

#F4547C

#E5053A

#E00747

#DB828C

#C10538

#992135

#A80C35

#931638

#F4C9C9

#EF99A3

#772D35

#D81C3F

#C41E3A

#A32638

#8C2633

#F2AFC1

#ED7A9E

#E54C7C

#D30547

#BAAA9E

#8E2344

#75263D

#FFA0BF

#FF77A8

#F94F8E

#EA0F6B

#CC0256

#A50544

#7C1E3F

#F4BFD1

#ED72AA

#E22882

#AA004F

#930042

#70193D

#F993C4

#F46BAF

#ED2893

#D60270

#AD005B

#8C004C

#6D213F

#FFA0CC

#FC70BA

#F43FA5

#CE007C

#AA0066

#8E0554

#F9AFD3

#F7C4D8

#F484C4

#EA6BBF

#ED4FAF

#DB28A5

#E0219E

#C4057C

#C4008C

#C40F89

#A8007A

#AD0075

#9B0070

#7C1C51

#87005B

#F2BAD8

#EDA0D3

#E87FC9

#CC00A0

#B7008E

#A3057F

#7F2860

#EDC4DD

#E29ED6

#D36BC6

#AF23A5

#A02D96

#772D6B

#E5C4D6

#D8A8D8

#D1A0CC

#BF93CC

#D3A5C9

#C687D1

#BA7CBC

#AA72BF

#9B4F96

#AA47BA

#9E4FA5

#8E47AD

#72166B

#930FA5

#720082

#872B93

#66008C

#681E5B

#820C8E

#70147A

#5B027A

#5E2154

#701E72

#66116D
#560C70

#542344

#602D59

#5B195E

#4C145E

#E0CEE0

#C9ADD8

#C6AADB

#B591D1

#9663C4

#9B6DC6

#6D28AA


#894FBF

#59118E

#4F2170

#56008C

#442359

#44235E

#BAAFD3

#AD9ED3

#D1CEDD

#BFD1E5

#AFBCDB

#9E91C6

#937ACC

#A5A0D6

#A5BAE0

#5B77CC

#8977BA

#7251BC

#6656BC

#5E68C4

#3044B5

#38197A

#4F0093

#4930AD

#2D008E

#2B1166

#3F0077

#3F2893

#1C146B

#1E1C77
#260F54

#35006D

#332875


#141654

#192168


#2B2147

#2B0C56

#2B265B

#14213D

#112151

#B5D1E8

#6689CC

#002B7F

#002868

#002654

#9BC4E2

#75AADB

#3A75C4

#0038A8

#003893

#00337F

#002649


#C4D8E2

#93C6E0

#A8CEE2

#60AFDD

#75B2DD

#008ED6

#0051BA

#005BBF

#003F87

#0054A0

#00386B

#003D6B

#002D47

#00334C

#82C6E2

#BAE0E2

#51B5E0

#51BFE2

#00A3DD

#007FCC

#00A5DB

#0072C6

#0084C9

#005B99

#00709E

#004F6D

#00546B

#003F54

#004454

#A5DDE2

#70CEE2

#00BCE2

#00A3D1

#007AA5

#00607C

#003F49

#72D1DD

#7FD6DB

#28C4D8

#2DC6D6

#00ADC6

#00B7C6

#0099B5

#009BAA

#00829B

#00848E

#006B77

#006D75

#00494F

#00565B

#C9E8DD

#93DDDB

#4CCED1

#009EA0

#007F82

#008789

#007272

#006663


#AADDD6
#87DDD1

#8CE0D1

#7AD3C1

#56C9C1

#56D6C9

#47D6C1

#35C4AF

#00B2AA

#00C1B5

#00C6B2

#00AF99

#008C82

#008977

#00AA9E

#00B2A0

#009B84

#007770

#008C82

#009987

#008270

#006D66

#006056

#008272

#006B5B

#005951

#00493F

#004F42

#004438

#BAEAD6

#A0E5CE

#5EDDC1

#00997C

#007C66

#006854

#9BDBC1

#8EE2BC

#7AD1B5

#54D8A8

#00B28C

#00C993

#009977

#00B27A

#007A5E

#007C59

#006B54

#006847

#00563F

#024930

#B5E2BF

#96D8AF

#70CE9B

#009E60

#008751

#006B3F

#234F33

#B5E8BF

#99E5B2

#84E2A8

#00B760

#009E49

#007A3D

#215B33

#AADD96

#A0DB8E

#60C659

#1EB53A

#339E35

#3D8E33

#3A7728

#D3E8A3

#C4E58E

#AADD6D

#5BBF21

#009E0F

#56AA1C

#568E14

#566B21

#D8ED96

#CEEA82

#BAE860

#8CD600

#54BC00

#7FBA00

#709302

#566314

#E0EA68

#D6E542

#CCE226

#BAD80A

#9EC400

#A3AF07

#939905

#707014

#E8ED60
#E0ED44


#D6E80F

#CEE007

#BAC405

#9E9E07

#848205

#F2EF87

#F2ED6D

#EAED35

#EFEA07

#E5E811

#EDE211

#E0E20C

#E8DD11

#C1BF0A

#B5A80C

#AFA80A

#998C0A

#998E07

#6D6002

#D1C6B5

#C1B5A5

#AFA593

#998C7C

#827566

#6B5E4F

#CEC1B5

#A8998C

#99897C

#7C6D63

#66594C

#3D3028

#C6C1B2

#B5AFA0

#A39E8C

#8E8C7A

#777263

#605E4F
#282821

#D1CCBF

#BFBAAF

#AFAAA3

#96938E

#827F77

#60605B

#2B2B28

#DDDBD1

#D1CEC6

#ADAFAA

#919693

#666D70

#444F51

#30383A

#0A0C11

#E0D1C6

#D3BFB7

#BCA59E

#8C706B

#593F3D

#493533

#3F302B

#D1D1C6

#BABFB7

#A3A8A3

#898E8C

#565959

#494C49

#3F3F38

Hur man får konturer runt bloggen

Gå in på din stilmall och bläddra ner till stycket #SIDE eller stycket #CONTENT
Side är menyn och content är själva inläggen.
Koden som man skall sätta in är följande:

border-top: 0px solid #000000;
border-right: 0px solid #000000;
border-bottom: 0px solid #000000;
border-left: 0px solid #000000;


Och den finns redan i de flesta designerna. 0xp = hur tjock konturen skall vara.  #000000 = färgen på konturen.
Det spelar egentligen inte någon roll vart ni sätter in koden, så länge den är under rubriken side (eller content eller både och).
Såhär ser det ut för mig:



Spara stilmallen, klar! :)

Hur man lägger in You Tube filmer på bloggen



OBS: Nu för tiden kommer "bädda in"-knappen fram först när man tryckt på "dela"-knappen.


Ta bilder i panfu

Hur tar man bilder i panfu? Såhär gör man:

i mac så trycker man på tangenterna ”Cmd” eller ”Apple” och ”Shift” och ”3” samtidigt, då får man hela skärmen som en bild. men jag brukar trycka på tangenterna ”Cmd” eller ”Apple” och ”Shift” och ”4” samtidigt och då kan man dra en ruta där man vill ha bilden. sen ploppar bilderna upp på skrivbordet ;) jättelätt!

windows/pc däremot ska man trycka på någon av tangenterna “Skriv ut” eller “scrn” eller “Print Screen Syst” (brevid knappen “F12″). och sen måste man infoga bilden i ett dokument, annars syns den inte. man kan öppna ett tomt dokument i något av programmen Paint eller Word eller något annat bildredigeringsprogram. sen så trycker man på tangenterna ”Ctrl” och ”V” samtidigt eller så högerklickar man med musen och väljer ”Klistra in”.

och om det inte fungerar? om man inte har någon av tangenterna “Skriv ut” eller “scrn” eller “Print Screen Syst” och man har Windows Vista eller 7 så kan du gå till Start> Alla program> Tillbehör> Skärmklippsverktyget


Byta länk

Vill du bli länkad på min blogg? Vi kanske kan komma överens?
Jag länkar till din blogg om du länkar till min. Alltså gå till din blogg och skapa en länk till http://eppelpeppel.blogg.se och kommentera i DETTA inlägg att du gjort det. Jag kollar upp att du länkar och sen länkar jag till din blogg. Lätt va?
Glöm inte att skriva namn och bloggadress i kommentaren.

Tips

Detta är en kategori där jag kommer samla alla möjliga trevliga tips som kan hjälpa dig med det ena och det andra.
Jag kommer att fylla på med mera tips nu som då, så du kommer alltid att ha chansen att lära dig något nytt.

Listan nedanför är uppdelad i olika kategorier av tips. För att komma till det tips du vill veta mer om är det bara att klicka på tipsets namn.
Och om det du vill veta inte finns i listan är det bara att kommentera så gör jag allt för att få svar på din fråga.


☆ Blogg Design ☆

Färgkoder
Hur man får konturer runt bloggen (blogg.se)
Hur man delar upp menyn (blogg.se)
Hur man lägger till egna rubriker i menyn - Till exempel "Kontakt" (blogg.se)
Hur man gör mouseover bilder (blogg.se)
Hur man flyttar och lägger kategorierna som man vill (blogg.se)
Hur man får en kommentera knapp vid rubriken (blogg.se)



☆Bloggandet☆

Hur man lägger in You Tube filmer på bloggen
Kastas in i bloggvärlden - Om du skall skapa en egen blogg



☆Panfu☆

Hur man tar bilder i panfu