Jak wyśrodkować tło w motywie Tumblr

Wstęp

Wyśrodkowanie obrazu tła w motywie Tumblr wymaga jedynie zmiany jednej linii kodu CSS. Najlepiej używać obrazu, który wypełnia całą przestrzeń i nie powtarza się (tzw. tiling). Domyślny motyw Redux powiela obrazy, ale tę funkcję można wyłączyć i ustawić tło w centrum zarówno w pionie, jak i w poziomie.

Kroki

1. Otwórz panel Tumblr i kliknij strzałkę obok nazwy bloga, aby wyświetlić listę wszystkich blogów. Wybierz blog, który chcesz edytować.
2. Przejdź do zakładki Customize, aby otworzyć edycję motywu.
3. W sekcji Background Image kliknij ikonę Upload, wybierz obraz i zatwierdź przyciskiem Open.
4. Po wgraniu obrazu kliknij link Edit HTML, aby otworzyć edytor kodu.
5. Użyj skrótu Ctrl+F i wpisz słowo background. Znajdź następującą regułę CSS:
   body { background: {color:Background} url('{image:Background}') top left fixed repeat; }
6. Zamień fragment top left fixed repeat na no-repeat center center. Pierwsze center wyrównuje obraz w pionie, drugie – w poziomie. Nie zapomnij o średniku na końcu.
7. Kliknij Update Preview, aby zobaczyć efekt.
8. Na koniec naciśnij Save, a następnie Exit, aby zamknąć edytor.

Wskazówki

• Możesz skrócić zapis do no-repeat center – domyślnie drugi parametr center zostanie przyjęty automatycznie.
• Użycie no-repeat top center wyśrodkuje obraz w poziomie, ale ustawi go przy górnej krawędzi strony.