Edycja wizualna zrewolucjonizowała sposób tworzenia widżetów.
To, co kiedyś wymagało niestandardowego kodu, teraz można zrobić za pomocą kilku kliknięć, dzięki czemu tworzenie widżetów jest dostępne dla każdego.
Wizualny edytor w WordPress staje się coraz potężniejszy, zwłaszcza dzięki najnowszym aktualizacjom edytora bloków. Niezależnie od tego, czy dostosowujesz pasek boczny, stopkę, czy jakikolwiek obszar widżetów, możesz teraz tworzyć piękne, funkcjonalne widżety bez dotykania ani jednej linii kodu.
W tym przewodniku pokażemy Ci dokładnie, jak używać edytora wizualnego do tworzenia widżetów dla Twojej witryny WordPress.

Dlaczego warto używać edytora wizualnego do tworzenia widżetów w WordPressie?
Widżety pozwalają dodawać bogatą treść poza głównym obszarem strony i postów. Każdy motyw WordPress jest inny, ale zazwyczaj można dodawać widżety do obszarów takich jak stopka, nagłówek i pasek boczny.
Wiele witryn używa tych obszarów do wyświetlania sekcji „O nas”, wyświetlania najpopularniejszych postów, dodawania formularza zapisu do newslettera e-mail i nie tylko.
WordPress pozwala dodawać szeroką gamę bloków do każdego obszaru gotowego na widżety, a wiele wtyczek WordPress dodaje również własne bloki.
Na przykład, jeśli używasz Smash Balloon Twitter Feed, możesz osadzić ostatnie tweety w dowolnym obszarze gotowym na widżety, używając bloku Twitter Feed z wtyczki.

Czasami jednak możesz chcieć stworzyć niestandardowy widżet, który wyświetla odwiedzającym bogate treści multimedialne. Na przykład możesz chcieć przesłać zdjęcie swojego autora, a następnie użyć go do stworzenia widżetu biografii autora, wraz z linkami do Twoich różnych profili w mediach społecznościowych.
Biorąc to pod uwagę, zobaczmy, jak możesz użyć edytora wizualnego do tworzenia niestandardowych widżetów w WordPress. Po prostu użyj poniższych linków, aby przejść do metody odpowiedniej dla Twojego motywu:
- Metoda 1: Używanie wtyczki Widget Options (działa ze wszystkimi motywami WordPress)
- Metoda 2: Korzystanie z edytora całych witryn (działa z motywami WordPress obsługującymi bloki)
- Najczęściej zadawane pytania
Metoda 1: Używanie wtyczki Widget Options (działa ze wszystkimi motywami WordPress)
Najprostszym sposobem na stworzenie niestandardowego widżetu jest użycie wtyczki Widget Options.
Dodaje ona wiele dodatkowych ustawień do standardowego edytora wizualnych widżetów WordPress, w tym możliwość wyświetlania różnych widżetów w zależności od roli użytkownika, ukrywania widżetów WordPress na urządzeniach mobilnych i nie tylko.
Dodaje również widżet Tekst, który możesz dostosować za pomocą własnych linków, obrazów, formatowania i nie tylko. Pozwala to na stworzenie niestandardowego widżetu bez konieczności pisania kodu.
Najpierw musisz zainstalować i aktywować wtyczkę Widget Options. Aby uzyskać więcej informacji, zobacz nasz przewodnik krok po kroku jak zainstalować wtyczkę WordPress.
Po aktywacji przejdź do strony Wygląd » Widżety w swoim panelu administracyjnym WordPress.

Zobaczysz teraz listę wszystkich obszarów gotowych na widżety w Twoim motywie WordPress. Widoczne opcje mogą się różnić w zależności od motywu.
Zobaczysz również wszystkie widżety, które możesz dodać do swojej witryny. W tym przewodniku użyjemy widżetu Tekst, więc po prostu przeciągnij i upuść go na dowolny obszar gotowy na widżety.

Zobaczysz teraz małe okienko.
To okno dialogowe jest zasadniczo mini-edytorem strony lub posta, więc powinno wyglądać znajomo.

Na początek możesz wpisać tytuł, który pojawi się nad widżetem.
Następnie możesz wpisać tekst bezpośrednio w małym edytorze, dodać linki i obrazy, zmienić formatowanie, dodać punkty wypunktowane i listy numerowane, i wiele więcej.

Możesz również pokazywać lub ukrywać widżety na konkretnych stronach WordPress oraz dodawać niestandardowe style do widżetów WordPress.
Gdy będziesz zadowolony z konfiguracji widżetu, kliknij link „Gotowe”, aby zapisać jego ustawienia.
Teraz, jeśli odwiedzisz swoją witrynę, zobaczysz nowy widżet bogatego tekstu na żywo.

