---
url: 'https://dxpr.com/uk/hc/%D0%B4%D0%BE%D0%BA%D1%83%D0%BC%D0%B5%D0%BD%D1%82%D0%B0%D1%86%D1%96%D1%8F/%D0%BD%D0%B0%D0%B2%D1%87%D0%B0%D0%BD%D0%BD%D1%8F-dxpr-builder/%D0%BC%D0%B0%D0%BA%D0%B5%D1%82/%D0%B2%D0%BA%D0%BB%D0%B0%D0%B4%D0%B5%D0%BD%D0%BD%D1%8F'
title: 'Додавання вкладеного макета | DXPR'
author:
  name: Jurriaan
  url: 'https://dxpr.com/users/jurriaan'
date: '2026-10-24T19:58:16+00:00'
updated: '2026-10-24T20:03:43+00:00'
copyright: 'Copyright DXPR. All rights reserved.'
type: article
summary: |-
  Ви можете розмістити рядок усередині стовпця, щоб поділити цей стовпець знову, наприклад дві
  піктограми поруч над заголовком. Використовуйте це, коли одному стовпцю потрібна дрібніша сітка,
  ніж рядку навколо нього. Приклад додає рядок із двох піктограм до середнього
  стовпця рядка з трьох стовпців.
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-24T20:03:43+0000'
  'image:alt': 'DXPR, powered by Drupal: AI-powered Drupal for marketers.'
schema:
  '@context': 'https://schema.org'
  '@graph':
    -
      mainEntity: {  }
    -
      '@type': TechArticle
      headline: 'Додавання вкладеного макета'
      description: |-
        Ви можете розмістити рядок усередині стовпця, щоб поділити цей стовпець знову, наприклад дві
        піктограми поруч над заголовком. Використовуйте це, коли одному стовпцю потрібна дрібніша сітка,
        ніж рядку навколо нього. Приклад додає рядок із двох піктограм до середнього
        стовпця рядка з трьох стовпців.
      image:
        '@type': ImageObject
        url: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
        width: '1200'
        height: '630'
      datePublished: '2026-10-24T19:58:16+0000'
      dateModified: '2026-10-24T20:03:43+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/uk/hc/%D0%B4%D0%BE%D0%BA%D1%83%D0%BC%D0%B5%D0%BD%D1%82%D0%B0%D1%86%D1%96%D1%8F/%D0%BD%D0%B0%D0%B2%D1%87%D0%B0%D0%BD%D0%BD%D1%8F-dxpr-builder/%D0%BC%D0%B0%D0%BA%D0%B5%D1%82/%D0%B2%D0%BA%D0%BB%D0%B0%D0%B4%D0%B5%D0%BD%D0%BD%D1%8F'
      articleSection: Макет
    -
      '@type': WebPage
      '@id': 'https://dxpr.com/uk/hc/%D0%B4%D0%BE%D0%BA%D1%83%D0%BC%D0%B5%D0%BD%D1%82%D0%B0%D1%86%D1%96%D1%8F/%D0%BD%D0%B0%D0%B2%D1%87%D0%B0%D0%BD%D0%BD%D1%8F-dxpr-builder/%D0%BC%D0%B0%D0%BA%D0%B5%D1%82/%D0%B2%D0%BA%D0%BB%D0%B0%D0%B4%D0%B5%D0%BD%D0%BD%D1%8F'
      description: |-
        Ви можете розмістити рядок усередині стовпця, щоб поділити цей стовпець знову, наприклад дві
        піктограми поруч над заголовком. Використовуйте це, коли одному стовпцю потрібна дрібніша сітка,
        ніж рядку навколо нього. Приклад додає рядок із двох піктограм до середнього
        стовпця рядка з трьох стовпців.
      breadcrumb:
        '@type': BreadcrumbList
        itemListElement:
          -
            '@type': ListItem
            position: 1
            name: Home
            item: 'https://dxpr.com/uk'
      publisher:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
      inLanguage: uk
---
[Help Center](/uk/hc)/[Documentation](/uk/hc/%D0%B4%D0%BE%D0%BA%D1%83%D0%BC%D0%B5%D0%BD%D1%82%D0%B0%D1%86%D1%96%D1%8F) /[Вивчення DXPR Builder](/uk/hc/documentation/learn-dxpr-builder) /[Створення сторінок](/uk/hc/documentation/learn-dxpr-builder/build) /[Додавання вмісту](/uk/hc/documentation/learn-dxpr-builder/elements) /[Макет](/uk/hc/documentation/learn-dxpr-builder/layout/overview) # Додавання вкладеного макета.

 Вивчення DXPR BuilderСтворення сторінокДодавання вмістуМакет

   ## In this guide

 Related guides

