Tłumaczenie maszynowe

Czasami może się okazać, że musisz dodać niestandardowy CSS do swojej witryny WordPress.

Być może dlatego, że śledzisz tutoriale na WPBeginner lub na naszym kanale YouTube . Dla większości początkujących korzystanie z FTP jest zbyt trudne, ale istnieją inne sposoby dodawania niestandardowego CSS.

W tym artykule pokażemy, jak łatwo dodać niestandardowy CSS do witryny WordPress bez edytowania plików motywów.

Instrukcja wideo

Jeśli wolisz samouczki w formie pisemnej lub chcesz poruszać się we własnym tempie, czytaj dalej poniższe instrukcje.

Metoda 1: Dodanie niestandardowego CSS za pomocą narzędzia Theme Customizer

Od wersji 4.7 WordPress użytkownicy mogą teraz dodawać własne pliki CSS bezpośrednio z obszaru administracyjnego WordPress. Jest to bardzo łatwe i możesz natychmiast zobaczyć swoje zmiany w podglądzie na żywo.

Najpierw musisz przejść do strony Motywy »Dostosuj .

Launching the theme customizer

Spowoduje to uruchomienie interfejsu dostosowywania motywu WordPress.

Zobaczysz podgląd na żywo swojej witryny z kilkoma opcjami w lewym okienku. Kliknij kartę Dodatkowe CSS w lewym okienku.

Additional CSS option in WordPress theme customizer

Karta przesunie się, aby pokazać proste pole, w którym możesz dodać niestandardowy CSS. Jak tylko dodasz prawidłową regułę CSS, zobaczysz, że została zastosowana w okienku podglądu na żywo w Twojej witrynie.

Adding custom CSS with live preview

Możesz kontynuować dodawanie niestandardowego kodu CSS, dopóki nie będziesz zadowolony z jego wyglądu w witrynie.

Po zakończeniu nie zapomnij kliknąć przycisku „Zapisz i opublikuj” u góry.

Save your custom CSS changes

Uwaga: każdy niestandardowy kod CSS dodany za pomocą modułu dostosowania motywu jest dostępny tylko z tym konkretnym motywem. Jeśli chcesz go używać z innymi motywami, musisz skopiować i wkleić go do nowego motywu przy użyciu tej samej metody.

Metoda 2: Dodanie niestandardowego CSS za pomocą wtyczki

Pierwsza metoda pozwala tylko na zapisanie niestandardowego CSS dla aktualnie aktywnego motywu. Jeśli zmienisz motyw, może być konieczne skopiowanie i wklejenie niestandardowego arkusza CSS do nowego motywu.

Jeśli chcesz, aby Twój niestandardowy CSS był stosowany niezależnie od używanego motywu WordPress , ta metoda jest dla Ciebie.

Pierwszą rzeczą, którą musisz zrobić, to zainstalować i aktywować wtyczkę Simple Custom CSS . Po aktywacji przejdź do Wygląd »Niestandardowy CSS i zapisz lub wklej swój niestandardowy CSS.

Simple Custom CSS

Nie zapomnij nacisnąć przycisku „Zaktualizuj niestandardowy CSS”, aby zapisać zmiany.

Możesz teraz wyświetlić swoją witrynę WordPress, aby zobaczyć niestandardowy CSS w akcji.

Używanie niestandardowej wtyczki CSS a dodawanie CSS w motywie

Obie opisane powyżej metody są zalecane dla początkujących. Zaawansowani użytkownicy mogą również dodawać niestandardowe pliki CSS bezpośrednio do swoich motywów.

Jednak dodawanie niestandardowych fragmentów CSS do motywu nadrzędnego nie jest zalecane. Twoje zmiany CSS zostaną utracone, jeśli przypadkowo zaktualizujesz motyw bez zapisywania niestandardowych zmian.

Najlepszym podejściem jest użycie motywu potomnego . Jednak wielu początkujących nie chce tworzyć motywu potomnego. Oprócz dodawania niestandardowego CSS, często początkujący naprawdę nie wiedzą, jak będą używać tego motywu potomnego.

Korzystanie z niestandardowej wtyczki CSS umożliwia przechowywanie niestandardowego CSS niezależnie od motywu. W ten sposób możesz łatwo przełączać motywy, a niestandardowy CSS nadal tam będzie.

Innym świetnym sposobem na dodanie niestandardowego CSS do witryny WordPress jest użycie wtyczki CSS Hero . Ta wspaniała wtyczka pozwala edytować prawie każdy styl CSS w witrynie WordPress bez pisania ani jednej linii kodu.

Editing custom CSS with CSS Hero plugin for WordPress

Mamy nadzieję, że ten artykuł pomógł w dodaniu niestandardowego CSS do Twojej witryny WordPress. Możesz również chcieć zobaczyć, jak nasz przewodnik dotyczący tworzenia niestandardowego motywu WordPress bez pisania kodu oraz najlepsze wtyczki do tworzenia stron typu przeciągnij i upuść .

Jeśli podobał Ci się ten artykuł, zasubskrybuj nasz kanał YouTube z samouczkami wideo WordPress. Możesz nas również znaleźć na Twitterze i Facebooku .

Tłumaczenie maszynowe, źródło: WP Beginner

Podobne