Разметка текста в Engee

Страница в процессе разработки.

Общие сведения

Для разметки текста в Engee используются три языка разметки — Markdown, HTML и LaTeX. Используйте их:

В аннотациях (подробнее см. ниже):
В текстовых ячейках редактора скриптов (подробнее ниже):

Разметка текста в Engee преимущественно используется в редакторе скриптов, в котором используются скрипты с форматами .ngscript, .jl и .ipynb. Для этих форматов доступна работа с текстовыми ячейками через встроенный визуальный редактор с поддержкой Markdown. Кроме того, при открытии файлов .html и .md в Engee активируется специальный интерфейс, упрощающий работу с разметкой (подробнее см. Разметка файлов в формате .md и .html).

Разметка в текстовых ячейках

Для того чтобы добавить текстовую ячейку в редакторе скриптов, откройте скрипт и нажмите +Текст:

Текстовые ячейки поддерживают разметку в Markdown, LaTeX и HTML. Дважды нажмите на ячейке для открытия интерфейса:

text interface script

Пример текстовой ячейки с разметкой Markdown, LaTeX, HTML и обычным текстом:

script example 1

Подробнее об интерфейсе текстовых ячеек читайте в статье Редактор скриптов.

Редактор WYSIWYG

Редактор WYSIWYG используется текстовой ячейкой редактора скриптов по умолчанию. Для смены режима редактирования текста нажмите на режим редактирования script editor text 20 и выберите интересующий вас режим:

— визуальный редактор (WYSIWYG), отображает форматирование сразу (используется по умолчанию, рекомендуется);
— разметка Markdown, ручное редактирование исходного текста в синтаксие языка Markdown;
— превью результата разметки без возможности редактирования.

Редактор скриптов Engee предоставляет разметку по парадигме WYSIWYG («Что видишь, то и получишь»), позволяющий оформлять содержимое с помощью встроенной панели инструментов без необходимости ручной разметки текста.

Редактор предоставляет широкий набор инструментов для форматирования текста, вставки ссылок, таблиц, изображений и других элементов. Для этого предусмотрена панель из 20 кнопок, каждая из которых выполняет определенную функцию. С их помощью можно:

text interface script

Быстро оформить текст с нужными стилями (жирный, курсив, подчеркивание и т.д.);
Вставить заголовки, списки и контрольные списки для формирования структуры скрипта, скрытия подзаголовков (разделов) и т.д.;
Разместить поясняющий код, заметки, цитаты и примечания;
Добавить таблицу, изображение или ссылку;
Задать цвет и фон текста для выделения важных моментов;
Визуально оформить раздел в скрывающуюся секцию (кат), для лучшего восприятия информации;

Подробное описание каждой кнопки редактора WYSIWYG изложено в статье.

Форматирование можно применять как с помощью кнопок на панели, так и с помощью горячих клавиш или русскоязычных обозначений (например /Заголовок 1 для заголовка первого уровня). При этом редактор автоматически преобразует их в понятный визуальный стиль. Например, при вводе символа слэша (/) открывается меню с доступными опциями — для выбора нужной достаточно нажать Tab, Enter, соответствующую горячую клавишу или кликнуть мышью.

Редактор Markdown

Если ваши задачи требуют более сложной разметки, то используйте режим редактирования Markdown. Для этого выберите разметку Markdown script editor text 21 в режимах редактирования script editor text 20 . Рассмотрим базовый синтаксис языка Markdown:

Подробнее о Markdown

Заголовки — используйте # для обозначения заголовка первого уровня (наибольший заголовок). Используйте ## для заголовка второго уровня, и так далее, до шестого уровня:
```
# Заголовок первого уровня

## Заголовок второго уровня

...

###### Заголовок шестого уровня
```
Выделение текста — используйте * или _ для выделения текста курсивом. Используйте * * или _ _ для выделения текста полужирным. Используйте ~ ~ для зачеркнутого текста.
```
*Курсивный текст*

**Полужирный текст**

~~Зачеркнутый текст~~
```
Списки — используйте *, - или + для создания неупорядоченного списка. Используйте цифры с точкой для создания упорядоченного списка.
```
* Пункт списка 1
* Пункт списка 2

1. Пункт списка 1
2. Пункт списка 2
```
Цитаты — используйте > для создания цитат.
```
> Ваша цитата.
```
Код — оберните текст с помощью обратного апострофа (бэктик) ` для вставки однострочного кода. Используйте три обратных апострофа ( ` ` ` ) для вставки многострочного кода.
```
Пример `кода` внутри текста.

```
Многострочный
код
```
```
Ссылки — используйте конструкцию [текст ссылки](URL) для создания гиперссылки.
```
[Документация Engee](https://engee.com/helpcenter/stable/)
```
Изображения — используйте конструкцию ![альтернативный текст](URL изображения) для вставки изображения.
```
![Логотип](https://astralinux.ru/upload/iblock/ef6/398hnxlwiur3hci7uozjn9n9wagwp1n6.png)
```
Горизонтальная черта — используйте три дефиса - - - или три звездочки * * * для вставки горизонтальной черты.
```
---
```

