---
title: "Блок «Колонка» — одна колонка вёрстки"
description: "Отдельная колонка внутри ряда колонок: хранит долю ширины и собственный список дочерних блоков документа."
source: https://blokeditor.com/ru/docs/column/
lastmod: 2026-09-07
---

Фреймворк JavaScript

Блочные инструменты Колонка

# Колонка: одна колонка вёрстки

Одна колонка внутри списка колонок. Пользователь не может вставить её сам — колонки создаются и управляются родительским блоком `column_list`. Дочерние блоки вкладываются в колонку через `contentIds`. Необязательное поле `widthRatio` задаёт ширину колонки относительно соседних (применяется как flex-grow); опустите его, чтобы колонки были равной ширины.

### Импорт

TypeScript

```
import { Column } from '@bloklabs/core/tools';
```

### Формат данных

TypeScript

```
interface ColumnData {
  widthRatio?: number; // Width relative to siblings (flex-grow). Omitted = equal width.
}
// Child blocks are referenced via the block's saved `content` array
// (the in-memory `contentIds`), not stored here.
```

JSON

```
{
  "id": "column1",
  "type": "column",
  "data": {
    "widthRatio": 1.5
  },
  "content": ["block1", "block2"]
}
```

### Пример использования

TypeScript

```
// Column is not inserted directly — it is created by the ColumnList tool.
import { ColumnList, Column } from '@bloklabs/core/tools';

const editor = new Blok({
  holder: 'editor',
  tools: {
    column_list: { class: ColumnList },
    column: { class: Column },
  },
});
```