Gutenberg w WordPress - jak edytować stronę firmową

Do zmiany tekstu podstrony zacznij od menu Strony, a następnie wybierz konkretną stronę do edycji. Edytor bloków jest częścią WordPressa. Oddzielna wtyczka Gutenberg udostępnia rozwijane funkcje edytora, lecz do zwykłej aktualizacji opisu usługi nie trzeba jej instalować.

Edytor witryny służy także do pracy nad szablonami, częściami szablonów i wspólnym wyglądem. Wymaga motywu blokowego. Brak pozycji Wygląd → Edytor nie oznacza więc, że WordPress jest uszkodzony. Szczegóły tego podziału opisuje dokumentacja Edytora witryny.

Najpierw sprawdź, w czym wykonano istniejącą podstronę. Jeżeli panel proponuje edycję w innym kreatorze, nie konwertuj zawartości na bloki tylko po to, aby poprawić jedno zdanie. Otwórz dotychczasowe narzędzie albo ustal z wykonawcą sposób edycji. Przebudowa układu to osobne zadanie, które wymaga kopii, testów i kontroli całej podstrony. Ten poradnik dotyczy stron, których treść rzeczywiście zbudowano z bloków.

Otwórz publiczną wersję strony w osobnej karcie i zanotuj dokładnie, co ma się zmienić. Przykład: opis zakresu usługi i adres przycisku, bez zmiany zdjęcia oraz odstępów. Takie ograniczenie zadania ułatwia późniejsze sprawdzenie wyniku.

1. W panelu wybierz Strony → wybrana podstrona → Edytuj.
2. Włącz widok listy i odszukaj nagłówek sekcji. Rozwiń nadrzędną grupę, jeśli tekst znajduje się wewnątrz układu.
3. Wybierz właściwy akapit i wprowadź zmianę. Panel ustawień bloku dotyczy zaznaczonego elementu; nie myl go z ustawieniami całej strony.
4. Przy poprawianiu przycisku sprawdź zarówno etykietę, jak i docelowy adres.
5. Otwórz podgląd, porównaj go z wersją publiczną i dopiero wtedy zapisz zmianę.

Dodawanie i wybieranie elementów pokazuje instrukcja pracy z blokami. Układ ikon może różnić się między instalacjami. Szukaj nazw funkcji i etykiet przycisków, zamiast kierować się wyłącznie ich położeniem.

Nie zmieniaj adresu URL przy okazji korekty akapitu. Jeśli podstrona jest już podlinkowana z innych miejsc, zmiana adresu wymaga osobnego przygotowania przekierowania i kontroli linków.

Przygotuj roboczą wersję sekcji, zanim zaczniesz dobierać jej wygląd. W przykładowej sekcji firmy usługowej potrzebne są: nazwa usługi, odpowiedź na pytanie klienta, zakres wykonania i następny krok. To przykład układu, a nie opis konkretnej realizacji KC Mobile.

Dodaj Grupę, a w niej nagłówek H2, akapit, obraz oraz blok przycisków z jednym przyciskiem. Grupa porządkuje elementy sekcji i pozwala przesuwać je razem. W widoku listy upewnij się, że obraz i przycisk faktycznie należą do tej grupy, a nie stoją obok niej.

Nagłówek powinien mówić, czego dotyczy sekcja. Zamiast samego słowa Oferta użyj nazwy konkretnej usługi. W akapicie opisz, dla kogo jest przeznaczona i co obejmuje. Na przycisku można umieścić Zapytaj o wdrożenie, jeśli prowadzi do formularza związanego z tym zadaniem. Sam napis Więcej nie wyjaśnia, co wydarzy się po kliknięciu.

Nie dodawaj kolejnego H1 tylko dlatego, że chcesz większego tekstu. Tytuł strony lub szablon może już zawierać nagłówek główny. Wielkość pisma ustawiaj stylem, a poziom nagłówka dobieraj do struktury treści. Przed dodaniem ilustracji sprawdź też, czy pomaga zrozumieć usługę; ozdobny obraz nie zastąpi konkretnego opisu zakresu.

Gdy chcesz umieścić zdjęcie obok opisu, użyj bloku Kolumny wewnątrz grupy. Zaznacz cały blok kolumn, aby zmienić układ, albo pojedynczą kolumnę, aby poprawić jej zawartość. Dostępne ustawienia zależą od motywu i wersji edytora. Dokumentacja bloku Kolumny opisuje również ustawienie układania elementów na urządzeniach mobilnych.

Sam podgląd na szerokim monitorze nie wystarczy do odbioru sekcji. Sprawdź ją na wąskim ekranie: czy najpierw pojawia się opis, czy obraz, czy przycisk nie wypada poza ekran i czy tekst nie przykleja się do krawędzi. Przeczytaj sekcję w kolejności, w jakiej zobaczy ją klient na telefonie. Układ może wyglądać dobrze, a mimo to wymagać przewijania obok treści.

