Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
Puchar WPB
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

Jak wyświetlać widżety WordPress w kolumnach

Uwaga redakcyjna: Otrzymujemy prowizję z linków partnerskich na WPBeginner. Prowizje nie mają wpływu na opinie i oceny naszych redaktorów. Dowiedz się więcej o Proces redakcyjny.

Czy próbujesz wyświetlać widżety WordPress w kolumnach?

Widżety umożliwiają dodawanie dynamicznych treści do obszarów, których nie można edytować za pomocą standardowego edytora treści WordPress. Często widżety dodaje się do panelu bocznego, ale można je wyświetlać w innych obszarach w wielu kolumnach.

W tym artykule pokażemy, jak łatwo wyświetlać widżety WordPress w kolumnach.

Displaying WordPress widgets in columns

Dlaczego warto wyświetlać widżety WordPress w kolumnach?

Widżety to świetny sposób na dodanie galerii obrazków, kanałów mediów społecznościowych, kalendarzy, losowych cytatów, popularnych wpisów i innych dynamicznych treści do twojej witryny internetowej WordPress.

Jeśli jednak dodasz wiele widżetów, może to zacząć wyglądać na zagmatwane i zagracone.

Jeśli tak się stanie, zalecamy zorganizowanie twoich widżetów w kolumny. Pozwala to na wyświetlanie dużej ilości treści w uporządkowany sposób. Możesz nawet dodać podtytuły do kolumn, aby pomóc odwiedzającym szybciej znaleźć to, czego szukają.

Mając to na uwadze, zobaczmy, jak można wyświetlać widżety w kolumnach. Skorzystaj z poniższych odnośników, aby przejść bezpośrednio do wybranej metody:

Niektóre motywy WordPress mają w stopce wiele obszarów gotowych na widżety. W takim przypadku każdy obszar będzie wyświetlany jako osobna kolumna.

Jest to idealne rozwiązanie, jeśli chcesz wyświetlić listę informacji lub odnośników w stopce twojej witryny internetowej. Możesz na przykład wyświetlić swoje dane kontaktowe, listę wszystkich produktów w sklepie WooCommerce lub najważniejsze odnośniki w witrynie internetowej.

WPBeginner footer

Aby uzyskać więcej pomysłów, zapoznaj się z naszą listą kontrolną rzeczy, które można dodać do obszaru stopki WordPress.

Aby sprawdzić, czy twój motyw ma wiele obszarów gotowych na widżety w stopce, przejdź do Wygląd ” Widżety w kokpicie WordPress.

Tutaj poszukaj obszarów oznaczonych jako „Stopka” lub podobnie.

How to add columns to a widget-ready area in a WordPress theme

Powyższy motyw ma dwa obszary gotowe na widżety, więc możemy ich użyć do wyświetlania widżetów w kolumnach.

Wystarczy kliknąć, aby rozwinąć dowolny z tych obszarów i rozpocząć dodawanie widżetów, które chcesz wyświetlić. Aby uzyskać bardziej szczegółowe instrukcje, zapoznaj się z naszym przewodnikiem na temat dodawania i używania widżetów w WordPress.

Adding widgets to multiple footer areas in a WordPress theme

Po wykonaniu tej czynności kliknij, aby rozwinąć następny obszar stopki z widżetami, a następnie dodaj widżety, które chcesz wyświetlić w tej kolumnie.

Wystarczy powtórzyć te kroki dla każdego obszaru stopki.

Po zakończeniu dodawania widżetów nie zapomnij kliknąć przycisku „Aktualizuj”, aby zapisać twoje zmiany. Możesz teraz przejść na swoją witrynę internetową WordPress i przewinąć do stopki, aby zobaczyć twoje widżety uporządkowane w kolumnach.

An example of widgets, arranged into multiple columns

Metoda 2: Korzystanie z edytora stron i wpisów (działa ze wszystkimi motywami)

Inną opcją jest użycie domyślnego edytora bloków WordPress, aby dodać kolumny do twoich stron i wpisów. Pozwala to dokładnie kontrolować, gdzie widżety pojawiają się na twojej witrynie, w tym wewnątrz treści wpisów.

