System WordPress jest popularny między innymi z tego powodu, że może być zarówno kreatorem stron dla początkujących twórców stron, jak i frameworkiem programistycznym dla web developerów profesjonalistów. To naturalne, że prędzej czy później ci pierwsi będą chcieli skorzystać z pomocy tych drugich. W tym artykule pokażę, jak skutecznie wykonywać modyfikacje, naprawy, rozbudowę i przeróbki na stronach, które stworzył ktoś inny.
Na samym początku musimy zaakceptować fakt, że na stronie stworzonej za pomocą motywu pochodzącego z repozytorium bądź marketu panują nieco inne warunki niż na stronie stworzonej kompletnie na zamówienie (czyli z dedykowanym motywem i wtyczkami). Po drugie: użytkownik strony ma pewne przyzwyczajenia – najczęściej różne od naszych i te – też należy zaakceptować.
Kiedy tworzymy motyw i konfigurujemy stronę dla naszego klienta to bez problemu możemy dodawać kolejne linie do functions.php, edytować główny plik ze stylem CSS oraz wprowadzać dowolne modyfikacje do naszych wtyczek, bo te elementy nigdy nie zostaną nadpisane i dopóki sami nie wprowadzimy żadnych zmian, ich kod jest niezmienny. Strona kogoś kto wykorzystał gotowy motyw, do którego co tydzień wychodzą aktualizacje i używa Visual Composera lub WP Bakery lub Elementora z masą wtyczek to ciągle aktualizujący się serwis, w którym jedynym pewnikiem jest zmiana.
Spis treści
- Zmiany i poprawki wizualne na stronie WordPress
- Rozbudowa strony WordPress
- Wprowadzanie optymalizacji WordPress / WooCommerce
- Aktualizacje systemu WordPress i wtyczek
- Dobre praktyki podczas modyfikowania stron WordPress
Zmiany i poprawki wizualne na stronie WordPress
Zmiany, przeróbki, modyfikacje, które dotyczą wizualnej prezentacji strony najlepiej wprowadzić za pomocą CSS. W przypadku bardziej skomplikowanych zmian konieczne może się okazać napisanie kawałków kodu JavaScript. Poza szczególnymi przypadkami raczej nigdy nie będziemy programować w PHP aby zmienić wygląd konkretnych elementów.
Z tego powodu najlepszym sposobem na wprowadzenie wizualnych zmian na stronie internetowej jest motyw potomny lub własna wtyczka. Te dwie techniki gwarantują, że po aktualizacji motywu wprowadzone zmiany w CSS, JS i PHP zostaną zachowane.
wp_enqueue_style( "custom-styles", get_template_directory_uri()."/css/theme-styles.css",false,'1.1','all');
Korzystanie z własnych wtyczek ma jeszcze tę zaletę, że zawsze możemy dać klientowi łatwą możliwość wycofania zmian, które wprowadziliśmy. W ten sposób w prosty sposób odcinamy się od potencjalnych i często bezpodstawnych zarzutów, że coś zmieniliśmy lub wręcz „popsuliśmy”.
function my_async_scripts() { echo '<script src="'.get_stylesheet_directory_uri()'.'/mega-menu.js" async></script>'; } add_action( 'wp_footer', 'my_async_scripts' );
Dodawany do strony kod CSS, JS i PHP powinien być zgodny ze standardami kodowania WordPressa. W miarę możliwości należy unikać bazowania na bibliotece jQuery – nie mamy bowiem pewności czy nie zostanie wyeliminowany w następnych aktualizacjach WordPressa.
Często może się okazać, że zmiana w strukturze HTML będzie bardzo skomplikowana i kosztowna – wtedy należy rozważyć manipulacji w drzewie DOM. Jest to zazwyczaj tańsze w wykonaniu i prostsze w utrzymaniu.
Modyfikacji szablonów można dokonać w przypadku kiedy wiemy, że do motywu nie są wypuszczane nowe aktualizacje lub elementy, które chcemy zmienić są hardcodowane w ich kodzie źródłowym.
Modyfikacja widoku mobilnego strony WordPress
Częstymi zmianami i poprawkami o jakie proszą właściciele stron WordPress to zmiana widoku mobilnego. Bez znajomości CSS i mechanizmu zapytań medialnych ciężko wprowadzać konkretne zmiany tylko w widoku mobilnym. Najczęściej chodzi i zmianę rozmiaru, zmianę kolejności ale też dodawanie i ukrywanie konkretnych elementów.
Jeżeli zmiana dotyczy widoku mobilnego należy użyć odpowiednich zapytań medialnych i już istniejących punktów granicznych. W ten sposób ułatwiamy wprowadzanie ewentualnych zmian w przyszłości a kod CSS zachowuje w ten sposób pewnego rodzaju spójność.
Dodawanie i usuwanie nowych elementów na stronie WordPress i w sklepie WooCommerce
Dodawanie i usuwanie elementów na stronie WordPress to kolejny typ modyfikacji, o którą mogą nas prosić właściciele strony WordPress. Podczas dodawania nowych elementów należy zrezygnować z instalowania dodatkowych wtyczek pomocniczych tak aby nie pogarszać ogólnej wydajności witryny.
Jeżeli klient prosi o dodatkowe pole na stronie zamiast instalować ACF skorzystaj z natywnych pól niestandardowych WordPress. Jeżeli klient chce mieć wizualny edytor strony wykorzystaj Gutenberga a nie instaluj przestarzałych i coraz rzadziej aktualizowanych wtyczek typu edytor wizualny.
Rozbudowa strony WordPress
Rozbudowa serwisu WordPress o nowe funkcjonalności jest możliwa nawet wtedy, kiedy nie tworzymy go od samego początku. Zapewnia to modularność WordPressa i izolacja rdzenia, od warstwy wizualnej i od różnego rodzaju API.
Tworzenie własnych typów postów, bądź dodanie funkcji sklepu w obcym systemie nie musi być wcale kłopotliwe. Fakt, że korzystamy z gotowego motywu może nam jedynie ograniczać lub utrudniać wykonania zmiany na stronie WordPress.
Jeżeli korzystamy z popularnych a tym bardziej płatnych wtyczek, należy umożliwić klientowi ich bezproblemową aktualizację udostępniając mu dożywotni klucz licencyjny bądź repozytorium skąd może pobierać aktualne wersje.
Wprowadzenie optymalizacji WordPress i WooCommerce
Wszelkiego rodzaju optymalizacje a tym bardziej pod szybkość, wydajność i PageSpeed Insights to bardzo popularna usługą której poszukują właściciele stron i sklepów WooCommerce. W przypadku optymalizacji powinniśmy kierować się dobrymi praktykami wymienionymi w tym artykule przy okazji zmian i rozbudowy. Ponieważ optymalizacji wydajnościowej poświęcam wiele uwagi i swojego czasu, zdążyłem już napisać osobny wpis o tym jak wprowadzać poprawki optymalizacyjne do istniejących stron WordPress. Czytaj więcej: Optymalizacja WordPress pod Core Web Vitals.
Aktualizacje systemu WordPress i wtyczek
Kolejną klasą poprawek są same aktualizacje systemu WordPress i wtyczek. Zawsze powinno się aktualizować WordPressa do najnowszej jego wersji. W następnej kolejności są wtyczki – te też należy aktualizować tym bardziej jeżeli w nowszych wersjach dokonano usprawnień w zakresie bezpieczeństwa. Na samym końcu są motywy i pliki szablonów, bo te rzadko kiedy mają wpływ na bezpieczeństwo.
Choć większość aktualizacji przebiega gładko i bez zakłóceń, to każdy doświadczony WordPress deweloper wie, że dobrze jest mieć dostęp do kopii zapasowej plików i bazy danych WordPressa podczas wykonywania jakichkolwiek aktualizacji. Proces aktualizacji może wpłynąć na pliki a nawet całe foldery, których współdziałanie umożliwia funkcjonowanie WordPressa. W trakcie aktualizacji modyfikacji może ulec zawartość i struktura bazy danych. Bez kopii zapasowej, każda tego typu zmiana jest permanentna i nie można od tak przywrócić ich stanu sprzed aktualizacji. Odkręcanie nieudanych aktualizacji (które mogą mieć różne przyczyny) może być bardzo trudne i czasochłonne bez stanu plików sprzed aktualizcji.
Dobre praktyki podczas modyfikowania stron WordPress
Ponieważ, tworzenie stron WordPress to nic innego jak programowanie, wiele zasad i słynnych cytatów związanych z programowaniem i utrzymywaniem kodu można przełożyć na przykład stron WordPress:
- Modyfikuj stronę WordPress tak, jakbyś miał ją utrzymywać do końca życia.
- Unikaj długu technicznego.
- Cały serwis WordPress powinien być stworzony tak, jakby go robiła jedna osoba, bez względu na to, ile osób wniosło swój wkład.
- Jeżeli jakąś modyfikację w WordPress można napisać w JavaScript, powinno się ją wykonać w JavaScript 😉
Podsumowanie
Wykonanie modyfikacji i zmian na stronie WordPress lub w sklepie WooCommerce zawsze jest możliwe bez względu na to kto ją stworzył i jakich użyto technik. Jedynym ograniczeniem są kompetencje osoby, która ma wprowadzić dane modyfikacje. Zapewnia to modularność WordPressa i sposób w jaki został on stworzony. Prosty system szablonowania, filtry, akcje, Plugin API, Shortcode API i tym podobne rozwiązania gwarantują w miarę bezproblemowe wprowadzanie modyfikacji bez przejmowania się aktualnie wykorzystywanym motywem czy użytymi wtyczkami.
Odpowiedz lub skomentuj