publikacja: 27 czerwca 2011, autor: , komentarzy 18 https://wpninja.pl/artykuly/easy-columns-czyli-proste-dzielenie-tresci-wpisu-wordpressa-na-kolumny/

Easy Columns czyli proste dzielenie treści wpisu WordPressa na kolumny

Easy Columns czyli proste dzielenie treści wpisu WordPressa na kolumny

Edytor wizualny WordPressa jest genialny i w 95% przypadków spełnia moje potrzeby. Do pozostałych 5% zaliczam między innymi podział treści na kolumny. Najprostszym i najszybszym sposobem aby to uzyskać jest skorzystanie ze specjalnej wtyczki, w tym przypadku z Easy Columns.

Edytor wizualny = treść główna wpisu

Żeby uniknąć niejasności wyjaśnię – pisząc „treść wpisu” mam na myśli treść główną, którą wpisujemy w edytorze wizualnym. W plikach motywu wyświetlamy ją najczęściej za pomocą funkcji the_content co w efekcie wypluwa nam jeden wielki kawałek kodu HTML.

Podział na kolumny w teorii

Teoretycznie, do podziału treści na kolumny powinien wystarczyć nam multi-column z CSS3. I faktycznie – jeśli chcemy podzielić całą treść bez większego wpływu na rozmieszczenie elementów to, takie rozwiązanie będzie idealne.

Niestety, jeśli będziemy chcieli podzielić tylko część tekstu to trzeba będzie stworzyć własne shortcody. Dodajmy do tego potrzebę większej kontroli nad zawartością kolumn i zapewnienie obsługi w „ułomniejszych” przeglądarkach a otrzymamy rzeczywisty obraz sytuacji.

Podział na kolumny w praktyce (Easy Columns)

Praktycznie, wtyczka Easy Columns to gotowe rozwiązanie, które działa tuż po instalacji co jest szczególnie ważne przy ograniczonym czasie czy budżecie. Zasada jej działania opiera się o gotowe zestawy shortcodów wraz ze stylami CSS2 (warto więc pamiętać o wp_head).

Po instalacji wtyczki edytor wizualny zostanie wzbogacony o dodatkowy przycisk. Gdy na niego klikniemy, otworzy się nowe okienko, z którego będziemy mogli wybrać interesujący nas zestaw kolumn:

Po wybraniu zestawu, treść wpisu zostanie uzupełniona o dodatkowe shortcody tego typu:

[wpcol_1third id="" class="" style=""]Third Column[/wpcol_1third]
[wpcol_1third id="" class="" style=""]Third Column[/wpcol_1third]
[wpcol_1third_end id="" class="" style=""]Third Column[/wpcol_1third_end]

Jedyne co musimy teraz zrobić to przenieść treści w odpowiednie miejsca i gotowe.

Twoje 5% czyli czego jeszcze brakuje wizualnemu edytorowi?

Czy Ty też potrzebujesz czasem funkcji, których wizualny edytor nie posiada? Jak sobie z tym radzisz (albo i nie)? Zapraszam do dyskusji w komentarzach.

Dodaj własny komentarz

Odnośniki z innych stron

Lista innych stron, które w jakiś sposób odnoszą się do opublikowanej tutaj treści:

  1. Jak zrobić w tekście podział na kolumny?

    […] Dzielenie treści wpisu Easy Columns […]