Jest to również dobra opcja, jeśli chcesz wyświetlać unikatowe widżety na każdej stronie.

Będziesz jednak musiał ręcznie dodać widżety do każdej strony i wpisu. To powiedziawszy, ta metoda może zająć dużo czasu, zwłaszcza jeśli chcesz wyświetlać te same widżety na każdej stronie.

Aby skorzystać z tej metody, otwórz stronę lub wpis, w którym chcesz dodać widżety w kolumnach. Następnie kliknij przycisk „+” i wpisz rodzaj „Kolumny”.

Adding columns to a page or post

Gdy pojawi się odpowiedni blok, przeciągnij go i upuść na twój układ.

Możesz teraz wybrać liczbę kolumn, które chcesz wyświetlić i ile miejsca ma zajmować każda kolumna.

Przykładowo, na poniższym obrazku tworzymy trzy kolumny, z których każda zajmuje 33% dostępnego miejsca.

Choosing from multiple column layouts in a WordPress blog or website

Po wykonaniu tej czynności kliknij ikonkę „+” w pierwszej kolumnie.

W wyświetlonym oknie wybierz widżet, który chcesz dodać do tej kolumny.

Adding a gallery to a column on your WordPress website or blog

Widżet można dostosować do własnych potrzeb za pomocą ustawień w menu po prawej stronie. Można na przykład zmienić kolor tła, dodać odnośniki lub zmienić wielkość litery.

Bloków można również używać do tworzenia podtytułów, list i innych treści. Może to dodać dodatkową strukturę i kontekst do twojego widżetu.

Adding widgets to multiple columns in WordPress

Wystarczy powtórzyć te kroki, aby dodać więcej widżetów do kolumn.

Gdy będziesz zadowolony ze sposobu ustawienia kolumn, kliknij „Aktualizuj” lub „Opublikuj”, aby kolumny i widżety stały się aktywne.

Metoda 3: Stworzenie własnego motywu WordPress (w pełni dostosuj)

Chociaż możliwe jest organizowanie i wyświetlanie widżetów w wielu kolumnach za pomocą wbudowanych narzędzi WordPress, czasami możesz potrzebować większej kontroli nad układem.

Możesz także dodać kolumny do pięknych stron docelowych lub stron sprzedaży, które mają całkowicie własny projekt.

W takim przypadku zalecamy użycie SeedProd.

SeedProd to najlepsza na rynku wtyczka do tworzenia stron WordPress, która pozwala zaprojektować twój motyw bez pisania ani jednej linii kodu. Oznacza to, że możesz dodać dowolną liczbę kolumn i widżetów do dowolnego obszaru twojej witryny internetowej.

SeedProd

SeedProd posiada również rosnącą bibliotekę profesjonalnych zestawów szablonów witryn, które możesz dodać do swojej witryny za pomocą jednego kliknięcia.

Najpierw należy zainstalować i włączyć wtyczkę SeedProd. Aby uzyskać więcej informacji, zobacz nasz przewodnik krok po kroku, jak zainstalować wtyczkę WordPress.

Uwaga: Istnieje darmowa wersja SeedProd, która pozwala tworzyć własne konfiguratory stron, w tym strony konserwacji i wkrótce dostępne, bez względu na twój budżet. Jednak w tym przewodniku będziemy używać wtyczki premium, ponieważ jest ona dostarczana z kreatorem motywów. Należy tylko pamiętać, że do korzystania z kreatora motywów potrzebny jest plan SeedProd Pro lub wyższy.

Po włączaniu przejdź do SeedProd ” Ustawienia i wpisz swój klucz licencyjny.

Verifying your SeedProd license

Informacje te można znaleźć na Twoim koncie w witrynie internetowej SeedProd. Następnie kliknij przycisk „Zweryfikuj klucz”.

Następnie przejdź do strony SeedProd ” Theme Builder i kliknij przycisk „Theme Template Kits”.

Creating a custom WordPress theme using SeedProd