- [Додавання контейнера позиціонованих шарів](/uk/hc/%D0%B4%D0%BE%D0%BA%D1%83%D0%BC%D0%B5%D0%BD%D1%82%D0%B0%D1%86%D1%96%D1%8F/%D0%BD%D0%B0%D0%B2%D1%87%D0%B0%D0%BD%D0%BD%D1%8F-dxpr-builder/%D0%BC%D0%B0%D0%BA%D0%B5%D1%82/%D0%BF%D0%BE%D0%B7%D0%B8%D1%86%D1%96%D0%BE%D0%BD%D0%BE%D0%B2%D0%B0%D0%BD%D1%96-%D1%88%D0%B0%D1%80%D0%B8)
- [Додавання рядка](/uk/hc/%D0%B4%D0%BE%D0%BA%D1%83%D0%BC%D0%B5%D0%BD%D1%82%D0%B0%D1%86%D1%96%D1%8F/%D0%BD%D0%B0%D0%B2%D1%87%D0%B0%D0%BD%D0%BD%D1%8F-dxpr-builder/%D0%BC%D0%B0%D0%BA%D0%B5%D1%82/%D1%80%D1%8F%D0%B4%D0%BA%D0%B8-%D1%96-%D1%81%D1%82%D0%BE%D0%B2%D0%BF%D1%86%D1%96)
- [Додавання панелі вкладок](/uk/hc/%D0%B4%D0%BE%D0%BA%D1%83%D0%BC%D0%B5%D0%BD%D1%82%D0%B0%D1%86%D1%96%D1%8F/%D0%BD%D0%B0%D0%B2%D1%87%D0%B0%D0%BD%D0%BD%D1%8F-dxpr-builder/%D0%BC%D0%B0%D0%BA%D0%B5%D1%82/%D0%B5%D0%BB%D0%B5%D0%BC%D0%B5%D0%BD%D1%82-%D0%B2%D0%BA%D0%BB%D0%B0%D0%B4%D0%BE%D0%BA)

Ви можете розмістити рядок усередині стовпця, щоб поділити цей стовпець знову, наприклад дві піктограми поруч над заголовком. Використовуйте це, коли одному стовпцю потрібна дрібніша сітка, ніж рядку навколо нього. Приклад додає рядок із двох піктограм до середнього стовпця рядка з трьох стовпців. Для вашого першого рядка почніть зі сторінки [Рядки й стовпці](/uk/hc/%D0%B4%D0%BE%D0%BA%D1%83%D0%BC%D0%B5%D0%BD%D1%82%D0%B0%D1%86%D1%96%D1%8F/%D0%BD%D0%B0%D0%B2%D1%87%D0%B0%D0%BD%D0%BD%D1%8F-dxpr-builder/%D0%BC%D0%B0%D0%BA%D0%B5%D1%82/%D1%80%D1%8F%D0%B4%D0%BA%D0%B8-%D1%96-%D1%81%D1%82%D0%BE%D0%B2%D0%BF%D1%86%D1%96).

## Додавання вкладеного макета

1. Додайте розділ із рядком і стовпцями.
2. Наведіть курсор на стовпець і натисніть **+** на його панелі Column.
3. У виборі елементів виберіть **Row** на вкладці **Layout**.
4. Вкладений рядок з’явиться всередині стовпця з власними стовпцями.
5. Додайте елементи до вкладених стовпців як завжди, наприклад **Icon** у кожен.
6. Натисніть **Save** на панелі інструментів, щоб зберегти сторінку.

Нові елементи стають угорі свого стовпця, тож вкладений рядок опиняється над текстом стовпця.

  ## Що ви бачите

Олівець і зірка стоять поруч угорі середнього стовпця, над заголовком Design. Зовнішні стовпці незмінні. У редакторі вкладений рядок має власні панелі Row і Column усередині панелей зовнішнього рядка.

```text
Section
  Row (1/3 + 1/3 + 1/3)
    Column
      Text: Discovery
    Column
      Row (nested, 1/2 + 1/2)
        Column
          Icon: pencil
        Column
          Icon: star
      Text: Design
    Column
      Text: Delivery

```

## Налаштування вкладеного макета

