Zdaję sobie sprawę, że zmiany w WordPressie nie każdemu są potrzebne. Może się bowiem tak zdarzyć, że instalujesz WordPressa, potem motyw i potrzebne wtyczki i wszystko Ci odpowiada i pasuje. To, czego potrzebujesz, konfigurujesz sobie w dostosowaniu motywu lub ustawieniach wtyczek i już. I wygląda i działa, jak sobie wymarzyłaś/łeś!
Ale! Ale! Spotykam się często również z takimi sytuacjami, kiedy komuś, kto tworzy swoją (czy na zlecenie) stronę na WordPressie, nie wszystko w motywie, czy wtyczkach odpowiada. Zmiany oczywiście można wprowadzać różne (więcej o nich w podcaście), natomiast dziś zajmiemy się tymi, które dotyczą szeroko pojętego wyglądu.
Co to są zmiany CSS
Warto wiedzieć jedną podstawową rzecz. Jeśli zamierzasz wprowadzić jakąś drobną zmianę w elemencie dekoracyjnym strony, np:
- zmienić rozmiar fontu lub jego wygląd: pochylenie, wyróżnienie itp,
- zmienić jakiś kolor fontu albo dodatków,
- zmienić kolor tła lub je wprowadzić/usunąć,
- wprowadzić obramowanie lub zmienić szerokość obramowania,
- zmienić odległość między różnymi elementami,
to zamierzasz dokonać zmiany w tzw. kodzie CSS. Poniżej znajdziesz opis, jak sprytnie takie zmiany zrobić.
Jak wprowadzać zmiany w CSS
Oczywiście możesz po prostu zacząć się uczyć i nauczyć się kodu CSS. Wprawdzie zajmie Ci to “chwilę”, ale będziesz na swojej stronie działać o wiele bardziej świadomie. Natomiast jeśli nie potrzebujesz, nie masz czasu, nie zamierzasz zostać developerem, a potrzebujesz coś w wyglądzie swojej www pozmieniać – jest na to prosty sposób.
Krok pierwszy – ustaw się kursorem na swojej stronie na elemencie, w którym chcesz dokonać zmiany.
Krok drugi – kliknij prawym przyciskiem myszy i kliknij “Zbadaj” (w Chrome lub Firefox lub coś podobnego w każdej innej przeglądarce). Otworzy Ci się z boku lub na dole strony tzw. inspektor kodu.
Krok trzeci – znajdź w lewej kolumnie wiersz kodu, który odpowiada za element, który chcesz zmienić (podczas najeżdżania na kolejne linijki kodu na stronie będą się podświetlały konkretne elementy).
Krok czwarty – kliknij ten wiersz, a w kolumnie prawej wyświetlą Ci się jego style.
I krok piąty – znajdź styl, który chcesz zmienić, zmień jego wartość (jak zmienisz ją w inspektorze kodu, to “zmieni” się ona również na stronie – oczywiście tylko do czasu odświeżenia strony), po czym zaznacz i skopiuj (ctrl + c) dany fragment kodu.
W ostatnim kroku – wejdź w swoim WordPressie w kokpit -> wygląd -> dostosuj -> dodatkowy CSS i tam wklej (ctrl + v) skopiowany fragment kodu. Na koniec kliknij “Opublikuj” i…
Tadam! Po odświeżeniu strony Twoja zmiana powinna być na niej widoczna.
