Jak stworzyć stały pasek boczny w Tumblr

Krok po kroku – stały pasek boczny w Tumblr

Chcesz, aby Twój pasek boczny nie przesuwał się podczas przewijania strony? Wystarczy dodać kilka linii CSS do szablonu. Poniżej znajdziesz szczegółowy przewodnik.

1. Otwórz edytor HTML

Zaloguj się do panelu Tumblr, kliknij ikonę ustawień i wybierz nazwę bloga, który chcesz edytować (lub po prostu kliknij nazwę, jeśli masz tylko jeden blog).

Następnie wybierz „Customize”, a potem „Edit HTML”. Zobaczysz kod HTML swojego szablonu.

2. Zrób kopię zapasową

Wciśnij Ctrl+A, a potem Ctrl+C, aby zaznaczyć i skopiować cały kod. Otwórz Notatnik (lub inny edytor tekstu) i wklej go Ctrl+V. Dzięki temu będziesz mieć pewność, że w razie pomyłki łatwo przywrócisz pierwotną wersję.

3. Znajdź sekcję paska bocznego

W edytorze HTML naciśnij Ctrl+F i wpisz sidebar. Przeglądarka przeniesie Cię do pierwszego wystąpienia tego słowa. Powinna wyglądać mniej więcej tak:

#wrapper #sidebar { /* istniejące style */ }

Bezpośrednio pod pierwszą linią wstaw poniższy kod:

position: fixed;
right: 100px;

Właściwość position: fixed sprawia, że pasek pozostaje w miejscu, a right: 100px określa odległość jego prawej krawędzi od prawego marginesu okna przeglądarki.

4. Sprawdź i zapisz zmiany

Kliknij „Update Preview”, przewiń stronę w podglądzie – pasek nie powinien się ruszać. Jeśli wszystko działa, naciśnij „Save”.

Wskazówki

Możesz eksperymentować z wartością right. Zmiana z 100px na 50px przesunie pasek o 50 px bliżej prawego brzegu ekranu.

Ostrzeżenia

Edytując HTML zachowaj ostrożność – niewłaściwa zmiana może zepsuć układ strony. Jeśli coś pójdzie nie tak, usuń cały kod w edytorze i wklej wcześniej skopiowaną wersję zapasową.