Вкладений рядок має ту саму піктограму сітки й налаштування, що й будь-який рядок; див. [Рядки й стовпці](/uk/hc/%D0%B4%D0%BE%D0%BA%D1%83%D0%BC%D0%B5%D0%BD%D1%82%D0%B0%D1%86%D1%96%D1%8F/%D0%BD%D0%B0%D0%B2%D1%87%D0%B0%D0%BD%D0%BD%D1%8F-dxpr-builder/%D0%BC%D0%B0%D0%BA%D0%B5%D1%82/%D1%80%D1%8F%D0%B4%D0%BA%D0%B8-%D1%96-%D1%81%D1%82%D0%BE%D0%B2%D0%BF%D1%86%D1%96). Його ширини це частки батьківського стовпця, а не сторінки. Стовпець половинної ширини, що містить вкладений рядок із двох половин, дає вам дві області чверть ширини.

На екранах, вужчих за 768 пікселів, вкладені стовпці складаються так само, як зовнішні. Дайте вкладеному рядку телефонний макет за допомогою **Add screen size**, якщо піктограми мають лишитися поруч.

### Максимальна глибина вкладення

Рядки вкладаються на три рівні вглиб: рядок, рядок в одному з його стовпців і ще один рядок усередині нього. Четвертий рівень відхиляється. Той самий ліміт застосовується до кожного типу контейнера окремо, наприклад Tabs усередині Tabs. Один тип ніколи не зараховується до ліміту іншого типу.

Двох рівнів вистачає для більшості макетів. Кожен зайвий рівень додає панелі керування, повз які треба цілитися, і звужує простір для вмісту.

### Поширені патерни вкладення

| Патерн | Як створюється |
|---|---|
| Feature grid | Рядок із трьох стовпців, кожен із вкладеним рядком: піктограма поруч із текстом |
| Sidebar blocks | Рядок 2/3 + 1/3, чий вузький стовпець містить вкладені рядки, по одному на блок |
| Team members | Рядок із двох стовпців, кожен із вкладеним рядком 1/3 + 2/3: портрет поруч із біографією |

## Якщо елемент не відображається

- **У попередженні сказано, що рядки можна вкладати лише на 3 рівні вглиб.** Стовпець уже міститься всередині двох вкладених рядків, тож «Element cannot be added». Додайте рядок до стовпця рівнем вище або використовуйте пресет із більшою кількістю стовпців на зовнішньому рядку.
- **Вкладений рядок опиняється над текстом замість під ним.** Нові елементи стають угорі свого стовпця. Відкрийте **More** на панелі вкладеного рядка й виберіть **Move Down**.
- **Піктограми складаються на телефоні.** Вкладені стовпці складаються нижче 768 пікселів, як і всі стовпці. Натисніть піктограму сітки вкладеного рядка, потім **Add screen size**, і виберіть **1/2 + 1/2** для **Extra small (< 576px)**.

## Що далі?

- [Позиціоновані шари](/uk/hc/%D0%B4%D0%BE%D0%BA%D1%83%D0%BC%D0%B5%D0%BD%D1%82%D0%B0%D1%86%D1%96%D1%8F/%D0%BD%D0%B0%D0%B2%D1%87%D0%B0%D0%BD%D0%BD%D1%8F-dxpr-builder/%D0%BC%D0%B0%D0%BA%D0%B5%D1%82/%D0%BF%D0%BE%D0%B7%D0%B8%D1%86%D1%96%D0%BE%D0%BD%D0%BE%D0%B2%D0%B0%D0%BD%D1%96-%D1%88%D0%B0%D1%80%D0%B8): перекривайте елементи так, як сітка не вміє.
- [Рядки й стовпці](/uk/hc/%D0%B4%D0%BE%D0%BA%D1%83%D0%BC%D0%B5%D0%BD%D1%82%D0%B0%D1%86%D1%96%D1%8F/%D0%BD%D0%B0%D0%B2%D1%87%D0%B0%D0%BD%D0%BD%D1%8F-dxpr-builder/%D0%BC%D0%B0%D0%BA%D0%B5%D1%82/%D1%80%D1%8F%D0%B4%D0%BA%D0%B8-%D1%96-%D1%81%D1%82%D0%BE%D0%B2%D0%BF%D1%86%D1%96): пресети стовпців і макет для кожного розміру екрана.
- [Вкладки](/uk/hc/%D0%B4%D0%BE%D0%BA%D1%83%D0%BC%D0%B5%D0%BD%D1%82%D0%B0%D1%86%D1%96%D1%8F/%D0%BD%D0%B0%D0%B2%D1%87%D0%B0%D0%BD%D0%BD%D1%8F-dxpr-builder/%D0%BC%D0%B0%D0%BA%D0%B5%D1%82/%D0%B5%D0%BB%D0%B5%D0%BC%D0%B5%D0%BD%D1%82-%D0%B2%D0%BA%D0%BB%D0%B0%D0%B4%D0%BE%D0%BA): складайте панелі вмісту в одному місці замість розміщення поруч.