Jak zrobić kolumny w wordpress bez wtyczki

Jak zrobić kolumny w wordpress bez wtyczki

Organizowanie treści w kolumny to bułka z masłem dzięki blokowi WordPress Columns. Ten blok należy do podstawowych bloków, które mogą być używane w każdym motywie WP. Blok kolumn może mieć do 6 kolumn. Możesz więc mieć 6 różnych treści obok siebie.

Dzisiaj pokażemy Ci, jak zrobić kolumny w WordPressie bez wtyczki – za pomocą bloku Kolumny. Przedstawiamy również podsumowanie nt najnowsze funkcje z wersji WP 5.3 aktualizacja.

W tym samouczku znajdziesz informacje o:

Jaki jest cel kolumn

Kolumny na stronie mogą mieć wiele zastosowań. Przede wszystkim mogą sprawić, że treść będzie dobrze ułożona, bardziej czytelna i łatwiejsza w przeglądaniu. Organizując zawartość w kolumny, możesz wyróżnić ważne informacje lub parametry.

Na przykład możesz użyć układu wielokolumnowego do zaprezentowania swoich usług. Dodaj tam zdjęcie poglądowe, opis lub przycisk. Możesz oczywiście sprawić, by obraz był klikalny.

Układ wielokolumnowy z usługami
Układ wielokolumnowy z usługami

Podobnie jak w przypadku usług, możesz użyć kolumn w WordPress, aby pokazać produkty lub kategorie produktów. Jest to idealne rozwiązanie, jeśli masz prostą witrynę biznesową.

Wielokolumnowy układ z produktami i kategoriami
Kolumny używane do wyświetlania produktów i kategorii

W postach na blogu możesz używać kolumn do oddzielania treści. Tekst, wypunktowania lub obrazy można umieszczać obok siebie.

Oddziel zawartość za pomocą kolumn
Używanie kolumn do oddzielania treści

Jak kolumny działały w starym edytorze

Przed WordPress 5+, jeśli chciałeś tworzyć treści wielokolumnowe, musiałeś używać tabel. Było to o wiele trudniejsze niż w najnowszym edytorze. Co więcej, zwykle występował problem ze stylami i wyświetlaniem tabel na urządzeniach mobilnych. Jak to kiedyś działało?

Masz wiele opcji tworzenia kolumn w witrynie WordPress:

1. Ręcznie wstaw kod HTML do edytora tekstu

<table>
  <tr>
    <td></td>
    <td></td>
  </tr>
</table>

To podejście było stosowane głównie przez programistów, którzy mogli szybko stworzyć tabelę lub kolumnę na podstawie swoich wymagań. Wadą było to, że nie wszystkie motywy WordPress dobrze radziły sobie z kolumnami. Tabele zwykle nie były idealne, a przeciętny użytkownik nie mógł łatwo rozwiązać wszystkich możliwych problemów.

2. Zezwalanie na tabele w edytorze WordPress

Ponieważ WordPress korzystał z edytora TinyMCE, możliwe było zezwolenie funkcjom na edycję tabel. Jeśli chcesz dowiedzieć się więcej, możesz znaleźć wszystkie szczegóły na tym forum. Jeśli zrobisz to samo dla naszych motywów AIT, tabele będą działać poprawnie.

3. Używanie elementu Columns w motywach AIT

Jeśli używasz jednego z naszych starszych motywów WordPress, z pewnością znasz nasz element Kolumny. Tego elementu można użyć do dodania kolumn wewnątrz stron. Jest to element, który można zamówić, co oznacza, że możesz go umieścić w dowolnym miejscu. Zaletą jest zmienność wewnątrz stron.

Element kolumn
Element do zamówienia Kolumny – możesz go użyć w dowolnym motywie AIT

4. Pobierz wtyczkę innej firmy, aby zarządzać tabelami

Innym rozwiązaniem na tworzenie kolumn w postach i stronach WordPress było pobranie jednej z dostępnych wtyczek do tworzenia tabel. Wtyczki te umożliwiają dodawanie kolumn/tabel za pomocą kilku kliknięć bez żadnego kodowania. Mogli z tego korzystać również mniej doświadczeni użytkownicy.

Jak zrobić kolumny w WordPress bez wtyczki (w edytorze bloków)

Dzięki nowemu edytorowi bloków tworzenie kolumn stało się niezwykle łatwe. Jeśli nadal używasz starego WordPressa, teraz jest właściwy czas na aktualizację do najnowszej wersji. Będziesz mógł łatwo dodawać kolumny i zarządzać nimi za pomocą kilku kliknięć za pomocą bloku kolumn.

Ten blok to mile widziana zmiana dla wszystkich, którzy chcą pracować z treścią wielokolumnową, prezentować produkty lub pisać bloga, a nie mają doświadczenia w programowaniu.

Przyjrzyjmy się, jak dodać blok Kolumny i jak tworzyć kolumny w WordPress bez wtyczki:

  • Pierwszą opcją jest kliknięcie na „+” na górnym pasku i wybranie bloku Columns z dostępnych bloków.
  • Drugą opcją jest kliknięcie „+” w dowolnym miejscu w edytorze.
Dodaj kolumny w WordPress, klikając „+”
Dodawanie kolumn w WordPress poprzez kliknięcie na „+”
Dodaj blok kolumn z ukośnikiem „/”
Dodawanie kolumn w WordPress za pomocą ukośnika „/”

Predefiniowane układy bloku kolumn WordPress (NOWOŚĆ od WP 5.3)

Najnowsza wersja przyniosła ogromne ulepszenia w ustawieniach kolumn. Przede wszystkim dostępne są domyślne style układu. Co to znaczy?

