---
url: https://flip-chart.ru/knowledge-base/code-block.md
description: >-
  Блок кода во flip — элемент для фрагментов кода с подсветкой синтаксиса и
  номерами строк: создайте его инструментом, вставкой из буфера или загрузкой
  файла, выберите язык, скопируйте или скачайте код
---

# Как добавить блок кода

Блок кода — элемент для фрагментов кода с подсветкой синтаксиса, номерами строк и моноширинным шрифтом. Он пригодится, чтобы обсудить с командой запрос, конфигурацию или пример реализации рядом со схемами и заметками

## Как добавить блок кода

1. На панели инструментов выберите «Блок кода» или нажмите клавишу `` ` ``

   Если инструмента нет на панели, откройте «Все инструменты» — он находится в разделе «Основное»

2. Кликните по флипу — появится блок с открытым редактором

3. Введите или вставьте код

4. Нажмите Esc или кликните за пределами блока — изменения сохранятся

Чтобы снова изменить код, дважды кликните по блоку. В редакторе клавиша Tab вставляет два пробела, а высота блока растёт вместе с количеством строк

![Блок кода с подсветкой синтаксиса и номерами строк](/images/kb/code-block/1.png)

Создать блок можно и без инструмента:

* Скопируйте код и вставьте его на свободное место флипа — flip распознает код, создаст блок и сам определит язык. Фрагменты короче 10 символов и обычный текст вставляются как текст
* Перетащите файл с кодом на флип или добавьте его через «Загрузить» — язык определится по расширению, а имя файла станет названием блока. Если файлов несколько, для каждого создаётся отдельный блок

## Как загрузить Markdown или текстовый файл

При загрузке файла .md или .txt flip спрашивает, как его добавить:

* «Создать как документ» — редактируемый документ на флипе, подробнее — в статье [Документы](/documents)
* «Создать как код-блок» — содержимое файла в виде текста
* «Создать как файл» — документ только для просмотра. Этот вариант предлагается только для файлов .txt

Отметьте нужный вариант и нажмите «Выбрать». Чтобы закрыть окно без импорта, нажмите «Отмена»

![Выбор способа добавления текстового файла](/images/kb/code-block/2.png)

## Как выбрать язык

Выделите блок и нажмите «Язык» в меню над ним. Доступны JavaScript, TypeScript, Python, Java, C, C++, C#, Go, Ruby, Rust, PHP, Swift, Kotlin, SQL, HTML, CSS, Shell, JSON, Markdown, YAML, XML и Plain Text — последний показывает код без подсветки

Подсветка пересчитывается сразу после выбора, название языка показано в шапке блока. Пока язык не выбран вручную, flip определяет его сам, когда вы меняете код и выходите из редактора, — в том числе у блока, созданного инструментом. Если язык определился неверно, выберите его в списке. Язык, выбранный вручную, не меняется автоматически при дальнейшем редактировании

![Список «Язык» в меню блока кода](/images/kb/code-block/3.png)

## Номера строк, размер шрифта и название

* «Номера строк» — показывает или скрывает нумерацию. У нового блока номера включены
* «Размер шрифта» — меняет размер кода, блок подстраивается под новый размер
* «Вставить ссылку» — добавляет ссылку к блоку
* Название отображается над блоком. Кликните по нему у выделенного блока, чтобы переименовать. Если оставить название пустым, вернётся стандартное — «Блок кода» с номером

## Как свернуть длинный блок

Если в блоке больше 20 строк, в нём появляется кнопка «Свернуть». В свёрнутом блоке видны первые 20 строк. Нажмите «Развернуть», чтобы снова показать весь код

![Свёрнутый блок кода с кнопкой «Развернуть»](/images/kb/code-block/4.png)

## Как скопировать или скачать код

* Нажмите кнопку копирования внутри блока — в буфер обмена попадёт весь код без названия и номеров строк, даже если блок свёрнут. Появится уведомление «Скопировано». Кнопка работает и для участников с доступом только на просмотр
* Нажмите «Скачать» в меню блока — код сохранится файлом: имя берётся из названия блока, расширение — по выбранному языку, например .py для Python и .txt для Plain Text

## Ограничения

* В одном блоке — не более 1500 строк. Из файла большего размера загружаются первые 1500 строк
* Название блока не форматируется: шрифт, начертание и цвет заголовка не меняются
* Меню с языком, размером шрифта, номерами строк и скачиванием доступно, когда выделен один блок
