Sådan oprettes et fast sidebjælke på Tumblr

Hvis du nogensinde har rullet ned på en webside, og et element på den ikke bevæger sig, har du været vidne til CSS-positionskoden i aktion. Tumblr-bloggere, der føjer dette tag til deres skabeloner, kan skabe den samme effekt i deres blogs. Et godt sted at prøve dette er på dit sidebjælke. Når du har tilføjet et positionskode til din blogs HTML-kode, forbliver dit sidebjælke fast, når folk ruller op og ned på dine blogsider.

Besøg dit Tumblr-dashboard, og klik derefter på indstillingsikonet og navnet på den blog, du vil opdatere. Hvis du kun har en blog, skal du klikke på dens navn.

Klik på "Tilpas" efterfulgt af "Tilføjet HTML." Tumblr åbner dit tema og viser dets HTML-kode.

Klik et vilkårligt sted inde i koden, og tryk på "Ctrl-A" efterfulgt af "Ctrl-C" for at kopiere koden til Windows udklipsholder. Åbn et nyt Notesblok-dokument, og indsæt koden i dokumentet. Disse trin sikrer, at du har en sikkerhedskopi af din originale skabelon.

Gå tilbage til Tumblr HTML-koden, og tryk på "Ctrl-F" for at åbne et søgefelt. Skriv "sidebjælke" i det søgefelt, og tryk derefter på "Enter". Tumblr finder den første forekomst af "sidebjælke" og viser det afsnit af kode, der indeholder dette ord. Koden, den finder, skal ligne følgende:

wrapper #sidebar {color: {color: Background}; }

Den første kodelinje indeholder ordene #wrapper #sidebar. En venstre parentes følger disse ord.

Indsæt følgende kode umiddelbart under den første linje med kode:

position: fast; højre: 100px;

Positionsattributten instruerer browsere i at rette sidebjælken, så den ikke bevæger sig, når du ruller. Den rigtige attribut fortæller browsere, hvor mange pixels du gerne vil have sidebjælkens højre kant fra websidens højre margen. I dette eksempel har den rigtige attribut en værdi på 100 pixel.

Klik på "Opdater forhåndsvisning" for at se en forhåndsvisning af dine ændringer. Træk vinduesrullebjælken op og ned, så ser du, at din sidepanel ikke bevæger sig. Klik på "Gem" for at gemme dine ændringer.

Tips

Det kan være en god idé at eksperimentere med forskellige værdier for den rigtige attribut, hvis du vil justere sidebjælkens vandrette position. For eksempel, hvis du ændrer værdien fra 100 pixel til 50 pixel, bevæger sidelinjen 50 pixels længere mod højre.

Advarsler

Vær forsigtig, når du arbejder i HTML-editoren, da det ved en fejltagelse at ændre eksisterende kode kan have dramatiske effekter på layoutet af din side. Hvis du ændrer koden, og du ikke kan finde ud af, hvordan du fortryder dine ændringer, kan du altid slette alt i HTML-editoren og indsætte den sikkerhedskopikode, du kopierede, i editoren for at gendanne den til sin oprindelige tilstand.