Tworzenie układów wielokolumnowych kiedyś wymagało znajomości HTML lub pomocy programisty, ale już nie. ✨
Dzięki naszym testom funkcji edycji treści WordPressa znaleźliśmy przyjazny dla użytkownika sposób na podzielenie treści na kolumny bez dotykania kodu.
Te układy mogą sprawić, że Twoje posty będą łatwiejsze do czytania i bardziej atrakcyjne wizualnie, zwłaszcza podczas porównywania funkcji, wymieniania zalet i wad lub porządkowania dużych bloków tekstu.
W tym przewodniku podzielimy się najprostszymi metodami, które odkryliśmy do dodawania treści wielokolumnowych do Twoich postów na WordPressie.
💡Szybka odpowiedź: Jak dodać treść wielokolumnową w WordPressie
Oto szybki przegląd metod, które omówimy w celu dodania kolumn do Twoich postów i stron na WordPressie.
- Korzystanie z edytora bloków: Najprostsza metoda polega na użyciu wbudowanego bloku „Kolumny” do tworzenia układów bez żadnych wtyczek.
- Korzystanie z edytora klasycznego: Dla użytkowników nadal korzystających ze starszego edytora pokażemy, jak używać wtyczki Column Shortcodes do dodawania układu siatki.
Dlaczego dodawać treści wielokolumnowe w WordPressie?
Głównym powodem dodawania treści wielokolumnowych jest uczynienie Twoich postów bardziej czytelnymi i wizualnie zorganizowanymi, co pomaga utrzymać zaangażowanie czytelników.
Chociaż układy jednokolumnowe są powszechne w Internecie, układy siatki są potężnym narzędziem do poprawy doświadczenia użytkownika. Oto kluczowe korzyści z używania układu wielokolumnowego w WordPressie:
- Poprawia czytelność: Podobnie jak gazety i magazyny, kolumny dzielą długie linie tekstu, ułatwiając odwiedzającym czytanie i szybkie skanowanie treści.
- Lepsza organizacja: Są idealne do organizowania informacji obok siebie. Jest to idealne rozwiązanie do porównywania produktów, list zalet i wad lub pokazywania obrazów obok opisów tekstowych.
- Wyróżnia kluczowe informacje: Możesz użyć układu kolumn, aby zwrócić uwagę czytelnika na najważniejsze części Twojego artykułu.
- Zwiększa zaangażowanie: Ułatwiając przyswajanie treści, tworzysz lepsze doświadczenie użytkownika. Może to zachęcić odwiedzających do dłuższego pozostawania na Twojej stronie.
Niemniej jednak zobaczmy, jak możesz dodawać treści wielokolumnowe w edytorze blokowym i klasycznym. Możesz po prostu kliknąć poniższe linki, aby przejść do metody, której chcesz użyć:
- Dodawanie treści wielokolumnowej w edytorze bloków WordPress – łatwy sposób
- Dodawanie wielu kolumn w starym edytorze klasycznym WordPressa
- Często zadawane pytania dotyczące dodawania treści wielokolumnowych w WordPress
Dodawanie treści wielokolumnowej w edytorze bloków WordPress – łatwy sposób
Tworzenie treści wielokolumnowych, znanych również jako treści w kolumnach siatki w WordPress, jest teraz łatwe, ponieważ jest to domyślna funkcja. Edytor bloków WordPress zawiera blok Kolumny.
Aby dodać układ wielokolumnowy, musisz utworzyć nowy wpis lub edytować istniejący. Po wejściu do edytora treści kliknij ikonę „+” na górze, aby dodać blok.
Next, you need to select the Columns block in the ‘Design’ tab.
Następnie musisz wybrać liczbę kolumn i układ, którego chcesz użyć dla swojego wpisu na blogu.
WordPress pokaże Ci różne opcje do wyboru. Na przykład możesz wybrać układ kolumn 50/50, użyć układu 33/66 i więcej.
Po wybraniu układu możesz dodawać bloki do swoich kolumn. Blok Kolumny pozwala na dodawanie bloków wewnątrz każdej kolumny.
For example, you can select the Paragraph block and add content to it.
Ustawienia bloku będą również widoczne w prawej kolumnie ekranu edycji wpisu w panelu ustawień. Tutaj możesz edytować szerokość kolumn.
Oprócz tekstu, w kolumnach WordPress można również dodawać obrazy i osadzać filmy.
Po prostu najedź kursorem myszy na jedną z kolumn i kliknij przycisk „+”, aby dodać blok. Blok można również dodać, wpisując „/”, a następnie nazwę bloku.
Na przykład dodaliśmy obraz w jednej kolumnie, a tekst w drugiej.
Dodawanie wielu kolumn w starym edytorze klasycznym WordPressa
Jeśli nie zaktualizowałeś swojego WordPress do Gutenberga i nadal używasz Klasycznego Edytora, będziesz musiał zainstalować osobną wtyczkę do tworzenia układu kolumn siatki.
Najpierw zainstaluj i aktywuj wtyczkę Column Shortcodes. Szczegółowe instrukcje znajdziesz w naszym przewodniku krok po kroku na temat jak zainstalować wtyczkę w WordPress.
📌 Zastrzeżenie: Pamiętaj, że wtyczka nie została przetestowana z najnowszą wersją WordPress. Jednakże, gdy testowaliśmy ją na naszej stronie demonstracyjnej, działała poprawnie. Jeśli nadal masz wątpliwości, zapoznaj się z naszym przewodnikiem dla początkujących na temat korzystania z przestarzałych wtyczek.
Upon activation, you can create a new post or edit an old one. Once you are in the classic editor, simply click on the ‘[ ]’ button in the toolbar.
Wtyczka wyświetli teraz listę skrótów kolumn dla Twojego wpisu na blogu.
Możesz wybrać dowolny układ, który chcesz dodać do swojego bloga WordPress. Istnieją również opcje edycji odstępów między kolumnami.
Po wybraniu skróconego kodu, automatycznie pojawi się on w klasycznym edytorze. Na przykład, w tym samouczku wybraliśmy skrócony kod „połowa”.
Następnie możesz wprowadzić swoją treść między shortcode'y.
Następnie możesz ponownie kliknąć ikonę shortcode’u „[ ]”, aby dodać kolejny shortcode kolumny.
Dodajmy skrót 'połowa (ostatni)', aby wyświetlić dwie kolumny obok siebie. Stąd wystarczy dodać swoją treść do drugiej kolumny.
Po tym możesz wyświetlić podgląd swojego wpisu i opublikować go.
Oto jak to wyglądało na naszej stronie testowej.
Często zadawane pytania dotyczące dodawania treści wielokolumnowych w WordPress
Oto kilka pytań, które nasi czytelnicy często zadawali na temat dodawania treści wielokolumnowych na swoich stronach internetowych:
Jak wyglądają kolumny WordPress na urządzeniach mobilnych?
WordPress automatycznie się tym zajmuje. Na mniejszych ekranach, takich jak telefony komórkowe, kolumny będą ułożone pionowo jedna nad drugą.
Ten responsywny projekt zapewnia, że Twoje treści są zawsze czytelne i przyjazne dla użytkownika, niezależnie od urządzenia.
Czy mogę dostosować szerokość poszczególnych bloków kolumn WordPress?
Tak. Aby dostosować szerokość, kliknij, aby wybrać pojedynczy blok Kolumny (nie nadrzędny kontener „Kolumny”). W panelu ustawień bloku po prawej stronie możesz określić wartość szerokości.
Możesz używać procentów (%), pikseli (px) i innych jednostek internetowych dla precyzyjnej kontroli.
Co jeśli potrzebuję bardziej zaawansowanych opcji układu?
Domyślny blok Kolumny jest doskonały dla większości prostych układów. Jednak jeśli potrzebujesz bardziej zaawansowanej kontroli nad odstępami, wyrównaniem, ustawieniami responsywności lub chcesz tworzyć bardziej złożone projekty siatki, najlepszym rozwiązaniem jest wtyczka do tworzenia stron.
Zalecamy użycie narzędzia takiego jak SeedProd dla pełnej swobody projektowania metodą przeciągnij i upuść.
Mamy nadzieję, że ten artykuł pomógł Ci dowiedzieć się, jak dodawać treści wielokolumnowe w postach i stronach WordPressa. Możesz również zapoznać się z naszym prostym przewodnikiem na temat jak dodać listę kontrolną wpisu na blogu do edytora WordPressa oraz naszym tutorialem na temat jak dodawać szablony treści w WordPressie.
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.
Jiří Vaněk
Świetnie, w końcu wiem, jak to zrobić również w Gutenberg. Właściwie dlatego przeszedłem na Elementor, ponieważ uważałem Gutenberga za mało intuicyjnego. Może po prostu byłem zbyt leniwy, żeby się go nauczyć. Jednak w Elementorze od razu zrozumiałem i znalazłem tę funkcję. Teraz wiem, jak sobie poradzić również z Gutenbergiem :). Dzięki!
Ralph
Dziękuję! Z twoim przewodnikiem było to naprawdę proste. Użycie 3 kolumn z pewnością sprawi, że część moich treści będzie wyglądać lepiej niż nudna ściana tekstu.
Wsparcie WPBeginner
Cieszymy się, że nasz przewodnik mógł pomóc!
Admin
Nishant Kumar
Naprawdę bardzo pomocne. Nie wiedziałem, jak dodać sekcję kolumnową na blogu WordPress. Teraz już wiem.
Wsparcie WPBeginner
Glad our guide could help
Admin
Matt
Witaj – dzięki za ten post, naprawdę pomocny post. Jedno szybkie pytanie – czy tekst jest automatycznie przypisywany do każdej z (dwóch) kolumn, aby zapewnić, że kolumny będą miały tę samą wysokość na stronie, czy jest to coś, co musisz testować/zarządzać podczas wprowadzania tekstu?
Wsparcie WPBeginner
Musiałbyś ręcznie upewnić się, że Twoja treść ma taką samą lub podobną długość, jeśli tego byś chciał.
Admin
Sir Newton
Proszę, jak mogę sprawić, aby moja strona e-commerce wyświetlała dwukolumnowy widok produktów na urządzeniach mobilnych.
Dziękuję
Wsparcie WPBeginner
W celu modyfikacji wyglądu strony sklepu należy skontaktować się z pomocą techniczną motywu lub używanego wtyczki e-commerce.
Admin
Stuart
Cześć – potrzebuję 11 kolumn. Czy jest sposób, aby przekroczyć to, co uważam za maksimum (10)?
Wsparcie WPBeginner
Obecnie nie mamy zalecanej metody na uzyskanie 11 kolumn szerokości. W zależności od tego, co chcesz wyświetlić, możesz rozważyć utworzenie tabeli zamiast kolumn.
Admin
Caite Adamek
Czy jest sposób na automatyczne przenoszenie kolumn? Kiedy ustawiałem moje 2 kolumny, umieściłem obrazy w pierwszej kolumnie, a następnie tekst w drugiej. Zauważyłem, że wersja mobilna nie może wyświetlać 2 kolumn obok siebie, więc obrazy są wyświetlane najpierw, a potem tekst. Chciałbym, aby tekst był wyświetlany najpierw, a potem obrazy. Czy muszę przepisywać wszystko, czy jest jakiś sprytny sposób na zamianę zawartości 2 kolumn?
Wsparcie WPBeginner
Na razie nie, możesz utworzyć obszar dwukolumnowy poniżej miejsca, w którym masz go obecnie, i umieścić tam treść tak, jak chcesz, a następnie usunąć oryginał.
Admin
Kimberly Kelley
Używając wielokolumnowych (2) kolumn, filmy nakładają się na siebie. Czy jest jakiś sposób na dostosowanie maksymalnej szerokości filmów, ponieważ jedynym sposobem, w jaki mogę je dodać, jest adres URL, a nie kod osadzania.
Wsparcie WPBeginner
Możesz sprawdzić, czy filmy nie nakładają się na siebie, gdy nie są wyświetlane w edytorze, w przeciwnym razie możesz przejrzeć sekcję zaawansowanego CSS i ustawić szerokość za pomocą tego selektora: https://www.wpbeginner.com/glossary/css/
Admin
Nicole
Czy jest jakiś sposób na pionowe wyśrodkowanie elementów w kolumnie za pomocą nowych bloków/edytora Gutenberg? Na przykład, chciałbym mieć pionowo wyśrodkowany obraz po lewej stronie i tekst po prawej. Powiedzmy 30 linii tekstu i obraz o wysokości 200 px – czy jest na to łatwiejszy sposób niż ręczne wstawianie i dopasowywanie rozmiaru bloków-separatorów?
Wsparcie WPBeginner
For what it sounds like you’re wanting, you may want to use the media and text block rather than the columns block.
Admin
Rob Tait
Cześć
Jak napisać w 1 kolumnie, potem w 2 kolumnach dla następnego akapitu, a potem z powrotem do 1 kolumny dla 3. akapitu?
Any help much appreciated?
Thanks
Rob
Ashish
Dlaczego nie możemy po prostu użyć Elementora lub innej wtyczki do tworzenia stron? Jest znacznie łatwiejszy w użyciu z tak wieloma dodatkowymi funkcjami.
dimiter kirov
Ta wtyczka nie była aktualizowana od 3 lat, a na dodatek nie działa z wtyczką Gutenberg
Jenny
Witaj,
Próbowałem dodać kolumny do jednej z moich stron i przycisk Zaawansowana kolumna się nie pojawił. Sprawdziłem moje wtyczki i pokazało, że są zainstalowane. Czy wiesz, co może być problemem?
Dziękuję!
Jenny
Rob Tait
Musisz zainstalować zaawansowany edytor wizualny, taki jak TIny MCE, aby zobaczyć przycisk. Nie wyświetli się on w standardowym domyślnym edytorze wizualnym. Miałem ten sam problem, ale teraz się pokazuje po zainstalowaniu powyższego, który jest darmowy.
Mam nadzieję, że to pomoże
Rob
Dennis
Świetnie. Dokładnie tego szukałem i wreszcie ktoś, kto potrafi wszystko wyjaśnić krok po kroku.
Heather
Zainstalowałem wtyczkę i ją aktywowałem. Wyświetla się jako „aktywna”. Mimo to nie ma przycisku. Jak mogę to rozwiązać? Wiem już, jak zainstalować wtyczkę, więc to rozwiązanie nie ma zastosowania.
Kirk
Zainstalowałem wtyczkę z podstawowym darmowym motywem, a przycisk kolumny nigdy nie pojawił się w moim edytorze stron. Wiem, że nie jesteś twórcą wtyczki, chciałem tylko podzielić się naszym doświadczeniem.
om zho
po wklejeniu z edytora tekstu, odstępy między wierszami są dziwne, ponieważ nie ma opcji „czystego formatowania” dla zaawansowanych kolumn WP... jak można to naprawić?
Martine S.
Hej, to brzmi świetnie! Ale jak to będzie wyglądać na telefonach? Używam podobnego wtyczki, aby mieć dwie kolumny, jedną dla norweskiego i jedną dla angielskiego. Ale kiedy ludzie czytają mojego bloga przez telefon, druga kolumna pojawia się zaraz po pierwszej, więc wygląda to jak pełny tekst – w dwóch różnych językach!
Joe Nelo
Jakiej wtyczki używasz do wyświetlania dwóch kolumn tekstu? Próbuję zrobić to samo dla angielskiego i esperanto.
Elizabeth
Jak aktywować wtyczkę??
Wsparcie WPBeginner
Hej Elizabeth,
Zapoznaj się z naszym przewodnikiem krok po kroku jak zainstalować wtyczkę WordPress.
Admin
PB
Czy jest sposób, aby tekst w tych kolumnach wyświetlał się jako lista, tj. ze sztywnymi łamaniami linii między elementami, a nie jako jeden blok tekstu?
Z góry dziękuję za radę
Steve Elliott
Czy jest sposób, aby nadać tym kolumnom kolor tła?
Bhagyashree barlingay
Nie mogę kopiować/wklejać materiałów, które już napisałem, do tych kolumn.
Naveed
Używam wersji WordPress 4.5, ale ta wtyczka nie jest kompatybilna z moim motywem. Czy mogę użyć tej wtyczki do mojego motywu??
ik
Czy można dodać obrazy do każdej kolumny? Albo czy można dodać przyciski akcji do każdej kolumny?
Wsparcie WPBeginner
Tak.
Admin
Kate
Kolumny działają, ale podczas próby osadzenia WIDEO w kolumnach widać tylko tekst kodu...
Daniel Speraw
Wygląda dobrze, gdy do posta dodawane są kolumny, ale gdy patrzę na opublikowany wpis, wróciła jedna wyśrodkowana kolumna. Próbowałem wielokrotnie i w dwóch przeglądarkach. Jakieś sugestie?
To zdecydowanie najłatwiejszy plugin. NAPRAWDĘ chcę go używać.
Wielkie dzięki,
Daniel
Meshellklip
Czy można dodać obrazy do każdej kolumny? Albo czy można dodać przyciski akcji do każdej kolumny?
Sri Harsha Chilakapati
Cześć,
Moja strona używa responsywnego motywu Customizr i nie chcę tracić tej responsywności. Czy mogę dodać responsywne kolumny za pomocą tej wtyczki?
Chris Xphstos
Ηι!
Czy jest sposób na prezentację układu z kolumnami, ale nie jednym postem z 2-3-4 kolumnami itp.?
Każda kolumna na stronie będzie osobnym postem. Coś w stylu Układu Bloga w Joomla...
Wsparcie WPBeginner
W tym celu warto poszukać motywu WordPressa z wieloma kolumnami, jest wiele takich motywów.
Admin
Karen
Dziękuję! Chciałem się tego nauczyć od jakiegoś czasu – wszystko jest teraz w porządku! xx
Debra Torres
Tego właśnie potrzebowałem! Próbowałem używać tabel do kolumn i byłem tak sfrustrowany. Dziękuję, dziękuję, dziękuję!
Mark Corder
Muszę powiedzieć – jeśli musisz regularnie używać wielu kolumn, wygląda to na świetne rozwiązanie, nawet jeśli ZNASZ HTML/CSS! Podoba mi się fakt, że dodali punkt przerwania w Opcjach, aby dostosować się do responsywnych projektów…