Таблицы — используйте | и - для создания таблиц.

| Заголовок 1 | Заголовок2 |
| ----------- | ----------- |
| Ячейка 1 | Ячейка 2 |
| Ячейка 3 | Ячейка 4 |

Интерпретатор Markdown в Engee поддерживает текстовую HTML разметку. Рассмотрим наиболее популярные HTML-тэги:

Подробнее об HTML

<strong> или <b> — теги используются для выделения текста жирным. <strong> предпочтительнее использовать в семантически значимых случаях, когда текст действительно имеет особую важность.
```
<p>Этот текст выделен с помощью <strong>тега strong</strong>, а этот <b>тега b</b>.</p>
```
<em> или <i> — теги используются для выделения текста курсивом. Как и в случае с тегами для жирного текста, <em> предпочтительнее использовать в семантически значимых случаях.
```
<p>Этот текст выделен с помощью <em>тега em</em>, а этот <i>тега i</i>.</p>
```
<s> — тег используется для добавления зачеркивания к тексту.
```
<p>Этот текст <s>зачеркнут</s>.</p>
```
<p> — тег используется для создания абзаца текста. Абзацы обычно имеют отступы сверху и снизу.
```
<p>Этот текст находится в абзаце.</p>
```
<h1> - <h6> — теги используются для создания заголовков разного уровня. Заголовки имеют разный размер и обычно предназначены для структурирования контента страницы.
```
<h1>Заголовок уровня 1</h1>
<h2>Заголовок уровня 2</h2>
<h3>Заголовок уровня 3</h3>
<h4>Заголовок уровня 4</h4>
<h5>Заголовок уровня 5</h5>
<h6>Заголовок уровня 6</h6>
```

<ul>, <ol>, <li> — теги используются для создания неупорядоченных <ul> и упорядоченных <ol> списков, а также их элементов <li>.

<ul>
  <li>Первый элемент неупорядоченного списка</li>
  <li>Второй элемент неупорядоченного списка</li>
</ul>

<ol>
  <li>Первый элемент упорядоченного списка</li>
  <li>Второй элемент упорядоченного списка</li>
</ol>

<img> — тег используется для вставки изображений на страницу.

<img src="https://astralinux.ru/upload/iblock/ef6/398hnxlwiur3hci7uozjn9n9wagwp1n6.png" alt="Логотип Engee">

<a> — тег используется для вставки ссылок.

<a href="https://engee.com/helpcenter/stable/">Документация Engee</a>

Markdown и HTML в Engee по умолчанию поддерживают отображение формул LaTeX с помощью библиотеки KaTeX.

Для корректного отображения оборачивайте формулу в $:

$…$ — для однострочных формул, пример:
```
 $x = \frac{-b \pm \sqrt{b^2 - 4ac}}{2a}$ 
```

$$…$$ — для многострочных формул, пример:

 $\frac{1}{\sigma \sqrt{2\pi}} \\ \cdot \exp\left( -\frac{(x - \mu)^2}{2\sigma^2} \right)$

После перехода Engee на KaTeX, старые скрипты с LaTeX-формулами без $ или $$ будут отображаться некорректно. Убедитесь, что все формулы обернуты в $ или $$, и при необходимости удалите лишние символы экранирования (\), которые могли быть добавлены автоматически.

Для получения дополнительной информации и для реализации более сложного синтаксиса см. официальную документацию KaTeX.

MarkDown и HTML в Engee не поддерживают теги для работы с видео и аудио, атрибуты событий (events), глобальные атрибуты (global attributes), атрибуты поддержки браузеров и другие HTML-теги и атрибуты более сложной настройки HTML, а также любой синтаксис LaTeX, выходящий за рамки KaTeX.

Выберите нужный язык разметки или комбинируйте их исходя из задач в ваших проектах!

Разметка в аннотациях

Аннотации — это области в рабочем пространстве Engee, внутрь которых можно добавлять текст и форматировать его, добавлять строки кода и изображения. В аннотациях, как и в текстовых ячейках, используются языки разметки Markdown с возможностью расширения функциональности с помощью HTML и LaTeX.

annotation example 1

Для добавления аннотаций нажмите левой кнопкой мыши на пустой области рабочего пространства Engee. Это откроет контекстное меню с кнопкой Добавить аннотацию :

annotation 1

Внутри аннотаций вы можете использовать Markdown, LaTeX и HTML:

annotation example x

Подробнее о работе с аннотациями в Engee читайте в статье Аннотации.

Разметка файлов в формате .md и .html

Файлы формата .md и .html в Engee имеют дополнительные элементы интерфейса в редакторе скриптов с тремя режимами отображения:

Редактор — отображает только редактор с синтаксисом Markdown.
Редактор и режим презентации — отображает редактор и режим предпросмотра готовой разметки.
Режим презентации — отображает только готовую разметку.

script example 2