5 Sposobów na dostosowanie motywu WordPress

Gdy wybieramy motyw WordPress na naszą stronę najczęściej zamierzamy go zmodyfikować i dostosować do własnych potrzeb. Ponieważ każdy motyw jest zgodny ze standardem WordPress, co sprawia, że dostosowywanie motywu jest stosunkowo łatwe. W tym artykułu omówimy najprostsze sposoby na dostosowanie motywu WordPress.

5 Sposobów na dostosowanie motywu WordPress

Pokażę Ci najbardziej efektywne i proste:

Metoda 1: Dostosowanie motywu WordPress przez WordPress Customizer

Wbudowany moduł dostosowywania ułatwia dostosowanie dowolnego motywu WordPress. Aby dostosować motyw WordPress z pomocą WordPress customizera, wykonaj następujące kroki:

Krok 1: Najpierw przejdź do panelu admina WordPress, a następnie przejdź do sekcji Wygląd, a następnie sekcji Motyw i na koniec kliknij Dostosuj.

Krok 2: Potem po prostu wybierz odpowiednią kartę i dostosuj ją. Na przykład kliknij Tożsamość witryny, Kolory, Nagłówek, Menu, Widżety, Ustawienia strony głównej i Dodatkowy CSS i dostosuj motyw zgodnie z własnymi potrzebami.

Metoda 2: Dostosowanie motywu WordPress przez kreatory stron i frameworki

  • Kreatory

Kreator stron to elastyczne narzędzie do projektowania, które zapewnia pełną kontrolę wizualną nad tworzoną stroną internetową. Jego działanie możliwe jest z poziomu przeglądarki, a dokładnie, bezpośrednio na witrynie internetowej którą tworzymy.

Kreator motywów umożliwia zastąpienie całego lub części motywu WordPress własnymi niestandardowymi projektami. O ile dostosowanie motywy (płatnego lub bezpłatnego) wymagało by od nas m.in. znajomości a następnie edycji PHP i CSS, theme builder opiera się na interfejsie wizualnym, przeciągnij i upuść. To świetne narzędzie, które z jednej strony nie wymaga od nas wiedzy technicznej, z drugiej strony otwiera nowe możliwości do tworzenia nowych oraz edycji szablonów.

Kreator motywów pozwala na bardzo dużą elastyczność przy tworzeniu i edycji motywu strony internetowej. Na tyle dużą, że za pomocą techniki przeciągnij i upuść możesz zaprojektować każdą stronę z osobna i każdy jej pojedynczy element. Przypomina to tworzenie stron w typowym kreatorze stron internetowych, przenoszenie modułów i dodawanie tekstu. Nie inaczej jest w tym przypadku, ale pracujemy nie z samym kreatorem, co bezpłatnym CMS WordPress. Kreatorstron jest więc rozszerzeniem dla CMS, które zamienia typowego WordPressa w kreator strony WWW. Należy przy tym pamiętać, że samo narzędzie opiera się na budowie struktury strony i jej elementów ale nadal, tak jak ma to miejsce w CMS WordPress, wymaga korzystania z dodatkowych wtyczek.

Kreatory szablonów mogą stanowić najlepszy wybór, jeśli zależy nam na personalizacji strony internetowej i wprowadzeniu nieszablonowych rozwiązań. Także na już istniejących szablonach, które zainstalowaliśmy. Niezależnie także od stopnia złożoności, Builder jest narzędziem zarówno elastycznym i przyśpieszającym pracę, ale równolegle umożliwia budowanie motywów osobom nietechnicznym. I to jest jego największa zaleta. Zamiast uczyć się PHP i CSS do edycji interesującego nas szablonu, możemy wprowadzić narzędzie, które pomoże nam w tym.

Większość narzędzi tego typu posiada także szereg własnych projektów, które możemy używać przy tworzeniu strony internetowej lub przekształcać je wg. własnych potrzeb. Wtyczki takie jak np. Neve obsługują także integrację z WooCommerce lub są skierowane typowo do obsługi blogów internetowych zawierając szereg przydatnych komponentów.

  • Frameworks

Zazwyczaj framework będzie zawierał podstawowy kod, obejmujący podstawowe funkcje i elementy projektu. Struktura jest następnie używana jako punkt początkowy podczas tworzenia nowego motywu. Istnieje mnóstwo gotowych frameworków, ktorych możesz używać do modyfikacji motywów WordPress, Jednim z nich jest Unyson.

