Jak zmienić rozmiar odtwarzacza muzyki w motywie Tumblr

Nie da się zmienić wyglądu odtwarzacza audio w panelu głównym Tumblr, ale możesz dostosować jego wygląd na własnym blogu, korzystając z opcji motywu i własnych modyfikacji HTML oraz CSS. Wymaga to podstawowej znajomości kodu, ponieważ trzeba edytować szablon bloga. Sposób modyfikacji może się nieco różnić w zależności od używanego motywu, ale zmienne Tumblr dla postów audio są zawsze takie same, co ułatwia odnalezienie właściwych reguł CSS.

Krok po kroku

1. Wejdź na stronę Dostosuj motyw w panelu administracyjnym Tumblr.
2. Kliknij link Edytuj HTML – znajduje się on po prawej stronie miniaturki wybranego motywu, pod jego nazwą.
3. Użyj skrótu Ctrl+F i wyszukaj ciąg {block:audio}. Zostaniesz przeniesiony do sekcji, w której twórca motywu definiuje wygląd postów audio.
4. Sprawdź, jaką klasę CSS zastosowano do odtwarzacza, np. class="audio-player". Następnie ponownie wyszukaj tę klasę w stylach, wpisując .audio-player (kropka oznacza klasę w CSS).
5. W zależności od motywu znajdziesz jedną z dwóch sytuacji:
   • Reguła znajduje się w wewnętrznym arkuszu stylów – możesz od razu edytować właściwości width i height.
   • Motyw korzysta z zewnętrznego pliku CSS (<link rel="stylesheet" href="stylesheet.css">). W takim wypadku dodaj atrybut style do znacznika HTML odtwarzacza, aby nadpisać istniejące reguły.
6. Przykładowa reguła w arkuszu stylów:

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

   Lub jako atrybut style w znaczniku:

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

7. Kliknij Update Preview, aby zobaczyć efekt zmian. Może być potrzebnych kilka prób, aby uzyskać pożądany rozmiar.
8. Gdy wszystko wygląda dobrze, naciśnij Save, aby zapisać zmiany w motywie.

Wskazówki

Jeśli wstawiasz muzykę z zewnętrznego serwisu (np. SoundCloud), rozmiar odtwarzacza można zmienić bezpośrednio w kodzie embed – nie podlega on ustawieniom Tumblr.

Ostrzeżenia

Instrukcje odnoszą się do wersji motywów dostępnych w styczniu 2014 roku. Aktualizacje platformy mogą wprowadzić zmiany w dostępnych opcjach.