Ako vytvoriť pevný postranný panel na Tumblr

Ak ste sa niekedy pohybovali po webovej stránke nadol a položka na nej sa nepohybovala, ste v akcii svedkami pozičnej značky CSS. Tumblroví blogeri, ktorí pridajú túto značku do svojich šablón, môžu vo svojich blogoch vytvoriť rovnaký efekt. Dobré miesto na vyskúšanie je na vašom bočnom paneli. Po pridaní značky polohy do kódu HTML blogu zostane váš bočný panel pevný, keď ľudia posúvajú vaše stránky blogu nahor a nadol.

Navštívte informačný panel Tumblr a potom kliknite na ikonu nastavení a názov blogu, ktorý “ chcem aktualizovať. Ak máte iba jeden blog, kliknite na jeho názov.

Kliknite na položku Prispôsobiť a potom na položku Pridaný HTML. Tumblr otvorí vašu tému a zobrazí jej HTML kód.

Kliknite kamkoľvek do kódu a stlačte "Ctrl-A" nasledované "Ctrl-C" pre skopírovanie kódu do schránky Windows. Otvorte nový dokument programu Poznámkový blok a vložte kód do dokumentu. Tieto kroky zabezpečia, aby ste mali záložnú kópiu svojej pôvodnej šablóny.

Vráťte sa do HTML kódu Tumblr a stlačením klávesu „Ctrl-F“ otvorte vyhľadávacie pole. Do tohto vyhľadávacieho poľa napíšte „sidebar“ a stlačte „Enter“. Tumblr nájde prvý výskyt „sidebar“ a zobrazí časť kódu, ktorá obsahuje dané slovo. Kód, ktorý nájde, by mal vyzerať podobne ako nasledujúci:

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

Prvý riadok kódu obsahuje slová #wrapper #sidebar. Za týmito slovami nasleduje ľavá zátvorka.

Vložte nasledujúci kód bezprostredne pod prvý riadok kódu:

position: fixed; right: 100px;

Atribút position prikazuje prehliadačom opraviť bočný panel tak, aby sa pri posúvaní nepohyboval. Správny atribút povoľuje prehliadačom, koľko pixelov by ste chceli umiestniť na pravom okraji bočného panela od pravého okraja webovej stránky. V tomto príklade má správny atribút hodnotu 100 pixlov.

Kliknutím na tlačidlo „Aktualizovať ukážku“ zobrazíte ukážku svojich zmien. Potiahnite posúvač okna nahor a nadol a uvidíte, že sa váš bočný panel nepohybuje. Zmeny uložíte kliknutím na tlačidlo Uložiť.

Tipy

Ak chcete upraviť vodorovnú polohu bočného panela, môžete skúsiť experimentovať s rôznymi hodnotami správneho atribútu. Napríklad, ak zmeníte hodnotu zo 100px na 50px, postranný panel sa posunie o 50 pixlov ďalej doprava.

Upozornenia

Pri práci v editore HTML buďte opatrní, pretože náhodná zmena existujúceho kódu môže mať dramatické účinky na rozloženie vašej stránky. Ak zmeníte kód a nedokážete zistiť, ako zrušiť vaše zmeny, môžete vždy odstrániť všetko v editore HTML a vložiť záložný kód, ktorý ste skopírovali, do editora a obnoviť tak pôvodný stav.

• Predchádzajúca strana: Ako posielať súkromné ​​správy na Twitteri bez toho, aby boli sledované
• Ďalšia strana: Searching for Duplicates on Tumblr