Kako stvoriti fiksnu bočnu traku na Tumblr

Ako ste ikad pomaknuli web stranicu i stavka se na njoj nije pomaknula, svjedočili ste CSS oznaci položaja u akciji. Blogeri Tumblr koji dodaju ovu oznaku na svoje predloške mogu stvoriti isti efekt na svojim blogovima. Dobro mjesto za isprobavanje nalazi se na bočnoj traci. Nakon što dodate oznaku položaja u HTML kôd bloga, bočna traka ostaje fiksna kada se ljudi kreću prema gore i dolje po stranicama vašeg bloga.

Posjetite svoju nadzornu ploču Tumblr, a zatim kliknite ikonu postavki i naziv bloga koji želite ažurirati. Ako imate samo jedan blog, kliknite njegovo ime.

Kliknite "Prilagodi", a zatim "Dodani HTML". Tumblr otvara vašu temu i prikazuje njezin HTML kôd.

Kliknite bilo gdje unutar koda i pritisnite "Ctrl-A", a zatim "Ctrl-C" da biste kopirali kôd u međuspremnik sustava Windows. Otvorite novi Notepad dokument i zalijepite ga u dokument. Ovi koraci osiguravaju da imate sigurnosnu kopiju izvornog predloška.

Vratite se na Tumblr HTML kôd i pritisnite "Ctrl-F" da biste otvorili okvir za pretraživanje. Unesite "bočna traka" u taj okvir za pretraživanje, a zatim pritisnite "Enter". Tumblr pronalazi prvu pojavu "bočne trake" i prikazuje odjeljak koda koji sadrži tu riječ. Kôd koji pronađe trebao bi izgledati slično sljedećem:

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

Prvi redak koda sadrži riječi #wrapper #sidebar. Lijeva zagrada slijedi te riječi.

Zalijepite sljedeći kod odmah ispod prvog retka koda:

položaj: fiksno; desno: 100 piksela;

Atribut position upućuje preglednike da poprave bočnu traku tako da se ne pomiče prilikom pomicanja. Desni atribut govori preglednicima koliko piksela želite da desni rub bočne trake sjedi s desne margine web stranice. U ovom primjeru pravi atribut ima vrijednost 100px.

Kliknite "Ažuriraj pregled" da biste pogledali pregled promjena. Povucite klizač prozora gore-dolje i vidjet ćete da se vaša bočna traka ne pomiče. Kliknite "Spremi" da biste spremili promjene.

Savjeti

Možda ćete htjeti eksperimentirati s različitim vrijednostima za pravi atribut ako želite prilagoditi vodoravni položaj bočne trake. Na primjer, ako vrijednost promijenite sa 100 na 50, bočna traka pomiče se udesno za 50 piksela.

Upozorenja

Budite oprezni kada radite u HTML uređivaču, jer slučajna promjena postojećeg koda može imati dramatične učinke na izgled vaše stranice. Ako promijenite kôd i ne možete otkriti kako poništiti promjene, uvijek možete izbrisati sve u HTML uređivaču i zalijepiti sigurnosni kod koji ste kopirali u uređivač da biste ga vratili u prvobitno stanje.