Zobaczysz teraz bibliotekę zestawów witryny internetowej SeedProd.

Aby przyjrzeć się bliżej dowolnemu szablonowi, po prostu najedź na niego kursorem myszy, a następnie kliknij ikonkę lupy, gdy się pojawi.

Previewing a WordPress theme template design

Spowoduje to otwarcie zestawu szablonów w nowej karcie.

Ponieważ jest to kompletny zestaw witryny internetowej, można zobaczyć więcej stron i projektów, klikając na różne odnośniki, przyciski i pozycje menu.

How to preview a professionally-designed WordPress template kit

SeedProd oferuje zestawy szablonów dla różnych branż i nisz, takich jak witryny internetowe restauracji, blogi podróżnicze, firmy konsultingowe zajmujące się marketingiem i wiele innych.

Gdy znajdziesz zestaw szablonów, którego chcesz użyć, po prostu najedź na niego kursorem, a następnie kliknij ikonkę znacznika wyboru, gdy się pojawi.

Choosing a SeedProd template kit for your WordPress website

SeedProd doda teraz wszystkie różne szablony do kokpitu WordPress.

Aby przyjrzeć się bliżej, przejdź do SeedProd ” Kreator motywów. Możesz zobaczyć nieco inne opcje w zależności od używanego zestawu.

An example of a SeedProd website template kit

Po prostu najedź kursorem na szablon, w którym chcesz dodać kolumny widżetów, a następnie kliknij odnośnik „Edytuj projekt”.

Na przykład, jeśli chcesz wyświetlić kolumny widżetów w obszarze stopki, musisz edytować szablon Footer.

Customizing the footer design in a custom WordPress theme

Powoduje to wczytywanie edytora SeedProd z szablonem po prawej stronie ekranu.

Po lewej stronie zobaczysz menu z różnymi opcjami.

Designing a custom WordPress theme without writing code

Większość zestawów zawiera już wbudowane bloki. Aby dostosować blok, wystarczy kliknąć, aby wybrać go w podglądzie strony, a następnie wprowadzić zmiany w menu po lewej stronie.

Na przykład, jeśli chcesz zastąpić jakiś symbol zastępczy, musisz wybrać blok Tekst lub Nagłówek, a następnie wpisać rodzaj tekstu w małym edytorze tekstu.

Editing placeholder text in a custom website theme

Możesz również całkowicie zmienić wygląd zestawu za pomocą ustawień w menu po lewej stronie, w tym zmienić schemat kolorów, wybór pisma, kolor odnośników, przycisków i nie tylko.

Większość z tych ustawień nie wymaga wyjaśnień, więc warto wybrać różne bloki w twoim układzie, a następnie przejrzeć ustawienia.

Changing the color settings in a custom WordPress theme

Aby utworzyć twoje kolumny, przewiń do sekcji „Standard” w menu po lewej stronie.

Tutaj znajdź blok „Kolumna” i przeciągnij go na obszar, w którym chcesz ułożyć widżety w kolumny.

Adding columns to a page design using SeedProd

Możesz teraz wybrać liczbę kolumn, które chcesz utworzyć i ilość miejsca, jaką każda kolumna ma zajmować.

Aby to zrobić, wystarczy kliknąć układ, którego chcesz użyć.

Choosing a column layout for a custom page design

Teraz możesz zacząć dodawać widżety do twoich kolumn.

W menu po lewej stronie znajdź każdy widżet, a następnie przeciągnij go na kolumnę, w której chcesz go wyświetlić.

Adding multiple columns to a custom WordPress theme

Po dodaniu widżetu kliknij, aby wybrać go w podglądzie na żywo.

Następnie można użyć ustawień w menu po lewej stronie, aby dostosować własny widżet. Aby zobaczyć jeszcze więcej ustawień własnych konfiguratora, kliknij kartę „Zaawansowane”.

Adding advanced styles and effects to a WordPress theme using SeedProd

Można tu dodawać animacje CSS, zmieniać odstępy, dodawać obramowanie i nie tylko.

