Header Ads

Scrollbar för långa sidelement

Ibland har man många länkar i ett sidelement eller en lång text och det tar upp mycket plats.
Då kan en scrollbar vara lösningen, ett sätt att visa all text/alla länkar på ett enkelt sätt.
Men, hur gör man en sån?

Det första du ska göra är att ta reda på vad ditt sidelement har för id - vad det heter. Varje sidelement i din blogg har ett eget namn så att du ska kunna ändra dess egenskaper utan att de övriga förändras.



Gå in på din bloggs Layout - Redigera HTML. Scrolla långt ner i mallen, ända tills du kommer till


<div id='sidebar-wrapper'>
.
Du kan också söka efter rätt plats i kodmallen genom att trycka på Ctrl+F och skriva in detta kodstycke i sökrutan.


Om du bara har ett sidelement av den sort du vill göra en scrollbar till (t.ex. text eller linklist)är det lätt att hitta rätt id, men hur gör du om du har fler av samma sort?

Om två eller fler sidelement har samma namn väljer du det första, nr 1, och byter ut ordet false mot true enligt bild nedan. Spar mallen!

Gå till bloggens Layout-sida och titta på sidelementen i din sidebar. Ett av dem är nu låst, det går inte att flytta och ser plattare ut än de andra. Det är det sidelement du skrev true på. Om det är rätt element vet du att du har hittat rätt id och du kan gå tillbaka till Redigera HTML och ändra tillbaka true till false igen.

Om det är fel sidelement och du har fler att välja på gör du om proceduren med nästa rad på listan i HTML-koden.

Avsluta alltid med att se till att alla sidelement du ändrat på åter har locked-false i sin text, annars kommer du inte att kunna flytta på det till en annan plats i sidebaren!


Nu när du vet vilket id ditt sidelement har kopierar du följande kod:

/* Sidebar Content */
#Text1{
height:200px;
overflow:auto;
}

Klistra in den under sidebar wrapper enligt nedanstående bild.

Byt ut Text1 mot det namn/id ditt sidelement hade, t.ex linklist1 eller html2 eller vad det kan vara. (om det hette text1 låter du förstås koden vara som den är)

Var noga så att du inte raderar några andra tecken runtomkring.

Förhandsgranska din blogg!
Spara.

Obs:
Du kan ändra höjden på din scrollbox genom att öka eller minska pixeltalet i koden du lade in.

9 comments:

  1. ååå jag blir så glad varje gång jag lyckas med nånting med hjälp av dina beskrivningar =) men ju mer jag testar ju rörigare blir bloggen =) men jag har lärt mig massor. Snart kan jag ju börja om o göra en seriös blogg =) Tack för all hjälp du har här.. Den här sidan är mitt BÄSTA googel nånsin =)

    ReplyDelete
  2. Vad kul att du gillar den! Om du undrar hur man gör något så fråga - det kanske blir en ny tutorial! ;-)

    ReplyDelete
  3. =) Ja, jag skulle behöva hjälp med hur man får sin profilruta att ligga under bilden i headern eller vad det nu hette =) och inte i sidebaren. Jag har det så på min blogg, fick till det så på min dotters, men jag vet inte hur det gick till, plötsligt var det bara så =) men nu får jag inte till det på en annan blogg.. jag blir GALEN =)

    ReplyDelete
  4. Vill du ha den i samma storlek som din mainbar (där du skriver blogginläggen)och ovanför den eller lika stor som headern och under den?

    Jag frågar för att du kan dra din profilgadget till en ny gadget ovanför mainbar, men på de flesta bloggmallar måste man in i kodmallen och ändra lite för att kunna lägga till fler gadgetar i headerns kolumn. Det är inskrivet att det bara ska vara en gadget där, men det kan man ändra.

    Du ska leta efter det här stycket, nästan allra längst ner i kodmallen:

    div id='header-wrapper'

    Byt ut maxwidgets='1' till '2' eller fler om du vill ha det. Ändra sen showaddelement från 'no' till 'yes'

    Spara mallen. Nu kan du lägga till gadgets under headern. :-)

    ReplyDelete
  5. ja under headern o lika stor som den. det andra med mainbaren har jag förstått av din underbara blogg =) Jag får pröva det här då, men jag tycker det är knepigt att det blev så på två bloggar utan att jag varit i kodmallen o ändrat nåt? beror det på vilken mall man har då? jag tycker att vi tagit samma mall på alla bloggar. men jag ska in i kodmallen o rota lite nu då =) tack så mycket för savaret..

    ReplyDelete
  6. nä, jag får inte till det. om man gör så så hamnar ju allt i samma ruta som bilden, =( jag vill ha det under.. o så att man kan lägga till flera "rutor" gadgetar, undan för undan. med vad som helst.. jag var aldrig i kodmallen o ändrade förut o ändå blev det så =) men HUR??!! jag blir GALEN:!!

    ReplyDelete
  7. tror jag löst det nu =) la till ett litet yes under content-wrapper. tänk så enkelt det kunde va =) men nåt yes står det inte i min mall inte men funkar så ändå. vetifan hur det gått till där =).. ha det..

    ReplyDelete
  8. Hejsan! Toppen bra sida. Den har man nytta av. Undrar hur får man en sidebar på sina inlägg det kanske framgår här eller så funkar det inte att ha det på inläggen. /Petra

    ReplyDelete
  9. Hej har hittat ett annat sätt att lägga in en kod för rullist i sidoelementet som göra att man slipper gå in i huvud html koden.

    Funkar bra på en av mina bloggar.

    Här är en länk till var jag hittade den.

    http://www.anshuldudeja.com/2008/10/scroll-bar-widget-for-blogger.html

    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.
-------------------------------