Header Ads

Lägg till en kolumn i Minimas bloggmall - redigerat inlägg!

Många bloggare som använder Blogspots grundmall Minima vill lägga till en extra kolumn i sin bloggmall. Det är inte speciellt svårt, men kräver att man går in i kodmallen och ändrar på en del siffror och lägger till en bit kod.
Så här gör du:

Gå till din bloggs Layoutläge, Redigera HTML.

Scrolla ner till Header.
Här ändrar du vidden (width) från 660 pixlar till 1000 pixlar.


Scrolla vidare ner till Header Description
Här ändrar du max-vidden (max-width) från 700 pixlar till 1000 pixlar.


Gå ner till Outer Wrapper, ändra vidden från 660 pixlar till 1000 pixlar.


Scrolla vidare ner till Main Wrapper
Här ändrar du vidden (width) från 410 pixlar till 480 pixlar
(vi vill ju inte att våra bloggposter ska se ihopklämda ut mellan de två sidokolumnerna)


Scrolla ner till Sidebar-Wrapper
Här lägger du till koden:
margin: 0px 10px 0px 5px;


Scrolla ner till Footer
Här ändrar du vidden (width) från 660 pixlar till 1000 pixlar


Nu är det dags att lägga till den första koden för vår nya sidebar. Den ska ligga mellan Outer Wrapper och Main Wrapper, då du får scrolla upp en bit igen.

Vi döper den till left-sidebar eftersom den ska ligga till vänster om din main wrapper, alltså den kolumn där du skriver dina bloggposter.

Koden du ska klistra in ser ut så här:


#left-sidebar-wrapper {
width: 220px;
margin: 0px 35px 0px 0px;
float: $startSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}



Nu är det dags för den sista koden att klistras in.
Scrolla ner till Content-wrapper eller sök efter orden med hjälp av Ctrl+F.

När du kommer ner dit ser du att varje wrapper i din blogg har ett eget litet stycke med sitt id och innehåll. Din nya sidebar sk ligga precis ovanför Main Wrappers stycke.

Man bestämmer kolumnernas läge i bloggmallen genom att skriva den kolumn som ska ligga längst till vänster (startside) först/överst. Längst till höger (enside) ska alltså ligga längst ner.

Klistra in följande kod ovanför Main Wrappern:


<div id='left-sidebar-wrapper'>
<b:section class='sidebar' id='left-sidebar' preferred='yes'>
<b:widget id='BloggerButton1' locked='false' title='' type='BloggerButton'/>
</b:section>
</div>


Förhandsgranska nu din blogg och se efter om du fått en ny kolumn med ett Bloggermärke.
Detta märke/sidelement kan du enkelt plocka bort via din bloggs Layoutläge efteråt.

Om det stämmer, spara kodmallen.

Nu ska ditt Layoutläge se ut så här:

37 comments:

  1. Hej!
    Jag gjorde tre kolumner och det gick bra men när jag sedan skulle ta bort bloggermärket så förändrades hela bilden i layout läget. Det blev två kolumner som blev jättebreda. Som tur var kunde jag följa dina instruktioner och få tillbaka tidigare läge. Vad gjorde jag för fel?

    ReplyDelete
  2. Hm, låter konstigt. Det var i Layoutläget sa du? Annars försvinner ju en kolumn i bloggens synliga läge tills man lägger in något i den nya sidebaren, men det är nog inte det du menar?

    Hör av dig om du vill ha hjälp att lägga in den andra sidebaren! amas_1@hotmail.com (finns länkat högre upp på bloggen också)

    ReplyDelete
  3. hejsan, allt gick kanon. men hur gör man för att få båda sid kolumnerna på samma sida? så som du har. har testat lite själv att försöka ändra men det blev helknäppt!

    ReplyDelete
  4. Testade du att flytta det sista kodstycket i inlägget - alltså div-id - ner under div-id main-wrappern? Så att main ligger längst till vänster? Ev kan man behöva flytta om de första koderna också så att de ligger i rätt ordning, de högre upp i mallen under Outer Wrappern.

    Man behöver också justera float och margin så att det inte blir för stora mellanrum och en sidebar ev halkar ner under eftersom den inte får plats. Det är lite pill med allt som du förstår, men visst går det!

    ReplyDelete
  5. hmm, nee det testade jag inte :P är ingen expert på det här.. vet inte om du redan gjort det men skulle vara jätte gulligt om du gjorde ett inlägg om hur man gör exakt! :)

    ReplyDelete
  6. Hej!
    Gjorde ett nytt försök men då försvann hela innehållet i min vänstermeny (på bloggsidan, inte i layout läge) Jag fattar ingenting. Struntar i den tredje kolumnen. Gillar verkligen dina instruktioner, de är lätta att följa. Får testa något annat. :)

    ReplyDelete
  7. Hej om jag ändrar så jag får 3 kolumner kommer mina inlägg och gadgets etc att försvinna så jag måste göra dom på nytt

    ReplyDelete
  8. Jag följde anvisningarna och det funkade superbra tack så mycket!!!

    ReplyDelete
  9. Tack så mycket! En föredömligt tydlig och pedagogisk instruktion. Din blogg är en guldgruva för oss med obefintlig kunskap om kod.
    Keep up the good work!

    ReplyDelete
  10. Det ser rätt ut på min blogg men i layoutläget har jag bara två kolumner. Alla sidelementen ligger till vänster fast de är på högersidan i den färdiga bloggen. Dessutom är det väldigt tätt mellan mittdelen och högersidan. Jag tror jag mailar en skärmdump till dig...

    ReplyDelete
  11. Hej!
    Tack för underbara instruktioner :)
    Till och med jag tycker att det är kul att ändra i koderna.
    Om jag vill ha headern bara över texten och inte över annonserna på sidan hur gör jag då?
    Sen skulle jag vilja ha textdelen bredare och flytta upp om mig till den vänstra kolumnen.

    Mycke blev det :)

    ReplyDelete
  12. Om mig flyttar du i bloggens Layoutläge. Det är bara att dra gadgeten dit du vill ha den.

    Du kan ändra headerns vidd i Redigera HTML-kodläget. Om du nu har bytt vidden till 1000 pixlar då du la in den tredje kolumnen kan du enkelt minska ner antalet pixlar igen till den bredd du vill ha. Testa dig fram till vilken bredd som känns rätt genom att förhandsgranska innan du sparar mallen.

    ReplyDelete
  13. Jag provade instruktionerna på en testblog och det funkade bra. När jag sedan skulle prova på min riktiga blogg då gick det inte alls bra.

    Jag kunde inte se mer än lite av högersidan av min blogg och resterande var vitt. Läste i instuktionerna om att flytta det sista kodstycket, ändra på pixlar för att få plats, men jag lyckas inte.

    Eftersom jag inte har någon aning om hur och vad man kan prova med mer, så känns det ganska hopplöst att få dit en tredje kolumn för mig.

    När jag väljer förhandsgranska så blippar min sida upp för en kort sekund för att sedan vara helt borta. Jag blir trött.
    Vad gör jag för fel?

    ReplyDelete
  14. Tack, tack och tack! Jag fixade det till slut. Jag utgick först från mallen som redan hade en kolumn till höger. Detta slutade med att jag hade två kolumner till vänster. Jag fick börja om med den mall som hade kolumnen till höger från början och då gick det bättre...

    ReplyDelete
  15. Sedan jag försökte följa era instruktioner att lägga till en tredje kolumn har jag problem med att alla gadgets har ramlat över på vänstra sidan i min layoutbild, och de fem översta ser jag inte alls (kan alltså inte redigera dem, eller lägga till en ny). I verkligheten ligger alla gadgets på högersidan på bloggen och någon vänsterkolumn finns inte.
    Jag mailade en skärmdump och bad om hjälp till amas_1@hotmail.com den 26 september men har inte fått svar - är det någon annan mailadress jag ska skicka till? Jag behöver verkligen hjälp! (och allt funkade tills jag försökte följa den här instruktionen...)
    /Helen

    ReplyDelete
  16. Hej, nej ditt mail kom inte fram? Måste ha blivit något tokigt på vägen. Kan du prova igen och skicka med din inloggningsadress och ett tillfälligt lösenord ( det skaffar du via Anpassa, Mitt konto i navbaren ) så ska jag logga in och se vad som blivit tokigt och se om jag kan rätta till det. Ibland är det bara någon liten miss i koden, ett par tecken på fel plats, som ställer till det, ibland är det ngt sidelement som påverkar. Men, det här fixar vi!

    ReplyDelete
  17. Jag gjorde om allt - voila fungerade det utmärkt! Tack!

    ReplyDelete
  18. Jättebra! Visst blir man glad när det funkar! :-)

    ReplyDelete
  19. Om vi börjar med den sista frågan.
    Kolumner ligger ju från vänster till höger. Man börjar läsa från vänster, precis som man börjar läsa en text uppifrån. För att bloggen ska kunna läsa i vilken ordning kolumnerna ska komma läser den "högst upp i kodmallen = längst till vänster" "2'a i kodmallen = i mitten" (vid tre kolumner)och "sist i kodmallen = längst till höger" Så enkelt är det :-)

    Ang din bakgrund från blogcrowds vet jag inte, jag får nog kika på din bloggs källkod. Jag lämnar en kommentar på din blogg - lättast så. (om du länkat till bloggen, jag har inte kollat ännu)

    mvh Anneli

    ReplyDelete
  20. Hej!

    Precis den information jag letade efter.
    Tror att jag följde dina instruktioner, men när jag skall in och ordna sidelementen ser det ut så här
    http://www.xtraining.se/dokument/blogg/sidelement.jpg

    Igår fick jag problem med att min högra meny ramlade ner under alla inlägg så nu med den 3:e kolumnen så är den inte överdrivet snygg.
    http://mattiasogren.blogspot.com/

    Vad kan jag ha gjort för fel med kolumnerna och vad kan ha hänt med den högra menyn?

    ReplyDelete
  21. Hej igen

    nu ger jag upp jag får inte till det, först när jag ska ändra på följande:
    Scrolla ner till Sidebar-Wrapper
    Här lägger du till koden:
    margin: 0px 10px 0px 5px;

    så sparas (koden som jag ska ändra) det inte...?och jag vet inte om det är det som gör att det inte händer något

    Min blogg som jag fösöker testa med är

    http://livetsljuvastunder.blogspot.com/

    Lisa

    ReplyDelete
  22. Himmel, vilken underbar sida! Du verkar ju helt otroligt duktig! Precis den här informationen jag behöver. Ska ta mod till mig och prova att få till tre kolumner. Hoppas, hoppas...
    Hälsningar, Charlotta
    http://cesarstradgard.blogspot.com

    ReplyDelete
  23. Vilken bra sida för en som har inte är så bra på detta. Men kan man bara få 3 kolummner på minimas? Jag har inte den och vill hemskt gärna ha en höger kolumn som jag kan lägga upp div gadgets.

    hälsningar
    Cecilia

    ReplyDelete
  24. C - det går bra i alla bloggmallar, men man kan behöva anpassa koderna och måtten efter den mall man har. Det som gäller är att testa, testa och testa...
    Förhandsgranska hela tiden så har du koll på vad du gör och kan rensa din redigering om det blir tokigt. Jo, och spar en kopia av mallen innan du börjar! Viktigt!

    ReplyDelete
  25. Hej!
    Jag har med din hjälp fixat så att jag har tre kolumner. Men så la jag in ett bildpel med hjälp av photobucket(också ditt tips). Jag ville ta bort deras länk och det såg bra ut i förhandsgranskningen. Kruxet är att jag inte såg hela bloggen. Då upptäckte jag att min högra sidebar lagt sig under mainwrappern.Footerwrappern är kapad till hälften.Nu har jag alltså två kolumner igen.
    Vad har hänt?

    ReplyDelete
  26. Det funkade bra för mig. Men skulle vilja ha rounders mallen? Funkar de här instruktionerna även på den?

    ReplyDelete
  27. Hej! Måste säga att detta nog är den bästa sida jag hittat! Tusen tack för alla tips! Jag har en liten undran. Jag har lagt till ett flertal "undersidor" till bloggen. På dessa har jag lyckats dölja gadgetar som bara skall synas på första sidan. Men man kan ju änndå inte utnyttja hela bredden på de övriga sidorna. Går detta problem att komma åt? Vet inte om jag förklarade underlit men men =)

    ReplyDelete
  28. Åh, vilken fantastisk sida du har! Har redan lyckats fixa till lite grejer i min blogg, jättelätt med din hjälp! TACK för att du gör den här hjälpbloggen! =)

    ReplyDelete
  29. Hej!

    Efter att jag har gjort ändringen, så blir kolumnen inte vit, utan är i min bakgrundsfärg, vad har jag gjort för fel?

    Mvh
    Caroline

    ReplyDelete
  30. Löste problemet själv med att klistra in background-color:#ffffff;
    :)

    ReplyDelete
  31. Fungerade alldeles utmärkt!
    Tack!!

    ReplyDelete
  32. Gick jättebra... Tack.... vill gärna veta hur jag ändrar på rubrikens bild... den bildjag lägger in är för stor.....

    ReplyDelete
  33. Det gick bra att lägga till tre kolumner. Men min header flyttades till vänster. Hur får jag den centrerad igen?
    /Stina

    ReplyDelete
  34. Bilden blev centrerad då jag la in en ny bild som header. Men problemet är nu att headern blir så stor, nästan fyrkantig efter att jag dit tre kolumner. Vill ha den mer långsmal. /Stina

    ReplyDelete
  35. Superlätt och pedagogiskt.
    Du är min idol. TACK:)

    ReplyDelete
  36. Superbra beskrivning! Har tvekat länge om jag fixar det men med dina instruktioner gick det superbra! Ändrade till och med själv lite på bredder mm! *impad*

    ReplyDelete
  37. Hej!

    jag vill lägga till en spalt på högersida så jag kan lägga in mina intragrambilder, facebok, och annat på sidan.Jag bloggar på blogg.se hur gör jag då?

    ReplyDelete

-------------------------------
Lämna gärna en hälsning! Har du en bloggfråga är du välkommen att ställa den på vårt forum. På så vis kan fler svara alternativt få hjälp om de har samma problem. Tack!
Du hittar en länk till forumet högst upp till vänster här på Fixabloggen.
-------------------------------