Po prostu powtórz te kroki, aby dodać więcej widżetów do twoich kolumn. Kiedy będziesz zadowolony z wyglądu twojej strony, kliknij przycisk „Zapisz”, aby zapisać zmiany.

Saving a custom page design using SeedProd

Teraz możesz kontynuować edycję reszty twojego motywu WordPress. Aby uzyskać więcej informacji, zapoznaj się z naszym kompletnym przewodnikiem na temat tworzenia własnego motywu WordPress dla początkujących.

Gdy jesteś zadowolony z konfiguracji szablonów, nadszedł czas, aby uruchomić zestaw.

W kokpicie WordPress przejdź do SeedProd ” Theme Builder i kliknij przełącznik „Włącz motyw SeedProd”, aby wyświetlił się „Tak”.

How to enable a custom SeedProd theme

Możesz teraz przejść na Twój blog WordPress lub witrynę internetową, aby zobaczyć nowy konfigurator motywu w działaniu.

Metoda 4: Korzystanie z edytora całej witryny (tylko motywy blokowe)

Jeśli korzystasz z motywu WordPress włączającego bloki, możesz dodać kolumny do dowolnego obszaru twojej witryny internetowej za pomocą edytora całej witryny.

Możesz nawet edytować obszary, których nie możesz zmienić za pomocą standardowego edytora treści WordPress. Na przykład, możesz dodawać widżety i kolumny do szablonu strony 404 twojej witryny.

Aby rozpocząć, przejdź do Wygląd ” Edytor w kokpicie WordPress.

Adding columns to your website using the full-site editor (FSE)

Domyślnie pełny edytor witryny wyświetla szablon główny twojego motywu, ale możesz dodawać kolumny i widżety do dowolnego obszaru.

Aby zobaczyć wszystkie dostępne opcje, wystarczy wybrać „Szablony” lub „Fragmenty szablonu”.

Adding widgets and columns to a WordPress template

Możesz teraz kliknąć szablon lub fragment szablonu, który chcesz edytować.

WordPress wyświetli teraz podgląd projektu. Aby przejść dalej i edytować ten szablon, kliknij małą ikonkę ołówka.

Adding columns to a block-enabled WordPress template

Po wykonaniu tej czynności kliknij niebieską ikonkę „+” i wpisz „Kolumny”.

Gdy pojawi się odpowiedni blok, przeciągnij go i upuść na twój projekt strony.

Adding columns to any area of your website using the full-site editor (FSE)

Możesz teraz wybrać układ, którego chcesz użyć.

Na przykład na naszych obrazkach używamy układu 33/33/33, który tworzy trzy kolumny, z których każda zajmuje 33% dostępnej szerokości.

Creating a structured layout using the WordPress full-site editor (FSE)

Po wykonaniu tej czynności kliknij niebieską ikonkę „+”, a następnie znajdź pierwszy widżet, którego chcesz użyć.

Następnie możesz po prostu przeciągnąć i upuścić ten widżet na kolumnę, w której chcesz go wyświetlić.

Adding blocks to a structured page layout in WordPress

W razie potrzeby można dostosować każdy blok za pomocą ustawień w menu po prawej stronie.

Wystarczy powtórzyć te kroki, aby dodać więcej widżetów do twoich kolumn.

An organized page layout, created using the full-site editor (FSE)

Gdy będziesz zadowolony ze zmian, kliknij „Zapisz”, aby je wprowadzić. Teraz, jeśli przejdziesz na swoją witrynę internetową WordPress, zobaczysz nowe widżety i kolumny w działaniu.

Bonus: Wyświetlaj zdjęcia WordPress w kolumnach

Jeśli masz witrynę fotograficzną, możesz również chcieć pokazać wszystkie twoje zdjęcia w schludnych kolumnach i wierszach.

Aby to zrobić, możesz użyć Envira Gallery, która jest najlepszą wtyczką do galerii WordPress na rynku. Pozwala ona stworzyć atrakcyjną galerię, w której wszystkie obrazki są uporządkowane w wierszach i kolumnach, aby wyglądać atrakcyjnie wizualnie.