Został on stworzony przez popularny zespół ThemeFuse. Jest on darmową wtyczką, która ma wszystkie funkcje i komponenty najlepszych frameworków motywów WordPress. Framework Unyson jest wyposażony w pełnoprawny kreator stron typu „przeciągnij-i-upuść”, z którego możesz korzystać, pozwalając użytkownikom tworzyć niezliczone strony przy użyciu skrótów treści i multimediów. Dzięki opcjom możesz łatwo tworzyć zakładki, pola i formularze dla stron administracyjnych. Stworzyliśmy ponad 20 typów opcji, których możesz używać podczas wdrażania motywu. Unyson oferuje również nieograniczoną liczbę pasków bocznych, suwaków, mega menu, automatyczne kopie zapasowe i zaawansowane opcje SEO.

Metoda 3: Dostosowanie motywu WordPress przez wtyczki

Wtyczki WordPress są również jednym z najprostszych sposobów na dostosowanie motywów WordPress. Możesz stosować dowolny styl lub rozszerzać jego funkcjonalność za pomocą wtyczek. Istnieje wtyczka do dowolnego stylu lub funkcjonalności, które chcesz dodać do motywu i zmienić jego wygląd. Możesz wybrać darmowe wtyczki, ale pamiętaj, że mają oni ograniczoną funkcjonalność. Dlatego możesz także wybrać płatną wtyczkę Dostosowanie motywu WordPress, aby w pełni z niej korzystać.

Korzystając z wtyczek można:

  • Wprowadzać dowolne zmiany do motywu
  • Włączać lub usuwać bloki na stronach
  • Modyfikować design

Koryzstająć ze wtyczke możesz nawet dodawać własny kod CSS do motywu WordPrerss, Na przykład,  jeśli używasz popularnej wtyczki – JetPack, masz możliwość dodanie własnego kodu CSS nawet bez konieczności łączenia się z serwerem przez SFTP (FTP) aby edytować pliki, wszystko możesz zrobić z zaplecza Twojego WordPressa. Jednak nie wszyscy instalują JetPacka, który zawiera wiele modułów, które czasami są zbędne.

Na szczęście jest jeszcze jedna alternatywa aby mieć taką samą funkcjonalność, używając jednej, bardzo prostej wtyczki JP Custom CSS, która jest praktycznie pojedynczym modułem, wyjętym z JetPacka. Ta wtyczka trzyma kod CSS całkowicie odseparowany od motywu, jest to bardzo dobre rozwiązanie, ponadto umożliwia ona korzystanie z preprocesorów LESS i Sass, które znacznie ułatwiają tworzenie arkusza stylów CSS.

Wtyczka posiada 2 tryby pracy; Add-On, który jest zalecany i dodaje kod CSS do istniejącego już kodu w motywie lub drugi tryb pracy, który całkowicie zastępuje domyślny plik style.css i pozwala na napisanie całego kodu CSS od podstaw.

Jest jeszcze jedna (dość istotna) zaleta tego typu rozwiązania, podobnie jak w przypadku edytowania wpisów czy stron w WordPressie, tutaj też możemy dodać własny kod CSS i przejrzeć zmiany przed opublikowaniem. Klikamy przycisk Preview i w nowej zakładce/oknie możemy zobaczyć podgląd naniesionych zmian. Na górze zobaczymy informację, że zmiany muszą zostać zapisane, w przeciwnym wypadku zostaną utracone. Kiedy jesteśmy pewni, że modyfikacje są poprawne, możemy zapisać arkusz. Bardzo przydatna opcja dla początkujących developerów, którzy nie są pewni czy ich kod CSS przyniesie pożądany efekt.

Metoda 4: Dostosowanie motywu WordPress przez własny kod CSS

Developerzy motywów WordPressa (dobrych motywów) zazwyczaj mają dobre oko, jeśli chodzi o stronę wizualną i robią wszystko, aby najlepiej dopasować wygląd motywu do oczekiwań odbiorców, tworząc np. kilka wersji kolorystycznych i tak dalej. Jednak ktoś, kto tworzy końcową stronę internetową w oparciu o dany motyw i tak bardzo często chce zmienić lub dodać kilka wizualnych elementów, jak kolory, tła, bordery – krótko mówiąc, potrzebuje dodać własny kod CSS.

CSS to tzw. kaskadowe arkusze stylów. Są to pliki zawierające kod opisujący wygląd strony internetowej. Szkielet strony jest zbudowany z użyciem języka HTML. Przez szkielet rozumiemy, jakie elementy i w jakiej kolejności znajdują się na stronie, np.

  • logo
  • nagłówek
  • menu
  • treść artykułu
  • zdjęcie produktu
  • panel boczny (sidebar)

CSS umożliwia nam opisanie, w jaki sposób te elementy mają wyglądać.