Jeśli wolisz, możesz zbudować niestandardowy widżet wizualnie za pomocą narzędzia Dostosowywanie WordPress.
Po prostu przejdź do Wygląd » Widżety, ale tym razem kliknij „Zarządzaj z podglądem na żywo”.

Otworzy to narzędzie Dostosowywanie z już wybranymi ustawieniami widżetu.
Teraz możesz kliknąć obszar, w którym chcesz dodać niestandardowy widżet.

Następnie kliknij „Dodaj widżet”, co otworzy panel pokazujący wszystkie dostępne widżety.
Po prostu znajdź „Tekst” i kliknij go, aby dodać do swojej witryny.

Otwiera to mały edytor, w którym można dodawać tekst, linki, multimedia i inne elementy.
W miarę wprowadzania zmian w edytorze, podgląd na żywo będzie automatycznie aktualizowany.

Gdy będziesz zadowolony z wyglądu widżetu, kliknij przycisk „Opublikuj”, aby udostępnić go na swoim blogu lub stronie internetowej WordPress.
Jeśli nie możesz znaleźć narzędzia do dostosowywania motywu w swoim panelu WordPress, zapoznaj się z naszym przewodnikiem na temat jak naprawić brakujący moduł dostosowywania motywu w panelu administratora WordPress.
Metoda 2: Korzystanie z edytora całych witryn (działa z motywami WordPress obsługującymi bloki)
Jeśli używasz motywu WordPress z obsługą bloków, możesz dodawać bloki do dowolnego obszaru gotowego na widżety, korzystając z edytora pełnej witryny.
W ten sposób możesz tworzyć niestandardowe widżety, układając standardowe bloki WordPress w obszarze gotowym na widżety, takim jak pasek boczny. Nie musisz też instalować osobnego wtyczki WordPress.
Jest to również sposób na dodawanie widżetów do obszarów, których nie można edytować za pomocą standardowego edytora widżetów WordPress ani narzędzia dostosowywania. Na przykład, możesz dodawać widżety do swojego szablonu strony 404.
Aby rozpocząć, przejdź do Wygląd » Edytor w panelu administracyjnym WordPress.

Domyślnie edytor pełnej witryny wyświetla szablon strony głównej Twojego motywu, ale możesz dodawać widżety i bloki do dowolnego obszaru.
Aby zobaczyć wszystkie dostępne opcje, po prostu wybierz „Szablony” lub „Części szablonu”.

Teraz możesz kliknąć na szablon lub część szablonu, którą chcesz edytować.
WordPress wyświetli teraz podgląd projektu. Aby przejść do edycji tego szablonu, kliknij małą ikonę ołówka.

Po wykonaniu tej czynności kliknij niebieską ikonę „+”, a następnie znajdź pierwszy blok, którego chcesz użyć w swoim niestandardowym widżecie.
Możesz użyć dowolnej kombinacji bloków, ale jeśli planujesz użyć obrazu i tekstu, zalecamy rozpoczęcie od bloku Media i tekst.
Pozwala to łatwo ułożyć obraz obok tekstu w ładnym układzie. Mając to na uwadze, blok Media i tekst jest idealny do tworzenia pola informacyjnego autora, jak widać na poniższym obrazku.

Po wybraniu bloku, którego chcesz użyć, po prostu przeciągnij i upuść go na obszar gotowy na widżety, taki jak pasek boczny i stopka.
Edytor pełnej witryny daje dostęp do pełnego zestawu narzędzi i ustawień WordPress. Oznacza to, że możesz dodać przycisk wezwania do działania, tekst, linki, obrazy i inne treści do szerszego zakresu bloków.

Mając to na uwadze, powinieneś być w stanie stworzyć dokładnie taki widżet, jaki miałeś na myśli. Po prostu dodaj więcej bloków i treści do obszaru gotowego na widżety, aż będziesz zadowolony z wyglądu.
Aby uzyskać więcej pomysłów na wykorzystanie obszarów gotowych na widżety w Twoim motywie, zapoznaj się z naszą listą kontrolną rzeczy do dodania do stopki na Twojej stronie WordPress.
Gdy będziesz zadowolony z dokonanych zmian, kliknij „Zapisz”.

