CMS WordPress to system zarządzania treścią, który jest bardzo łatwy w obsłudze dla osób, które nie posiadają wiedzy programistycznej. Dzięki wtyczkom, bibliotece szablonów i rozbudowanemu edytorowi blokowemu, możesz utworzyć dowolny typ witryny, korzystając z gotowych komponentów. Wciąż jednak możesz edytować pliki źródłowe, zmieniać style CSS i edytować HTML wg. własnych potrzeb. W tej instrukcji pokażemy Ci, w jaki sposób szybko przejść do edycji HTML oraz w jaki sposób możesz edytować cały szablon i kod witryny. Dostęp do HTML w WordPress jest bardzo prosty.
Co to jest WordPress?
Podczas redagowania nowych treści, wpisów lub stron WordPress, korzystasz z edytora WordPress, opartego na mechanizmie przeciągnij i upuść. Utwórz nowy wpis lub stronę, a następnie umieść na nich gotowe elementy, takie jak nagłówki, akapity, tabele, media, formularze kontaktowe, itp.
Nie potrzebujesz przy tym pisać kodu takiego elementu od podstaw, gdyż każdy element został wcześniej zaprogramowany, a Ty jedynie wprowadzasz jego zawartość. Poza gotowymi elementami WordPress umożliwia na tym etapie nie tylko edycję każdego z elementów lub całej strony i wpisu za pomocą edytora tekstowego (edytor HTML), ale również możesz dodawać gotowe bloki shortcode i HTML, aby umieścić w nich przygotowany wcześniej kod HTML czy skrypt.
- Zaloguj się do panelu WordPress.
- Przejdź do sekcji Strony lub Wpisy.
- Utwórz nowy lub edytuj istniejący element.
- Skorzystaj z przycisku + aby dodać nowy blok.
- Skorzystaj z przycisku + na górze ekranu (Przełącz wybierak bloków), aby przeglądać całą listę bloków, w tym bloków wielokrotnego użycia.
- Odszukaj interesujący Cię blok i umieść go, a następnie dodaj zawartość.
- Na pasku opcji bloku wybierz Ustawienia > Edytuj w HTML.
- Po zakończeniu edycji ponownie wybierz Ustawienia > Edytuj wizualanie.
W powyższej instrukcji znalazłeś rozwiązanie jak edytować HTML dowolnego bloku, ale możesz też włączyć edytor kodu dla całej strony lub wpisu.
W powyższych instrukcjach edytujesz już dodane elementy. To przydatne rozwiązanie, kiedy chcesz wprowadzić modyfikacje kodu gotowych elementów, np. dodać niestandardowe ustawienia tabeli czy uzupełnić informacje o atrybutach linków (title).
Edytor WordPress oferuje także możliwość dodawania własnego kodu:
- Przejdź do sekcji Strony lub Wpisy.
- Utwórz nowy lub edytuj istniejący element.
- Skorzystaj z przycisku + aby dodać nowy blok.
- Skorzystaj z przycisku + na górze ekranu (Przełącz wybierak bloków), aby przeglądać całą listę bloków, w tym bloków wielokrotnego użycia.
- Odszukaj blok Własny HTML, aby dodać kod HTML.
- Wybierz blok Kod, aby dodać własny skrypt.
Podczas dodawania i edycji bloków w edytorze treści, masz także możliwość wprowadzania dodatkowych klas CSS:
- Dodaj lub edytuj wybrany blok, klikając w niego.
- Po prawej stronie ekranu przejdź do zakładki Blok, aby zmienić jego ustawienia dodatkowe.
- Rozwiń opcje Zaawansowane.
- Umieść dodatkowe klasy CSS.
To rozwiązanie umożliwia wprowadzenie zmian dla całej strony lub pojedynczych bloków, w zależności od tego, jakiego kodu CSS użyjesz.
Kiedy edycja pojedynczych elementów, stron czy wpisów jest niewystarczająca, możesz przejść do edytora kodu dla całej witryny internetowej. W ten sposób możesz modyfikować szablon witryny czy wprowadzać globalne zmiany w jej strukturze i wyglądzie.
- Zaloguj się do panelu WordPress.
- Przejdź do sekcji Wygląd.
- Wybierz Edytor plików motywu.
- Po prawej stronie ekranu wybierz motyw, który chcesz edytować.
Wybór motywu jest ważny, dlatego, że niektóre motywy dziedziczą szablony z innych motywów. Możesz w ten sposób edytować, np. style CSS jednego motywu, ale jeśli chcesz edytować strukturę witryny, powinieneś przełączyć się na macierzysty motyw.
Teraz po prawej stronie ekranu wybierz pliki do edycji.
Pamiętaj, aby przed wprowadzeniem zmian, skopiować zawartość pliku, np. do notatnika, aby móc szybko przywrócić jego kopię zapasową.
Jeśli wprowadzasz rozbudowane zmiany, zalecamy utworzenie kopii zapasowej WordPress lub uruchomienie kopii strony, celem przetestowania wdrażanych rozwiązań.