Najczęstszym sposobem na dodanie własnego kodu CSS jest edycja pliku style.css, lub innych plików motywu ze stylami, nie jest to jednak dobre rozwiązanie ze względu na późniejsze problemy przy aktualizacjach. Dużo lepszym rozwiązaniem jest używanie motywów potomnych, które świetnie sprawdzają się przy dużych modyfikacjach, jednak jeśli ktoś chce tylko dodać kilka/kilkanaście linijek kodu CSS i nie zmieniać innych plików motywu, to myślę że nie jest to najwygodniejsze rozwiązanie.

Metoda 5: Dostosowanie motywu WordPress przez motyw potomny

Zakładam się, że wiesz czym to jest motyw potomny i jak działa dla motywu rodzica. Ale na wszelki wypadek opowiem Ci o nim w skrócie. Motyw potomny to taki motyw, który dziedziczy wygląd swojego motywu rodzica i zawiera jedynie nasze własne modyfikacje. Innymi słowy, motyw potomny działa w oparciu o inny motyw (tzw. motyw rodzic), dziedzicząc jego wygląd i różniąc się tylko tymi plikami, które są w nim umieszczone. Wykorzystuje oryginalny wygląd głównego motywu i nakłada na niego nasze własne zmiany bez bezpośredniej modyfikacji głównego szablonu.

W folderze z motywem potomnym są umieszczone tylko te pliki, w których wprowadziliśmy jakiekolwiek zmiany i stanowią one pierwszeństwo, nadpisując oryginalne pliki motywu rodzica podczas ładowania strony. Dzięki temu wszystkie nasze modyfikacje są całkowicie odseparowane w osobnym folderze. WordPress podczas otwierania strony najpierw ładuje nasze zmodyfikowane pliki z folderu z motywem potomnym, gdyż mają one pierwszeństwo. Reszta plików jest natomiast ładowana z oryginalnego motywu, na którym bazujemy.

Motyw potomny jest bardzo pomocny, jeśli chcesz dostosować stronę internetową bez wprowadzania zmian w motywie rodzica. Wysoce bezpiecznym i zalecanym sposobem modyfikacji motywu jest utworzenie motywu potomnego. Mechanizm motywu potomnego polega na dostosowaniu funkcjonalności motywu rodzica bez bezpośredniego wpływu na niego. Motyw rodzica pozostanie niezmieniony, a wszystkie zmiany zostaną wprowadzone tylko w motywie potomnym.

Jeśli na przykład planujesz modyfikować kod w plikach oryginalnego motywu, dodawać lub usuwać swoje własne funkcje i wprowadzać duże zmiany w strukturze strony, to użycie motywu potomnego jest jak najbardziej wskazane. Z reguły motywu potomnego powinieneś użyć zawsze wtedy, gdy pojawia się potrzeba bezpośredniego edytowania plików PHP lub dopisywania dużej ilości własnych reguł CSS (oraz modyfikowania istniejących).

Jaki sposób wybrać aby dostosować motyw WordPress?

Wszystkie z powyższych sposobów na dostosowanie motywu WordPress są warte uwagi! Możesz wybrać dowolną metodę, która wydaje Ci się łatwiejszą i szybszą! Dostosowywanie motywu WordPress nie jest trudne, gdy znasz te proste sposoby dostosowywania. Mam nadzieję, że nasz wpis pomoże ci w tym. Daj znać, jeśli wiesz inne sposoby na dostosowanie motywów WordPress, lub masz jakiś dodatkowe pytania!

Także polecam napisać do naszego zespołu supportu, jeśli a potkasz na jakiekolwiek trudności podczas dostosowania naszych motywów WordPress. A jeśli nie posiadasz wystarczająco dużo umiejźętności technicznych, lub nie masz czasu na dostosowanie swojej strony na WordPress, sprawdź nasze dodatkowe oferty! Korzystając z nich będziesz mógł uruchomić witrynę prawie od zera i zaoszczędzić swój czas!

Sprawdź dodatkowe oferty


Czytaj również:

Najlepsze wtyczki do dodawania pop-up na stronę WordPress

Jak wstawić favicons w WordPress?

W jaki sposób możemy przyśpieszyć naszą stronę WWW opartą na WordPressie?



Katarzyna Pawłowska

W branży IT od 8 lat. Fan nowych technologii webowych, web designu oraz rozwiązań użytecznych i funkcjonalnych. W praktyce: marketer, DJ, blogerka. W wolnym czasie wspiera inicjatywy propagujące wiedzę z dziedziny SMM i rozwija swoją miłość do crossfitu.