Teraz, jeśli odwiedzisz swoją witrynę WordPress, zobaczysz nowy niestandardowy widżet na żywo.
Najczęściej zadawane pytania
Oto kilka pytań, które nasi czytelnicy często zadają na temat tworzenia widżetów za pomocą edytora wizualnego:
Czy potrzebuję zainstalować wtyczkę, aby tworzyć widżety wizualnie?
Nie zawsze. Jeśli używasz motywu blokowego, możesz dodawać widżety za pomocą Edytora Pełnej Witryny bez dodatkowych wtyczek.
Jednakże, jeśli Twój motyw nie obsługuje edytora całych witryn, użycie wtyczki takiej jak Widget Options daje Ci większą kontrolę nad tym, gdzie i jak pojawiają się Twoje widżety.
Dlaczego nie widzę od razu zmian w moim widżecie?
Jeśli Twój widżet nie aktualizuje się natychmiast, spróbuj wyczyścić pamięć podręczną witryny i pamięć podręczną przeglądarki. Niektóre wtyczki buforujące lub sieci CDN mogą opóźniać zmiany.
Korzystanie z opcji Podglądu na żywo to dobry sposób na potwierdzenie aktualizacji widżetu przed publikacją.
Czy mogę dodawać niestandardowe bloki wtyczek (takie jak Smash Balloon lub WPForms) w obszarze widżetu?
Absolutnie. Większość nowoczesnych wtyczek, takich jak Smash Balloon, WPForms czy MonsterInsights, zawiera własne bloki, które można umieścić w dowolnym obszarze gotowym na widżety.
Możesz przeciągać te bloki do swojego paska bocznego, stopki lub nagłówka, tak jak każdy inny blok.
Jaka jest różnica między używaniem wtyczki Widget Options a edytorem całych stron?
Wtyczka Widget Options działa ze wszystkimi motywami, w tym ze starszymi, które nie obsługują FSE.
Edytor Pełnej Witryny działa tylko z motywami obsługującymi bloki i oferuje większą elastyczność projektowania, ponieważ można wizualnie edytować nagłówki, stopki i szablony.
Mamy nadzieję, że ten artykuł pomógł Ci dowiedzieć się, jak łatwo korzystać z edytora wizualnego dla widżetów WordPress. Możesz również zapoznać się z naszym przewodnikiem po wskazówkach dotyczących opanowania edytora treści WordPress oraz jak stworzyć stronę docelową za pomocą WordPress.
Jeśli podobał Ci się ten artykuł, zasubskrybuj nasz kanał YouTube po samouczki wideo WordPress. Możesz nas również znaleźć na Twitterze i Facebooku.

Max
Dzięki za to.
Jest to szczególnie przydatne dla niektórych deweloperów motywów premium, takich jak StudioPress. Cała strona główna motywu jest zbudowana na widżetach. Więc ta technika zadziałałaby naprawdę dobrze.
Ryan Love
Możesz również użyć widżetu Black Studio TinyMCE – http://wordpress.org/plugins/black-studio-tinymce-widget/
Robi to samo, ale pozwala zrobić to w obszarze widżetów i oznacza, że nie musisz mieć kolejnego elementu w swoim pasku bocznym.
Hidayat Mundana
Jak mogę dodać widżety stopki w drugim miejscu, tuż pod stopką (widżet stopki powinien być pełnej szerokości)
Czy istnieje wtyczka, której można by użyć?
Wsparcie WPBeginner
Większość motywów ma zdefiniowane kolumny dla widżetów stopki, takie jak trzy lub cztery, po czym nowe widżety są umieszczane poniżej. Jeśli w Twoim motywie tak nie jest, być może będziesz musiał zdefiniować nowy obszar widżetu.
Admin
Twoje prawdziwe imię
Andor i WPBeginner, dziękuję bardzo za te wskazówki. Często widziałem widżety, które wyglądały świetnie i myślałem, że będę musiał znać kod, aby zrobić coś podobnego. Dzięki tym wskazówkom (nie wiem, czy użyję wtyczki, czy wskazówki Andora) wiem teraz, jak tworzyć fajne widżety bez kodowania.
Dzięki!
Martin
Karen
Niesamowite!!! Zawsze dajecie mi najlepsze informacje we właściwym czasie, dokładnie wtedy, kiedy ich potrzebuję!! xx
Andor Nagy
Hi,
Nice tutorial, but there’s a much easier way to do this. You simply make the look in the post editor, then you choose the text tab instead of the visual, and copy the html code into a text widget. And it requires no plugin.
Pozdrawiam,
Andor Nagy
Wsparcie WPBeginner
Tak, i masz rację, to by zadziałało. Ale zasadniczo jest to dla użytkowników, którzy tworzą dla klientów. Teraz, jeśli powiedziałbyś klientom, że mogą używać edytora wizualnego w postach, to by ich zdezorientowało. Ten plugin zapewnia interfejs użytkownika z innym nazewnictwem, aby zrobić dokładnie to, co zasugerowałeś powyżej.
Admin