Sprawdź kontrast napisów oraz widoczność przycisku po przejściu klawiszem Tab. Jeżeli dodany obraz wyraźnie opóźnia wyświetlenie strony, skorzystaj z poradnika przyspieszania WordPressa. Zmiana edytora sama w sobie nie rozwiązuje problemów z dużymi plikami, hostingiem ani dodatkowymi skryptami.

Wzorzec pomaga ponownie wykorzystać przygotowany układ. Wzorzec synchronizowany ma wspólne źródło, dlatego edycja jego współdzielonych elementów może zmienić inne miejsca, które go używają. Niezależna kopia służy do dalszej pracy na konkretnej podstronie. Nazewnictwo oraz odłączanie instancji opisuje dokumentacja wzorców synchronizowanych.

Przed poprawieniem sekcji sprawdź, czy zaznaczyłeś zwykłą grupę, czy instancję wzorca. Jeśli nowa treść ma dotyczyć wyłącznie tej podstrony, rozważ odłączenie instancji i skontroluj rezultat w podglądzie. Nie odłączaj wzorca automatycznie, gdy firma celowo utrzymuje wspólny numer telefonu lub komunikat kontaktowy.

Nie każda dostępna edycja oznacza zmianę globalną: nowsze mechanizmy wzorców mogą dopuszczać lokalne nadpisania określonych pól. Zasięg zależy od konstrukcji wzorca i wersji WordPressa. Dlatego przy pierwszej zmianie wybierz jeszcze jedną stronę używającą tego samego elementu i porównaj oba widoki. Taki konkretny test daje więcej pewności niż założenie, że wszystkie wzorce zachowują się identycznie.

Szablon określa układ stron, które z niego korzystają. Nagłówek i stopka mogą być częściami szablonu używanymi w wielu miejscach. Jeśli chcesz poprawić opis jednej usługi, nie trzeba z tego powodu zmieniać wspólnego szablonu strony.

Przy zapisie w Edytorze witryny sprawdź listę zmodyfikowanych obiektów. WordPress opisuje tę kontrolę słowami: "You can choose to save all or just some of them." Oznacza to możliwość wyboru zapisywanych zmian, a nie konieczność zatwierdzania całej listy. Źródłem jest instrukcja Edytora witryny.

Jeżeli lista obejmuje szablon lub wspólne style, a planowałeś tylko korektę tekstu, zatrzymaj zapis i sprawdź, skąd wzięły się dodatkowe zmiany. Przed zaplanowaną ingerencją w szablony przygotuj kopię oraz sposób odtworzenia poprzedniego stanu. Zasady pracy na kopii opisujemy także przy bezpiecznej aktualizacji WordPressa. Po zapisaniu zmiany wspólnego elementu obejrzyj reprezentatywne podstrony, również te z dłuższymi tytułami.

Gdy edytor zachowuje się inaczej niż poradnik, zacznij od rozpoznania konkretnego objawu. Instalowanie kolejnego pakietu bloków bez diagnozy może dołożyć następne ustawienia, ale nie wyjaśni źródła problemu.

Przy zgłoszeniu do wykonawcy podaj adres podstrony, nazwę elementu, oczekiwany efekt i kroki prowadzące do błędu. Zrzut ekranu bez danych dostępowych może pomóc wskazać blok. Nie przesyłaj hasła w opisie problemu.

Przed publikacją przeczytaj tekst bez otwartego panelu administracyjnego. Czy klient rozumie zakres usługi? Czy obraz pasuje do opisu? Czy przycisk prowadzi do właściwego miejsca? Sprawdź linki, nagłówki, widok telefonu oraz przejście klawiaturą. Przy zmianie formularza wykonaj test w środowisku testowym, z kontrolowaną wysyłką i bez dopisywania sztucznych konwersji do pomiaru produkcyjnego.

Po zapisie obejrzyj stronę jako wylogowany użytkownik. Przy wspólnym wzorcu lub szablonie skontroluj też inne jego użycia. Zapisz krótko, co zmieniono i co sprawdzono. Przy następnej korekcie taka notatka pomaga odróżnić nowy problem od wcześniejszego zachowania strony.

Jeżeli potrzebujesz przygotowania układów, które zespół będzie samodzielnie uzupełniał, sprawdź wdrożenia WordPress i tworzenie stron internetowych. W wiadomości do KC Mobile podaj adres strony, używany edytor i przykład sekcji do poprawy. Możemy ustalić również dalsze wsparcie oraz drobne zmiany w małym pakiecie godzinowym. Zakres opieki i zasady obsługi uzgadniamy dla konkretnej strony.

• Modernizacja strony WordPress: jak zaplanować zmiany i uniknąć kosztownych błędów
• Jak dodać i podlinkować baner graficzny w szablonie RWD? Instrukcja dla WordPressa
• React Flow: jak tworzyć interaktywne schematy i edytory?