--- url: 'https://dxpr.com/pl/hc/dokumentacja/nauka-dxpr-builder/uklad/wiersze-i-kolumny' title: 'Dodawanie wiersza. | DXPR' author: name: Jurriaan url: 'https://dxpr.com/users/jurriaan' date: '2026-10-24T02:45:32+00:00' updated: '2026-10-24T17:19:22+00:00' copyright: 'Copyright DXPR. All rights reserved.' type: article summary: |- Wiersz dzieli sekcję na kolumny, więc treść staje obok siebie: trzy usługi, zdjęcie obok tekstu, pasek boczny obok artykułu. Podział wybierasz z dwunastu presetów, a telefonom możesz dać własny układ. Ta strona opisuje dodawanie wiersza; wiersz w kolumnie znajdziesz w zagnieżdżaniu. tags: - Layout image: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg' published: true og: site_name: DXPR updated_time: '2026-10-24T17:19:22+0000' 'image:alt': 'DXPR, powered by Drupal: AI-powered Drupal for marketers.' schema: '@context': 'https://schema.org' '@graph': - mainEntity: { } - '@type': TechArticle headline: 'Dodawanie wiersza.' description: |- Wiersz dzieli sekcję na kolumny, więc treść staje obok siebie: trzy usługi, zdjęcie obok tekstu, pasek boczny obok artykułu. Podział wybierasz z dwunastu presetów, a telefonom możesz dać własny układ. Ta strona opisuje dodawanie wiersza; wiersz w kolumnie znajdziesz w zagnieżdżaniu. image: '@type': ImageObject url: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg' width: '1200' height: '630' datePublished: '2026-10-24T02:45:32+0000' dateModified: '2026-10-24T17:19:22+0000' author: '@type': Organization '@id': 'https://dxpr.com/#organization' name: DXPR url: 'https://dxpr.com/' logo: '@type': ImageObject url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg' width: '1348' height: '501' publisher: '@type': Organization '@id': 'https://dxpr.com/#organization' name: DXPR url: 'https://dxpr.com/' logo: '@type': ImageObject url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg' width: '1348' height: '501' mainEntityOfPage: 'https://dxpr.com/pl/hc/dokumentacja/nauka-dxpr-builder/uklad/wiersze-i-kolumny' articleSection: Układ - '@type': WebPage '@id': 'https://dxpr.com/pl/hc/dokumentacja/nauka-dxpr-builder/uklad/wiersze-i-kolumny' description: |- Wiersz dzieli sekcję na kolumny, więc treść staje obok siebie: trzy usługi, zdjęcie obok tekstu, pasek boczny obok artykułu. Podział wybierasz z dwunastu presetów, a telefonom możesz dać własny układ. Ta strona opisuje dodawanie wiersza; wiersz w kolumnie znajdziesz w zagnieżdżaniu. breadcrumb: '@type': BreadcrumbList itemListElement: - '@type': ListItem position: 1 name: 'Strona Główna' item: 'https://dxpr.com/pl' publisher: '@type': Organization '@id': 'https://dxpr.com/#organization' name: DXPR inLanguage: pl --- [Centrum pomocy](/pl/hc)/[Dokumentacja](/pl/hc/dokumentacja) /[Poznaj DXPR Builder](/pl/hc/documentation/learn-dxpr-builder) /[Buduj strony](/pl/hc/documentation/learn-dxpr-builder/build) /[Dodaj treści](/pl/hc/documentation/learn-dxpr-builder/elements) /[Układ](/pl/hc/documentation/learn-dxpr-builder/layout/overview) # Dodawanie wiersza.. Poznaj DXPR BuilderBuduj stronyDodaj treściUkład ## W tym przewodniku Powiązane przewodniki - [Dodawanie układu zagnieżdżonego.](/pl/hc/dokumentacja/nauka-dxpr-builder/uklad/uklad-zagniezdzony) - [Dodawanie sekcji.](/pl/hc/dokumentacja/nauka-dxpr-builder/uklad/sekcje) - [Działanie układu na telefonach](/pl/hc/dokumentacja/nauka-dxpr-builder/projektowanie/projekt-responsywny) Wiersz dzieli sekcję na kolumny, więc treść staje obok siebie: trzy usługi, zdjęcie obok tekstu, pasek boczny obok artykułu. Podział wybierasz z dwunastu presetów, a telefonom możesz dać własny układ. Ta strona opisuje dodawanie wiersza; wiersz w kolumnie znajdziesz w [zagnieżdżaniu](/pl/hc/dokumentacja/nauka-dxpr-builder/uklad/uklad-zagniezdzony). ## Dodawanie wiersza Przykład dodaje do sekcji wiersz trzech kolumn, po jednej na każdą usługę zespołu. 1. Kliknij **+** na sekcji, aby otworzyć selektor elementów. 2. Wybierz **Row** na karcie **Layout**. Powstaje z dwiema równymi kolumnami. 3. Kliknij ikonę siatki (**Column layout**) na pasku sterowania wiersza, wybierz preset kolumn, na przykład trzy równe kolumny, i kliknij **Save**. 4. Kliknij **+** w kolumnie, aby dodać do niej treść. 5. Kliknij **Save** na pasku narzędzi, aby zapisać stronę. Ikona siatki stoi tuż za uchwytem przeciągania wiersza. Preset zmienia kolumny od razu po kliknięciu; **Cancel** przywraca stary układ. ## Efekt Trzy usługi stoją obok siebie, każda kolumna to jedna trzecia szerokości sekcji. Na ekranach węższych niż 768 pikseli kolumny układają się jedna pod drugą: każda zajmuje pełną szerokość, w kolejności ze strony. Kolumny są wysokie tylko na swoją treść, więc krótka kolumna kończy się przed sąsiadkami. Widać to, gdy kolumny dostają kolor tła; **Equal-height columns** je wyrównuje. ## Konfiguracja wiersza ### Układy kolumn Ikona siatki otwiera panel dla każdego rozmiaru ekranu z własnym układem. Każdy panel pokazuje tych dwanaście presetów jako kafelki: | Preset | Układ | |---|---| | 1/1 | Jedna kolumna na całą szerokość | | 1/2 + 1/2 | Dwie równe kolumny | | 1/3 + 1/3 + 1/3 | Trzy równe kolumny | | 1/4 + 1/4 + 1/4 + 1/4 | Cztery równe kolumny | | 1/6 + 1/6 + 1/6 + 1/6 + 1/6 + 1/6 | Sześć równych kolumn | | 1/4 + 1/2 + 1/4 | Wąska, szeroka, wąska | | 1/6 + 4/6 + 1/6 | Wąska, bardzo szeroka, wąska | | 1/4 + 3/4 | Ćwierć po lewej, trzy ćwierci po prawej | | 3/4 + 1/4 | Trzy ćwierci po lewej, ćwierć po prawej | | 2/3 + 1/3 | Szeroka po lewej, wąska po prawej | | 1/3 + 2/3 | Wąska po lewej, szeroka po prawej | | 5/12 + 7/12 | Nieco węższa po lewej, nieco szersza po prawej | Przy innym podziale kliknij **Custom Layout** i wpisz szerokości jako ułamki, na przykład `1/6 + 5/6`. Szerokości sumujące się do więcej niż 1 zawijają się do nowej linii. Po ponownym otwarciu okna **Custom Layout**jest zaznaczone i pokazuje układ, na przykład **Custom Layout (1/6 + 5/6)**. ### Osobny układ na rozmiar ekranu Pierwszy panel, **Medium devices (≥ 768px)**, ustawia układ od tabletów w górę. Aby zmienić też telefony, kliknij **Add screen size** na górze okna. Otworzy się panel **Extra small (< 576px)**; wybierz z jego listy inny rozmiar, jeśli potrzebujesz, a potem preset. **Remove screen size** usuwa panel z powrotem. ### Ustawienia wiersza i kolumn Otwórz **More** > **Settings** na pasku sterowania wiersza albo na pasku kolumny dla ustawienia kolumny. | Ustawienie | Element | Do czego służy | Domyślnie | |---|---|---|---| | **Equal-height columns** | Wiersz | Rozciąga każdą kolumnę do wysokości najwyższej | Off | | **Mirror row** | Wiersz | Pokazuje kolumny w odwrotnej kolejności od 768 pikseli w górę; ułożone w stos kolumny trzymają kolejność ze strony | Off | | **Vertical centering** | Kolumna | Wyśrodkowuje treść w kolumnie wyższej od niej | Off | **Mirror row** sprawdza się na stronie z naprzemiennymi wierszami: zdjęcie po lewej, potem zdjęcie po prawej, a telefony zawsze pokazują najpierw zdjęcie. ### Przenoszenie i usuwanie kolumn Przeciągnij kolumnę za uchwyt albo użyj **More** > **Move Left** lub **Move Right** na jej pasku. Kolumny nie mają **Delete**: wybierz preset z mniejszą liczbą kolumn. Treść nigdy nie ginie; przenosi się do ostatniej pozostałej kolumny. ## Jeśli go nie widzisz - **Wyśrodkowanie pionowe kolumny nic nie zmienia.** Kolumna jest wysoka tylko na swoją treść, więc nie ma w czym środkować. Włącz **Equal-height columns** w ustawieniach wiersza. - **Kolumny układają się w stos na telefonie.** Poniżej 768 pikseli to domyślne. Kliknij ikonę siatki, potem **Add screen size** i wybierz preset dla **Extra small (< 576px)**. - **Tekst przeskoczył do innej kolumny.** Wybrano preset z mniejszą liczbą kolumn, a treść usuniętych kolumn przeniosła się do ostatniej. Naciśnij **Ctrl+Z** (**Cmd+Z** na Macu), aby cofnąć zmianę. - **Kolumna nie ma Delete w menu More.** Kolumny usuwa się przez układ. Kliknij ikonę siatki wiersza i wybierz preset z mniejszą liczbą kolumn. ## Co dalej? - [Zagnieżdżanie](/pl/hc/dokumentacja/nauka-dxpr-builder/uklad/uklad-zagniezdzony): umieść wiersz w kolumnie dla drobniejszej siatki. - [Sekcje](/pl/hc/dokumentacja/nauka-dxpr-builder/uklad/sekcje): daj pasowi wokół kolumn własne tło. - [Projekt responsywny](/pl/hc/dokumentacja/nauka-dxpr-builder/projektowanie/projekt-responsywny): jak układ dopasowuje się do każdego rozmiaru ekranu.