Użytkownicy mogą wybrać swój układ i styl wyrównania w procesie dodawania nowego bloku do obszaru zawartości. Predefiniowane układy mogą być bardzo pomocne – szczególnie dla tych użytkowników, którzy nie mają zaawansowanych umiejętności WordPress. Ta funkcja reprezentuje sposób, w jaki wyobrażamy sobie sposób tworzenia kolumn w WordPress (bez wtyczki lub innego dodatku).

Predefiniowane układy w bloku Kolumny
Predefiniowane opcje układów

 

Jeśli nie chcesz wybierać predefiniowanego układu w bloku WordPress Columns, po prostu go pomiń. Po pominięciu tego kroku treść zostanie rozdzielona na 2 takie same części/dwie oddzielne kolumny, które można edytować.

Utworzony blok kolumn
Blok kolumn z 2 domyślnymi obszarami (kolumnami), które możesz edytować

Kolumny Zablokuj podstawowe ustawienia

Sam blok kolumn WordPress nie ma wielu opcji. Dlaczego tak jest, wyjaśnimy później. Na górnym pasku możesz zmienić wyrównanie na szeroką lub pełną szerokość. Możesz zmienić to wyrównanie, jeśli jest obsługiwane przez aktywny motyw.

Górny pasek narzędzi bloku Kolumny
Górny pasek narzędzi z opcjami wyrównania

Najważniejszym ustawieniem bloku Kolumny jest liczba kolumn na pasku bocznym inspektora po prawej stronie. Domyślnie są 2 kolumny, ale możesz zwiększyć tę liczbę do 6. Możesz to zmienić myszką lub wpisać liczbę. Jak to wygląda, zobaczysz od razu po zwiększeniu lub zmniejszeniu kolumn. Blok zmienia się dynamicznie w zależności od suwaka.

Zmiana liczby kolumn
Poruszaj się suwakiem, aby zmienić liczbę kolumn według potrzeb

Jest to bardzo praktyczne, ponieważ zmieniasz liczbę kolumn dosłownie w kilka sekund bez żadnych trudnych zmian w ustawieniach lub kodowaniu.

Podobnie jak inne bloki w edytorze WordPress, możesz wstawić Custom CSS Class również do bloku Columns.

Dołączanie bloków dla płynniejszej pracy z blokami

Blok kolumn jest wyjątkowy, ponieważ można za jego pomocą tworzyć wiele bloków. Do czasu wydania nowej wersji praca z poszczególnymi blokami była dość trudna. Kiedy chciałeś dodać jakiś blok, nie wiedziałeś dokładnie, gdzie kliknąć. Dzięki aplikatorowi Block (i jego rozróżnianiu po kolorze tła) łatwiej jest wstawić treść do odpowiedniej kolumny.

Zablokuj program dołączający w bloku kolumn WordPress
Zablokuj appender z kolorem tła

Jak pracować z blokiem kolumn WordPress

Blok Beauty of Columns polega na tym, że każda kolumna może zagnieżdżać inne bloki. Może to być akapit, blok obrazu lub blok przycisków. Maksymalna liczba kolumn to 6, dlatego możesz tworzyć treści wielokolumnowe według potrzeb. Jak wspomniano wcześniej, aby zaprezentować produkty, możesz dodać zdjęcie produktu, nazwę, cenę i przycisk obok siebie.

Różne rodzaje treści w układzie wielokolumnowym
Dzięki blokowi Kolumny możesz prezentować różne rodzaje treści obok siebie

Możesz także użyć kilku bloków słupów jeden pod drugim, aby utworzyć siatkę. Możesz go użyć do zaprezentowania swoich usług lub promocji ważnych funkcji.

Efekt siatki bloku kolumn
Efekt siatki bloków kolumn umieszczonych jeden pod drugim

Edycja zagnieżdżonych bloków

Jak już wspomnieliśmy, w kolumnach można zagnieżdżać inne bloki. Każdy zagnieżdżony blok ma wszystkie dostępne ustawienia. Oznacza to, że jeśli dodasz blok obrazu do kolumny, możesz go edytować dokładnie w taki sam sposób, jak w wersji samodzielnej Blok obrazu.

Edycja bloku obrazu jako bloku zagnieżdżonego
Dostępne ustawienia bloku obrazu zagnieżdżonego w bloku kolumn

Wniosek: kolumny blokują zalety

Wydanie edytora bloków WordPress i dostępność korzystania z kolumn na stronach i postach znacznie uprościło sposób, w jaki użytkownicy mogą pracować z treścią. Dzięki blokadzie kolumn WordPress nie jest już ważne korzystanie z rozwiązań innych firm ani pisanie kodu HTML. Dodawanie lub usuwanie kolumn jest możliwe za pomocą kilku kliknięć. Wszystko jest bardzo intuicyjne i szybkie również dla mniej zaawansowanych użytkowników.

Twoja treść w układzie wielokolumnowym zostanie ładnie wyrównana do siatki. W wersji responsywnej też od razu będzie dobrze wyglądać.

Ciężko pracowaliśmy nad nowym motywem WordPress Citadela, który został specjalnie opracowany dla edytora bloków WordPress. Dowiedz się więcej o motywie Citadela i dostępnych pakietach układów.

2 pomyślał o „How to make columns in WordPress without plugin

    1. Witaj Dawid,

      dzięki za napisanie. Powinieneś aktywować edytor Gutenberga, który oferuje opcję wyboru poszczególnych kolumn, w pasku bocznym ustawień (po prawej stronie) możesz dostosować jego szerokość.

      Z wyrazami szacunku!
      Zlatko
      Zespół AIIT

Możliwość dodawania komentarzy nie jest dostępna.