Jak upravit velikost audio přehrávače na Tumblr

Úvod

Na hlavní nástěnce Tumblr nelze vzhled audio přehrávače měnit, ale na vlastním blogu můžete pomocí úprav motivu a CSS změnit jeho velikost. Budete potřebovat základní znalosti HTML a CSS, protože úprava probíhá přímo v kódu motivu. Konkrétní úprava se může lišit podle použitého motivu, ale proměnné pro audio příspěvky jsou vždy stejné, což usnadňuje hledání potřebného CSS.

Postup úpravy

1. Otevřete stránku Přizpůsobení svého motivu a klikněte na odkaz Editovat HTML (nachází se pod miniaturou motivu).
2. Stiskněte Ctrl + F a vyhledejte řetězec {block:audio}. Tím se dostanete k části motivu, kde jsou definována nastavení pro audio příspěvky.
3. Zjistěte, jakou CSS třídu (class) autor použil pro velikost přehrávače, např. class="audio-player".
4. Vyhledejte tuto třídu v kódu pomocí tečky před názvem, např. .audio-player. Najdete řádek podobný tomuto:

.audio-player { }

Pokud motiv používá externí stylesheet (<link rel="stylesheet" href="stylesheet.css">), můžete k elementu přidat atribut style, aniž byste měnili externí soubor:

<div class="audio-player" style="">

Do třídy nebo atributu style přidejte vlastnosti width a height. Pokud již existuje width, upravte ho místo přidání nového.

Příklad úpravy v CSS:

.audio-player { width:100px; height:25px; }

Příklad úpravy přímo v elementu:

<div class="audio-player" style="width:100px;height:25px;">

Po úpravě klikněte na Aktualizovat náhled a ověřte výsledek. Úpravy se mohou projevit různě v závislosti na složitosti motivu, takže může být potřeba několik pokusů.

Jakmile budete spokojeni, klikněte na Uložit, aby se změny aplikovaly na vašem blogu.

Tipy

Při vkládání hudby z externích služeb (např. SoundCloud) můžete velikost přehrávače upravit přímo v embed kódu – tato úprava není ovlivněna nastavením Tumblr.

Upozornění

Popis se vztahuje k možnostem motivu platným v lednu 2014. Od té doby mohly být rozhraní a nastavení Tumblr aktualizovány.