Jak zmrazit popis na Tumblr, aby se při posouvání nehnul

Pokud se ve vašem motivu na Tumblr popis posouvá spolu s příspěvky, můžete jej snadno připoutat k horní části stránky. K tomu je potřeba upravit HTML i CSS motivu a najít správné klíčové slovo, které popis „zamkne“.

Prohlížení HTML kódu

Přihlaste se na Tumblr, klikněte na ikonu ozubeného kola v horní liště a vyberte nastavení svého blogu. V levém menu zvolte Upravit motiv a poté Editovat HTML. V levé části se zobrazí kód motivu, v pravo náhled blogu.

Stiskněte Ctrl + F a vyhledejte dvě‑tři slova přesně tak, jak jsou napsána v popisu. Prohlížeč vás přesměruje na příslušný úsek HTML, např. block:Description. Přejděte několik řádků výše a hledejte atribut, který popis „vznáší“ – často se jedná o id="float" nebo podobně.

Nahraďte tento atribut slovem fixed (např. <div id="fixed">) a klikněte na Aktualizovat náhled. Pokud se popis po posunu stránky nepohybuje, uložte změny kliknutím na Uložit. V opačném případě pokračujte v hledání v CSS.

Hledání a úprava CSS

V HTML kódu najděte první výskyt slova stylesheet. V řádku, kde je uveden odkaz na CSS soubor (např. rel="stylesheet" href="https://…/theme.css"), zkopírujte URL a otevřete ji v nové kartě prohlížeče.

Na stránce s CSS kódem použijte opět Ctrl + F a vyhledejte stejné slovo, které jste našli v HTML (např. float). Prohlédněte si okolní kód a hledejte protiklad – typicky fixed, static nebo stuck.

Vraťte se do HTML editoru a nahraďte původní atribut (např. float) jedním z výše uvedených „zamykacích“ slov. Znovu klikněte na Aktualizovat náhled a otestujte posouvání. Pokud popis zůstane na místě, změny uložte.

Tipy

Některé motivy nemají v CSS připravenou možnost pevného popisu. V takovém případě může být nutné přidat vlastní CSS pravidlo, např. #description {position: fixed; top: 0;}.

Varování

Neukládejte úpravy, dokud si nejste jisti výsledkem v náhledu. Náhodné změny v HTML nebo CSS mohou rozbít rozvržení celého blogu.