Envira Gallery

Ponadto oferuje inne funkcje, takie jak wyskakujące okienka (okna) lightbox, znaki wodne, tekst alternatywny obrazka i wiele innych.

Po włączaniu wtyczki wystarczy przejść na stronę Envira Gallery ” Add New i kliknąć przycisk „Select files from other sources”, aby przesłać wszystkie twoje obrazki z biblioteki multimediów.

Add images to the gallery

Gdy to zrobisz, przewiń w dół do sekcji „Aktualnie w Twojej galerii” i przejdź do karty „Konfiguracja”.

Tutaj możesz wybrać różne układy i liczbę kolumn dla twoich obrazków w galerii, zgodnie z twoimi upodobaniami.

Choose gallery layout and number of columns

Po zakończeniu kliknij przycisk „Opublikuj” u góry, aby zapisać twoje ustawienia. Następnie musisz otworzyć wpis, w którym chcesz dodać swoje obrazki w wierszach i kolumnach i kliknąć przycisk „Dodaj blok” (+).

Spowoduje to otwarcie menu bloku. Teraz wystarczy przeciągnąć i upuścić blok Envira Gallery, a następnie wybrać utworzoną galerię obrazków z rozwijanego menu w bloku.

Add envira gallery block for watermarked images

Na koniec kliknij przycisk „Aktualizuj” lub „Opublikuj”, aby zapisać twoje ustawienia. Możesz teraz przejść na swoją witrynę WordPress, aby zobaczyć obrazki w wierszach i kolumnach.

Aby uzyskać więcej informacji, zapoznaj się z naszym poradnikiem na temat wyświetlania zdjęć WordPress w kolumnach i wierszach.

Mamy nadzieję, że ten artykuł pomógł ci dowiedzieć się, jak wyświetlać widżety WordPress w kolumnach. Możesz również zapoznać się z naszym przewodnikiem na temat tworzenia własnego kanału zdjęć Instagramu w WordPress ie lub z naszą ekspercką listą najlepszych wtyczek do mediów społecznościowych dla WordPressa.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

Ujawnienie: Nasze treści są wspierane przez czytelników. Oznacza to, że jeśli klikniesz na niektóre z naszych linków, możemy otrzymać prowizję. Zobacz jak WPBeginner jest finansowany, dlaczego to ma znaczenie i jak możesz nas wspierać. Oto nasz proces redakcyjny.

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

Najlepszy zestaw narzędzi WordPress

Uzyskaj BEZPŁATNY dostęp do naszego zestawu narzędzi - zbiór produktów i zasobów związanych z WordPressem, które każdy profesjonalista powinien mieć!

Reader Interactions

9 komentarzyZostaw odpowiedź

  1. Syed Balkhi says

    Hey WPBeginner readers,
    Did you know you can win exciting prizes by commenting on WPBeginner?
    Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
    You can get more details about the contest from here.
    Start sharing your thoughts below to stand a chance to win!

  2. Atiqullah Sadeqi says

    Hi,
    I need a widget to be able accept other widgets inside it self. Like creating a row and inside of the row we should put other widgets. it can be done?

    • WPBeginner Support says

      It would depend on your specific widgets but it sounds like you want to use a text widget.

      Administrator

  3. andrew says

    wordpress now warns the following: „This plugin hasn’t been updated in over 2 years. It may no longer be maintained or supported and may have compatibility issues when used with more recent versions of WordPress.”
    any alternatives?

  4. Raymond says

    Hi… This plugin is really awesome. However…I wonder if there’s a way to make this plugin responsive because if I shrink my browser to Iphone size, the columns wont rearrange to fit the small screen

Zostaw odpowiedź

Dziękujemy za pozostawienie komentarza. Pamiętaj, że wszystkie komentarze są moderowane zgodnie z naszymi polityka komentarzy, a Twój adres e-mail NIE zostanie opublikowany. NIE używaj słów kluczowych w polu nazwy. Przeprowadźmy osobistą i konstruktywną rozmowę.