• Forside
  • TheHibi
  • Design
  • Bestille design
  • Spørsmål



  • Html-hjelp
  • Kontakt
  • Forside
  • Forside
  • BlogLovin'
  • Skille blogg og sidemeny - kort sidemeny


    Siden det er så mange som lurer på hvordan man skiller blogg og sidemeny, og kun får sidemenyen så lang som innholdet lager den, så kan jeg likegodt skrive det i et eget innlegg. Det er ikke så vanskelig bare man har hodet med seg.

    Jeg vil anbefale dere å gjøre det på denne måten jeg nå vil vise for å få en heldekkende bakgrunn med ei kolonne for blogginnlegg og ei kolonne for sidemenyen.

    Vi finner frem til stilsettet ditt.



    Hvis du har en bakgrunn på hele siden på bloggen din, er det denne som vil vises når vi er ferdige med denne guiden. I avsnittet #wrapper har du sikkert en bakgrunn eller bakgrunnsbilde som er hele årsaken til at selv om du har lagt inn kodene under, blir ikke bloggkolonnen og sidemenykolonnen separert. Dette vil jeg at du skal fjerne, slik at det ikke finnes en linje som ser slik ut:

    background-image: url(' DITT BILDES URL ');

    Den andre linjen vi skal endre er skal etter endring se slik ut:

    background-color: #transparent;

    Forhåndsviser du nå, vil alt utenom headeren ha samme farge eller bakgrunnsbilde. Hvis du ikke har følgende avsnitt, legger du til alt under. Dersom du har følgende avsnitt, men ikke linjene som her er nevnt, lim inn det du ikke har.
    Slik skal det være når vi er ferdige, og bakgrunnen i feltene blir hvit. Disse fargene kan endres. Fargekoder finner du her.

    #main {
    background-color: #ffffff;
    width: 75%;
    }
    #side {
    background-color: #ffffff;
    width: 20%;
    }


    Jeg synes også det er pent med en ramme med en litt mørkere, men nøytral farge, rundt kolonnene, dette får du med å legge inn denne koden i begge avsnittene: border: 2px solid #cdcdcd;
    Tallet foran px kan endres til ønsket bredde på rammen.

    Ferdig resultat i stilsettet blir da slik:




    Hele bloggens bakgrunn endrer du i avsnittet body, så har du et bakgrunnsbilde bak spaltene til bloggen og sidemenyen, endrer du den i linjen

    #background-image: url('DITT BILDES URL');

    Har du en bakgrunnsfarge, endrer du fargen i linjen

    #background-color: #Fargekode;

    Fargekoden består av seks siffer eller bokstaver, f.eks. hvit har fargekode #ffffff .

     

     

    Som vanlig setter jeg pris på at jeg ikke finner mine guider kopiert inn på andres blogger!


    49 kommentarer

    Hei! Beklager at dette ikke er relatert til det du skriver om, men jeg har fått en utfordring på bloggen min som jeg gjerne vil gi videre til deg. Den går ut på å skrive 10 ting du vil gjøre før du dør:) Håper selvfølgelig at du tar utfordringen, og gi meg gjerne beskjed om du gjør det. Så kommer jeg og ser på innlegget ditt:D

    ♥ mSandjord

    16.02.2010 | kl.22:21 | URL: http://msandjord.blogg.no

    Hei! Utrolig bra guide. Jeg lurte bare på hvordan du får bakgrunn mellom innleggene også? Fint om du kunne svart på min blogg :)
    Flink du er. Men noe jeg stusset over var det at jeg ikke fikk til det etter #transparent tingen. Jeg fikk til å få alt i samme farge, men ikke med den lengre koden og slikt. Navnet over headeren kom tilbake, og det ble andre skriftfarger og styr på bloggen. Hvor skulle jeg lime den hen, under det andre? Eller nederst i stilsettet? Sliter litt som vanlig :)

    Åse Marit

    31.03.2010 | kl.15:17 | URL:

    funket utrolig bra, takk :)!

    QUIZZA

    05.05.2010 | kl.17:13 | URL: http://quizza.blogg.no/

    sorry, men dette hjalp meg ikke så veldig mye :(

    Chichi

    16.05.2010 | kl.16:01 | URL:

    Hei, jeg lurte på om du kunne skrive et nytt innlegg der du viser hvordan man kan få meny i sidebaren slik som du har? :)
    Chichi: Godt mulig det kommer et slikt innlegg :)

    Therese

    12.06.2010 | kl.22:33 | URL: http://theresefredrikseen.blogg.no

    Tusen tusen takk, hjalp UTROLIG mye! :) Kjempegod beskrivelse, aldri fått det til før nå! Kan ikke si noe annet enn : takk!

    Benedicte

    07.07.2010 | kl.09:31 | URL: http://benedictesb.blogg.no

    Hei!

    Jeg gjorde akkuratt dette, men bare profilbilde og info om meg i sidemenyen kom i egen kolonne. Jeg vil også ha "arkiv", "kategori" og "kommentarer" i egen kolonne. What to do?

    hehe, jeg blir GAL av html koder!

    Charlotte Olsen

    15.07.2010 | kl.13:28 | URL: http://lammarau.blogg.no

    Jeg får ikke dette til, hva gjør jeg feil ? kan du sende meg en mail ? olsen-charlotte@hotmail.com

    Vil så gjerne ha mellomrom

    kinetrangsruds

    06.08.2010 | kl.12:29 | URL: http://kinetrangsruds.blogg.no

    fikk ikke dette til :( da jeg gjorde det, kom det ingen hvit bakgrunn bak innleggene. Hva har jeg gjort feil da?

    kinetrangsruds

    06.08.2010 | kl.15:16 | URL: http://kinetrangsruds.blogg.no

    sv; ja, har gjort akkurat slik som du beskrev.. Men du, en ting til. Kanksje du vet. Jeg gir snart opp hele bloggen.. Da jeg trykker inn på et innlegg på bloggen min (trykker på overskriften), slik at jeg kommer inn dit jeg kan kommentere er alt helt ute av kontroll. Det er ikke noen hvit bakgrunn bak innleggene mine, og den er mye bredere enn den skal være.. skjønner du hva jeg mener? :/

    siars-silje

    30.08.2010 | kl.12:28 | URL:

    Hvordan får man sånnen kul overskrift ? :) DIGGER bloggen din ! :)
    siars: Slik som min overskrift? Du legger på skygge på teksten :) Kommer nok en guid på det etter hvert, men det fungerer ikke i alle nettlesere..

    Eline :-)

    09.10.2010 | kl.14:10 | URL: http://ejansen.blogg.no

    Hei! jeg får ikke dette til å funke :( alle kodene jeg har prøvd får å få mellomrom mellom bloggen og sidemenyen får jeg ikke til å funke. Vet du hva som kan være feil?

    Veldig bra design-hjelp!

    Eline :-)

    09.10.2010 | kl.16:53 | URL: http://ejansen.blogg.no

    sv: takk, det funket!!

    MALINSPOT

    10.10.2010 | kl.21:25 | URL: http://www.malinspot.blogg.no

    Det er noe jeg ikke skjønner når jeg gjør dette. Med engang jeg legger inn #main og #side kodene står plutselig #headerutenfor #wrapper på venstre side.. Vet ikke helt hva jeg skal gjøre for å få det rett ovenfor hverandre. Hvis du ikke skjønner hva jeg mener kan du gå inn på bloggen min å se. På forhånd takk! :-)

    hanneeluneborg

    02.11.2010 | kl.20:41 | URL: http://hanneeluneborg.blogg.no

    hei! jeg får ikke til å endre bakgrunns farge uansett hva jeg gjør. vet du hva som kan være galt? lyst til å hjelpe meg? blir gal:-(

    heeeerborg

    04.11.2010 | kl.14:46 | URL: http://heeeerborg.blogg.no

    vær så snill å hjelp meg med en liten ting: jeg bruker nå denne koden, men overskriften på innlegget(den er ikke midtstilt) kommer helt ut i bakgrunnen. altså, det pleier å være et lite mellomrom(ca. 10px;) mellom bakgrunn og overskrift. gå innpå bloggen min å ta en liten titt!

    Merethe

    27.11.2010 | kl.15:43 | URL: http://www.mjbk.blogg.no

    Takk for en kjempefin guide!
    ååå du gjør det så enkelt! :-) de andre som har lagt ut, har gjort det så vansklig!
    De var kjempe bra forklart , men eg sjønnte ikkje helt for når eg tok vekk image så for jo headeren vekk, og eg prøvde mange andre måta men eg fekk de ikkje til, kunne fu ha hjelpt oss litt ? :-D svar på bloggen vår :D

    guromaurud

    26.01.2011 | kl.18:53 | URL: http://guromaurud.blogg.no

    jeeeeg har prøvd, men hvis du ser på designet mitt blir det helt mongo : ((( har du lyst til å hjelpe meg? FINT OM DU SVARER FORT, vil prøve å få det i boks. ser helt fælt ut nå : (

    Maria C

    30.01.2011 | kl.19:17 | URL: http://mocosondro.blogg.no

    Hvordan skal jeg få skille blogg og sidemeny vist sidemenyen min er på venstre side??

    jlun

    05.02.2011 | kl.16:59 | URL: http://www.jlun.blogg.no

    KAN DU HJELPE MEG MED Å FÅ SKILLEN LENGRE NED?

    Tuva Amalie

    23.02.2011 | kl.15:09 | URL:

    TusenTusenTusenTusenTusen Takk!♥

    Dette var til STOR hjelp! : )

    Anna Josefine <3

    25.02.2011 | kl.12:10 | URL: http://annajosefine.blogg.no

    Tusen tusen tusen takk:D Dette satt jeg veldig pris på!!!!!!!!! :D

    Erika

    05.04.2011 | kl.14:16 | URL: http://comiat.blogg.no

    Jeg trenger litt hjelp her jeg.. designtester1.blogg.no

    sing cute for me

    04.05.2011 | kl.17:52 | URL: http://singcuteforme.blogg.no

    Heei, dette funka ikke for meg, og jeg har klart det før men nå fikk jeg det ikke til D:

    Kan du forklare det til meg eller no ? på bloggen min ?

    www.singcuteforme.blogg.no

    Karen

    20.06.2011 | kl.23:43 | URL: http://karenmb.blogg.no

    Hmm, når jeg prøver på dette, blir headeren bare skeiv i forhold til resten av bloggen.. :/

    ninaworld

    26.06.2011 | kl.21:52 | URL: http://ninaworld.blogg.no

    Hvordan endrer jeg mellomrommet da ? : )

    svarer du på min blogg ? :)

    blackstripes

    27.06.2011 | kl.02:18 | URL: http://blackstripes.blogg.no

    Jeg får det ikke til, skal ha et bakgrunnsbilde, men det blir bare feil når jeg gjør det, vet ikke hva det er jeg gjør feil?

    blackstripes

    27.06.2011 | kl.03:20 | URL: http://blackstripes.blogg.no

    okei jeg fikk det til, men teksten i innleggene mine er liksom helt inntil kanten. Hvis det gir mening? skjønner ikke hvorfor det har skjedd?

    Stberg - ♥

    25.07.2011 | kl.21:53 | URL: http://stberg.blogg.no

    Hvordan får man til runde kanter rundt de ''boksene''? ; -)

    »Renate

    04.08.2011 | kl.15:28 | URL: http://htmw.blogg.no

    Bra! :D

    Men hvordan får jeg den helt ut til sidene?

    Renate N D ♥

    05.08.2011 | kl.12:12 | URL: http://htmw.blogg.no

    Tusen takk, men hvis du ser på bloggen min så er ikke kategoriene med i sidemenyen der. Kan du hjelpe meg litt? Kontakt meg gjerne på renate.nd@hotmail.com :)

    Ingvild Elise

    10.08.2011 | kl.14:40 | URL: http://ingvildsvidal.blogg.no/

    Hei! Jeg brukte denne metoden nå, og fikk til å skille sidebaren fra selve bloggen. Men, hvis du ser på bloggen min nå, så er bildene og skriften i innleggene mine helt inni kanten, og det så ikke så fint ut, pluss at det blir uoversiktelig å litt ekkelt å lese rett å slett. Vet du hvordan jeg kan ordne dette slik at det blir litt mellomrom igjen? fint om du svarer på min blogg, slk at jeg slipper lete gjennom mange kommentarer her å se om du har svart:) takk på forhånd!

    Siri Josephin

    12.08.2011 | kl.23:50 | URL: http://sirijosephin.blogg.no

    Tusen takk!

    Ane

    21.08.2011 | kl.17:53 | URL: http://alas.blogg.no

    Hei! :D

    Lurte på om du vet om en kode som kan gjøre bloggen bredere, uten å ødelegge sidemenyen? :) Har fått til å lage sidemenyen, men som sagt, vil gjerne ha bloggen bredere! Utrolig bra designhjelp på bloggen din!

    Charlotte Amalie Andersen

    01.10.2011 | kl.11:58 | URL: http://viff.blogg.no

    Hei, dette funket ikke for meg. Når jeg tar sånn transperment eller hva det het, så ble hele bloggen en farge, som det sto det skulle bli. Resten av guiden forstår jeg faktisk ikke. Du sier ikke tydelignok HVA det er jeg må gjøre, så faller litt ut. Kan du være så snill og sende meg en mail hvor du forklarer litt lettere? Takk for svar, du er forresten utrolig flink!

    Charlotte Amalie

    01.10.2011 | kl.14:00 | URL: http://viff.blogg.no

    Nå klarte jeg det! SUpert. takk! Men har forsatt litt jeg må prøve å få bedre <3

    PizzaQueen

    01.12.2011 | kl.22:55 | URL:

    Tuuuusen takk!<3

    Hedda<3

    31.12.2011 | kl.19:03 | URL: http://janarihed.blogg.no

    Hei, Dette er en av de FÅ bloggene som har såååå bra guider som du! Jeg tror at dette er den beste guiden jeg har prøvd! Jeg har prøvd å få til dette mange ganger men guidene jeg har fulgt da er ikke forståelig!
    Heihei! Jeg fulgte guiden og fikk til å skille sidemenyen fra innholdet. Men problemet mitt er at headeren er den bredden jeg vil at bloggen skal være, mens sidemenyen og innholdet ikke er like bredt. Tror headeren er 1000px bred. Jeg har prøvd å endre der det står "75%" men det skjer ingenting, har endret den helt til 1000 men ingenting skjer. Har lest igjennom om du har forklart det noe sted, men har ikke funnet noe. Tror du at du kunne forklart meg hva jeg må endre på for å få innholdet og sidemenyen til å stå like bredt som headeren. Innholdet ble også litt "trangt" sånn at det ser ut som om bokstavene starter akkurat der bakgrunnen på inholdet starter. Du kan enten kontakte meg på mail, Irinaa_@live.com eller på selve bloggen. Håper du kan hjelpe meg! :)

    Lynn Kristin ♥

    17.02.2012 | kl.21:38 | URL: http://lucky3.blogg.no

    JEG SKJØNTE INGENTING!!! Kan du ikke forklare litt bedre angående det??????!!!!
    HEI!

    Jeg gjorde akkuratt som du sa, men headeren min forsvant! Hvordan får jeg den tilbake?

    -Hannah
    Hannah, Mostly Just Me: Skjønner ikke helt hvordan du har fått det til.. Men ser ut som den er tilbake nå ;) Minner om at det ikke går å kommentere på bloggen din..

    SelineCarine

    28.03.2012 | kl.15:13 | URL:

    Jeg skjønner ikke får ikke til kort sidemeny. Kan du værsåsnill lage ett nytt innlegg som er litt enklere å forstå? :-)

    Emma

    16.06.2013 | kl.10:39 | URL: http://emmasthing.blogg.no

    blir det på sidebaren under profilen da??

    Skriv en ny kommentar


    - Skal du spørre om noe angående noe i en guid, ta gjerne en titt på Spørsmålssiden min først! Er spørsmålet du skal stille spurt mange ganger før, finner du nok svaret der :)


    Interiørblogger
      Blogger du om interiør eller smarte tips og triks i hjemmet? Da har du muligheten til å bli linket til herfra! Skriv en liten hilsen her og du er med i vurderingen!
    INFO

    TheHibi


      Her på bloggen utfolder jeg meg kreativt i håp om å bli en bedre designer, fotograf, tekstforfatter og Photoshop-bruker. Jeg har rukket å bli nesten 21 år gammel, og studerer for tiden eiendomsmegling. Bloggingen har en tendens til å skje litt i rykk og napp, so stay tuned -

      Merk deg at jeg driver denne bloggen med det prinsippet at jeg skal være en hjelp til selvhjelp. Les gjerne guiden flere ganger før du spør, det er vanskelig for meg å svare alle personlig, som får den konsekvensen at det ikke kommer nye guider.

    TheHibi på bloglovin

    Blogglisten
    OBS!
      Kommentarer du vil ha svar på av meg, bør kommenteres her på min blogg. Jeg har ikke kapasitet til å jakte rundt etter kommentarer som er til meg, på andre blogger. Beklager
    Arkiv
    hits