# Раздел "Лонгриды"

# Контентные блоки

Здесь описаны все контентные блоки и их возможности.

# Как добавлять контентные блоки?

**Предусмотрено 3 варианта действий:**

##### Если вы в самом начале создания проекта

- Нажмите кнопку «Добавить блок». В выпадающем меню справа выберите нужный блок и он добавится в проект.  
    [![add_block_1.webp](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-02/add-block-1.webp)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-02/add-block-1.webp)  
    <span style="color: rgb(149, 165, 166);">*Нажмите на гифку, чтобы ее увеличить*</span>
- Выберите что-то из базовых блоков на самой странице проекта и нажмите для создания первого блока.  
    [![gif-4.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2022-12/gif-4.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2022-12/gif-4.gif)  
    <span style="color: rgb(149, 165, 166);">*Нажмите на гифку, чтобы ее увеличить*</span>

##### <span style="color: rgb(0, 0, 0);">**Если вы уже в процессе создания проекта (т.е. уже создан первый блок)**</span>

- Чтобы добавить новый блок в конец проекта, нажмите после последнего блока в проекта кнопку «Добавить блок». Выберите в выпадающем меню новый блок и он добавится.  
    [![add_block_3.webp](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-02/add-block-3.webp)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-02/add-block-3.webp)  
    <span style="color: rgb(149, 165, 166);">*Нажмите на гифку, чтобы ее увеличить*</span>
- Чтобы добавить новый блок в конкретное место, а не в конец проекта, нажмите кнопку «+» под тем блоком, после которого вы хотите добавить новый контент.  
    [![add_block_4.webp](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-02/add-block-4.webp)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-02/add-block-4.webp)  
    <span style="color: rgb(149, 165, 166);">*Нажмите на гифку, чтобы ее увеличить*</span>  
    <p class="callout info">Впрочем, таким же способом вы можете добавить контент и в конец проекта вместо предыдущего способа :)</p>

# Аккордеон

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

Через меню добавления контентных блоков. [Подробнее о блоках](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-dobavlyat-kontentnye-bloki).

<details id="bkmrk-%D0%A1%D0%BA%D1%80%D0%B8%D0%BD%D1%88%D0%BE%D1%82-%D0%BA%D0%BD%D0%BE%D0%BF%D0%BA%D0%B8-%D0%B2-%D0%BC%D0%B5"><summary>Скриншот кнопки в меню блока</summary>

![Image 001.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-10/scaled-1680-/image-001.jpg)

</details>### Как выглядит блок?

[![accordeon1-look-1.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/accordeon1-look-1.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/accordeon1-look-1.gif)

### Как работать с блоком?

Все просто. Создайте блок и начните заполнять пустые поля вашим контентом. В блоке «**Аккордеон**» можно добавить:

- заголовок каждой вкладки
- текст для каждой вкладки
- картинку для каждой вкладки

Картинки, которые вы добавили во «**Аккордеон**», всегда могут быть просмотрены учениками в полном размере.

<details id="bkmrk-%D0%97%D0%B0%D0%BF%D0%BE%D0%BB%D0%BD%D0%B5%D0%BD%D0%B8%D0%B5-%D0%B1%D0%BB%D0%BE%D0%BA%D0%B0"><summary>Заполнение блока</summary>

[![accordeon2-create.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/accordeon2-create.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/accordeon2-create.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>Еще есть возможность сгенерировать картинку с помощью нейросети.

<details id="bkmrk-%D0%93%D0%B5%D0%BD%D0%B5%D1%80%D0%B0%D1%86%D0%B8%D1%8F-%D0%BA%D0%B0%D1%80%D1%82%D0%B8%D0%BD%D0%BA%D0%B8"><summary>Генерация картинки</summary>

 [![bandicam 2024-08-05 13-45-50-986.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-08/bandicam-2024-08-05-13-45-50-986.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-08/bandicam-2024-08-05-13-45-50-986.gif)

</details>
#### Как добавлять и удалять вкладки?

Количество вкладок в «**Аккордеоне**» не ограничено. Вы можете добавить любое количество, нажав на кнопку «**Добавить новую вкладку**» внизу. А удалить ненужные вкладки можно, нажав на значок «**Корзина**».

<p class="callout warning">Обратите внимание, что после удаления, восстановить вкладку невозможно.</p>

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D0%B4%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D1%8F-%D0%BD%D0%BE"><summary>Удаление и добавление вкладок</summary>

[![accordeon3-tabs.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/accordeon3-tabs.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/accordeon3-tabs.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>#### Как изменить внешний вид?

##### Текст

Вы можете отформатировать текст внутри вкладки [с помощью текстового редактора](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-formatirovat-tekst). Так он будет выглядеть аккуратнее.

##### Подсказка

Вы можете изменить текст подсказки.

<details id="bkmrk-%D0%98%D0%B7%D0%BC%D0%B5%D0%BD%D0%B5%D0%BD%D0%B8%D0%B5-%D1%82%D0%B5%D0%BA%D1%81%D1%82%D0%B0-%D0%BF%D0%BE%D0%B4"><summary>Изменение текста подсказки</summary>

[![accordeon4-info.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/accordeon4-info.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/accordeon4-info.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>##### Цвет

Цвет открытой вкладки наследуется из цветовой темы лонгрида.

### Как я могу использовать этот блок?

Этот блок хорошо подходит:

- Для дополнительной информации: можно сделать аккордеон с одной вкладкой и <span style="font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Oxygen, Ubuntu, Roboto, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif; font-size: 14px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400;">вынести </span>туда дополнительную информацию, которую не страшно пропустить в лонгриде. Например, историческую справку по какому-то процессу или познавательные факты.
- Для разделения информации на разные категории: например, кратко описать 3 основных продукта компании.

# Аудио

Блок «**Аудио**» позволяет добавить к лонгриду аудиофайл и настроить его внешний вид.

### Как выглядит блок?

[![audio0-look2.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/scaled-1680-/audio0-look2.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/audio0-look2.jpg)

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

Наведите курсор на линию между блоками и нажмите на появившийся значок "**плюс**", чтобы открыть меню с блоками. [Подробнее о добавлении блоков](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-dobavlyat-kontentnye-bloki).

<details id="bkmrk-"><summary>Как выглядит блок в меню</summary>

[![audio01-menu.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/scaled-1680-/audio01-menu.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/audio01-menu.jpg)

</details><details id="bkmrk-%D0%94%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%B1%D0%BB%D0%BE%D0%BA%D0%B0"><summary>Добавление блока</summary>

[![audio2-new.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/audio2-new.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/audio2-new.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Как изменить содержимое?

Чтобы добавить аудио, нажмите на кнопку «**Добавить аудиофайл**».

<p class="callout info">Вы можете добавить файл только в формате **MP3** и **WAV**, размером до **500 Мб**.</p>

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D0%B4%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D1%8F-%D0%B0%D1%83"><summary>Добавление аудио</summary>

[![audio3ai-fill.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/audio3ai-fill.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/audio3ai-fill.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Как изменить внешний вид?

В блоке «**Аудио**» можно изменить:

- шаблон блока
- текст заголовка и описания (в 2-х типах)
- изображение

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D0%BF%D0%B5%D1%80%D0%B5%D0%BA%D0%BB%D1%8E%D1%87%D0%B5%D0%BD%D0%B8%D1%8F-"><summary>Шаблон блока</summary>

##### Шаблон блока

Вы можете выбрать один из 3-х шаблонов блока, имеющих разный внешний вид: "**Простой**", "**С заголовком и описанием**", "**Подкаст**".

[![audio4-type.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/audio4-type.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/audio4-type.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details><details id="bkmrk-%D0%97%D0%B0%D0%B3%D0%BE%D0%BB%D0%BE%D0%B2%D0%BE%D0%BA-%D0%B8-%D0%BE%D0%BF%D0%B8%D1%81%D0%B0%D0%BD%D0%B8%D0%B5"><summary>Заголовок и описание</summary>

##### Заголовок и описание

В шаблонах "**<span class="text-sm">С заголовком и описанием</span>**" и "**Подкаст**" к аудиофайлу можно добавить заголовок и описание. Вы можете ввести свой текст, нажав на соответствующие поля. Вы также можете отформатировать текст в описании с помощью текстового редактора. [Подробнее о редакторе.](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-formatirovat-tekst)

[![audio6-text.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/audio6-text.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/audio6-text.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details><details id="bkmrk-%D0%98%D0%B7%D0%BE%D0%B1%D1%80%D0%B0%D0%B6%D0%B5%D0%BD%D0%B8%D0%B5-%D0%92-%D1%82%D0%B8%D0%BF%D0%B5-%D0%B1"><summary>Изображение</summary>

##### Изображение

В типе блока "**Подкаст**" к блоку добавляется изображение. Вы можете вставить своё собственное изображение, нажав на картинку.

[![audio5-image.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/audio5-image.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/audio5-image.gif)

Еще есть возможность сгенерировать картинку с помощью нейросети.

<details id="bkmrk-%D0%93%D0%B5%D0%BD%D0%B5%D1%80%D0%B0%D1%86%D0%B8%D1%8F-%D0%BA%D0%B0%D1%80%D1%82%D0%B8%D0%BD%D0%BA%D0%B8"><summary>Генерация картинки</summary>

[![bandicam 2024-08-05 13-46-25-014.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-08/bandicam-2024-08-05-13-46-25-014.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-08/bandicam-2024-08-05-13-46-25-014.gif)

</details>

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Есть ли особенности у блока?

Да. Ученики могут менять скорость воспроизведения при прослушивании. А также они могут скачать загруженный в блок аудиофайл.

### Как я могу использовать этот блок?

Рекомендуем вам использовать блок для таких целей:

- Пояснение сложных вещей с помощью голоса.   
    Бывает так, что некоторые темы проще рассказать, чем описывать текстом.
- Оформление серии учебных подкастов в одно пространство-курс.  
    Согласитесь, ведь удобно, когда все материалы собраны в одном месте и систематизированы.
- Аудиопримеры.  
    Например, звук двигателя автомобиля при неисправной выхлопной системе.
- Задания, где нужно послушать материал и в следующем блоке выбрать ответ.

---

<p class="callout success">Если у вас остались вопросы, напишите нам на почту <info@scroll-tool.ru>.</p>

# Веб-контент

<div id="bkmrk-"></div>Блок «**Веб-контент**» позволяет добавить в лонгрид ссылку на стороннюю веб-страницу, заархивированное веб-приложение или SCORM-пакет, а также настроить размер блока.

### Как выглядит блок?

[![Веб-контент - Вид.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-06/scaled-1680-/veb-kontent-vid.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-06/veb-kontent-vid.jpg)

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

[![Веб-контент - Как добавить.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-06/veb-kontent-kak-dobavit.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-06/veb-kontent-kak-dobavit.gif)

<details id="bkmrk-%D0%9A%D0%B0%D0%BA-%D0%B2%D1%8B%D0%B3%D0%BB%D1%8F%D0%B4%D0%B8%D1%82-%D0%B1%D0%BB%D0%BE%D0%BA-%D0%B2-"><summary>Как выглядит блок в меню</summary>

[![Веб-конструктор - меню.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-06/veb-konstruktor-menyu.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-06/veb-kontent-kak-dobavit.gif)

</details>### Как изменить содержимое?

<details id="bkmrk-%D0%9A%D0%B0%D0%BA-%D0%B4%D0%BE%D0%B1%D0%B0%D0%B2%D0%B8%D1%82%D1%8C-%D1%81%D1%81%D1%8B%D0%BB%D0%BA%D1%83"><summary>Как добавить ссылку</summary>

[![Веб-конструктор - Как добавить ссылку.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-06/veb-konstruktor-kak-dobavit-ssylku.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-06/veb-konstruktor-kak-dobavit-ssylku.gif)

</details>1\. Если вы планируете добавить ссылку на веб-страницу, перейдите на вкладку «Ссылка на сайт» и вставьте ссылку в поле ввода. В окне предварительного просмотра автоматически отобразится содержимое веб-страницы.

<p class="callout warning">Обратите внимание! Не все сайты дают разрешение на отображение своего содержимого таким образом. Если в окне предпросмотра ничего не отображается, вероятнее всего, сайт запрещает отображать содержимое по ссылке.</p>

Если вы собираетесь размещать лонгрид в СДО, то убедитесь, что у ваших учеников есть доступ во внешний интернет. Иначе встроенный по ссылке контент не будет работать.

<details id="bkmrk-%D0%9A%D0%B0%D0%BA-%D0%B4%D0%BE%D0%B1%D0%B0%D0%B2%D0%B8%D1%82%D1%8C-%D0%B0%D1%80%D1%85%D0%B8%D0%B2"><summary>Как добавить архив</summary>

[![Веб-конструктор - Как добавить архив.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-06/veb-konstruktor-kak-dobavit-arxiv.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-06/veb-konstruktor-kak-dobavit-arxiv.gif)

</details>2\. Если вы хотите добавить html-файл, папку с веб-контентом (веб-приложение) или SCORM-пакет, убедитесь, что:  
 • загружаемый контент запускается с помощью файла index.html или story.html;  
 • загружаемый контент запакован в виде zip-архива (даже в тех случаях, когда вы загружаете один единственный файл).  
Перейдите во вкладку «Загрузка веб-объекта», нажмите «Выбрать файл».

### Как изменить внешний вид?

[![Веб-конструктор - Как изменить размер.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-06/veb-konstruktor-kak-izmenit-razmer.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-06/veb-konstruktor-kak-izmenit-razmer.gif)

  
В блоке «Веб-контент» можно изменить размеры окна отображения контента.

<p class="callout info">Обратите внимание, что ширина и высота видео меняются независимо друг от друга. Поэтому пропорции видео могут нарушиться. Заранее подбирайте высоту и ширину так, чтобы сохранить пропорции.</p>

<p class="callout info">Максимальный размер файла который можно загрузить в блок Веб-Контент: **500Mb**</p>

### Есть ли альтернативные варианты этого блока?

  
Для размещения видео с внешних ресурсов вы можете воспользоваться блоком «Видео». Для перехода к внешним веб-ресурсам подходит блок «Внешняя ссылка».

### Как я могу использовать этот блок?

  
Вы можете использовать этот блок для вставки видео из внешних источников, веб-страниц, игр, интерактивов, разработанных в других редакторах, и любого контента, сохранённого в формате html (а также Javascript и CSS).

# Видео

Блок «**Видео**» позволяет добавить в лонгрид ссылку на видео на стороннем видехостинге и настроить его размер.

### Как выглядит блок?

[![video0-look2.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/scaled-1680-/video0-look2.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/video0-look2.jpg)

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

Наведите курсор на линию между блоками и нажмите на появившийся значок "**плюс**", чтобы открыть меню с блоками. [Подробнее о добавлении блоков](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-dobavlyat-kontentnye-bloki).

<details id="bkmrk-%D0%A1%D0%BA%D1%80%D0%B8%D0%BD%D1%88%D0%BE%D1%82-%D0%BA%D0%BD%D0%BE%D0%BF%D0%BA%D0%B8-%D0%B2-%D0%BC%D0%B5"><summary>Как выглядит блок в меню</summary>

[![video1-menu.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/scaled-1680-/video1-menu.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/video1-menu.jpg)

</details><details id="bkmrk-%D0%94%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%B1%D0%BB%D0%BE%D0%BA%D0%B0-%D0%A7%D1%82%D0%BE"><summary>Добавление блока</summary>

[![video2-new.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/video2-new.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/video2-new.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Как изменить содержимое?

Чтобы добавить видео, откройте видео на видеохостинге, найдите под ним кнопку «**Поделиться**», нажмите на неё и в открывшемся окне скопируйте ссылку на видео. Затем вставьте эту ссылку в соответствующее поле в блоке.

<p class="callout info">Поддерживается вставка видео со следующих сайтов: **YouTube**, **Vimeo**, **RuTube**, **Kinescope, VK Видео.**</p>

<details id="bkmrk-%D0%94%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-%D0%A7%D1%82%D0%BE"><summary>Добавление видео</summary>

[![video3-fill.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/video3-fill.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/video3-fill.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>---

<p class="callout success">Как добавить видео из ВК Видео вы можете посмотреть в нашей статье: [Как добавить видео с VK Видео](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-dobavit-video-s-vk-video)</p>

<p class="callout warning">Если вы собираетесь размещать лонгрид в СДО, то убедитесь, что у ваших учеников есть доступ во внешний интернет. Иначе встроенное по ссылке видео не будет работать.</p>

### Как изменить внешний вид?

В блоке «**Видео**» можно изменить:

- размер видео

<details id="bkmrk-%D0%A0%D0%B0%D0%B7%D0%BC%D0%B5%D1%80-%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-%D0%A7%D1%82%D0%BE%D0%B1%D1%8B-%D1%83"><summary>Размер видео</summary>

[![video4-size.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/video4-size.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/video4-size.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details><p class="callout info">Обратите внимание, что ширина и высота видео меняются независимо друг от друга. Поэтому пропорции видео могут нарушиться. Заранее подбирайте высоту и ширину так, чтобы сохранить пропорции.</p>

### Есть ли альтернативные варианты этого блока?

Да. Вы можете добавить другой тип контентного блока «[Видео с компьютера](https://wiki.scroll-tool.ru/books/razdel-longridy/page/video-s-kompyutera)».

### Как я могу использовать этот блок?

Этот блок хорошо подходит для размещения видео из интернета.

---

<p class="callout success">Если у вас остались вопросы, напишите нам на почту <info@scroll-tool.ru>.</p>

# Видео с компьютера

Блок «**Видео с компьютера**» позволяет добавить в лонгрид видео, находящееся у вас на компьютере (видеофайл).

### Как выглядит блок?

[![vidcomp0-look.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/vidcomp0-look.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/vidcomp0-look.gif)

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

Наведите курсор на линию между блоками и нажмите на появившийся значок "**плюс**", чтобы открыть меню с блоками. [Подробнее о добавлении блоков](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-dobavlyat-kontentnye-bloki).

<details id="bkmrk-%D0%A1%D0%BA%D1%80%D0%B8%D0%BD%D1%88%D0%BE%D1%82-%D0%BA%D0%BD%D0%BE%D0%BF%D0%BA%D0%B8-%D0%B2-%D0%BC%D0%B5"><summary>Как выглядит блок в меню</summary>

[![vidcomp0-menu1.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/scaled-1680-/vidcomp0-menu1.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/vidcomp0-menu1.jpg)

</details><details id="bkmrk-%D0%94%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%B1%D0%BB%D0%BE%D0%BA%D0%B0-%D0%A7%D1%82%D0%BE"><summary>Добавление блока</summary>

[![vidcomp2-new.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/vidcomp2-new.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/vidcomp2-new.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Как изменить содержимое?

Чтобы добавить своё видео, наведите курсор на видео по умолчанию. Сверху появится чёрная полоса. Нажмите на неё и выберите нужный файл в проводнике.

<p class="callout info">Вы можете добавить файл любого формата, размером до **500 Мб**.</p>

<details id="bkmrk-%D0%94%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-%D0%A7%D1%82%D0%BE"><summary>Добавление видео</summary>

[![vidcomp3-fill.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/vidcomp3-fill.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/vidcomp3-fill.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

<p class="callout success">Рекомендуем вам сжимать видео прежде, чем загружать его. Это можно сделать в разных программах, например, в бесплатной программе «[Handbrake](https://wiki.scroll-tool.ru/books/podborka-servisov/page/handbrake)».</p>

</details>
### Как изменить внешний вид?

В блоке «**Видео с компьютера**» можно изменить:

- размер

<details id="bkmrk-%D0%A0%D0%B0%D0%B7%D0%BC%D0%B5%D1%80-%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-%D0%A7%D1%82%D0%BE%D0%B1%D1%8B-%D1%83"><summary>Изменение размера</summary>

Чтобы изменить размер видео, двигайте ползунок ширины в правую или левую сторону. Или просто нажимайте на него в нужном месте. Текущая ширина указана в пикселях слева от ползунка. При изменении размера начальные пропорции сохраняются.

[![vidcomp5-size.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/vidcomp5-size.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/vidcomp5-size.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Как настроить?

Вы можете запретить ученикам **скачать видео**. В таком случае они смогут его только посмотреть, но не смогут сохранить к себе на компьютер.

По умолчанию скачивание видео разрешено. Чтобы его запретить, поставьте галочку в соответствующем поле в блоке.

<details id="bkmrk-%D0%97%D0%B0%D0%BF%D1%80%D0%B5%D1%82-%D1%81%D0%BA%D0%B0%D1%87%D0%B8%D0%B2%D0%B0%D0%BD%D0%B8%D1%8F-%D0%B2%D0%B8"><summary>Запрет скачивания видео</summary>

[![vidcomp4-nodownload.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/vidcomp4-nodownload.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/vidcomp4-nodownload.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Есть ли особенности у блока?

Да. Ученики могут менять скорость воспроизведения при просмотре. И использовать функцию "Картинка в картинке" для более удобного просмотра параллельно с другими действиями. Также они могут скачать загруженный файл, но эту опцию можно отключить в настройке.

### Есть ли альтернативные варианты этого блока?

Да. Вы можете добавить другой тип контентного блока [«Видео»](https://wiki.scroll-tool.ru/books/razdel-longridy/page/video).

### Как я могу использовать этот блок?

Этот блок хорошо подходит для размещения собственных видеороликов.

---

<p class="callout success">Если у вас остались вопросы, напишите нам на почту <info@scroll-tool.ru>.</p>

# Вкладки

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

Через меню добавления контентных блоков. [<span style="color: rgb(35, 111, 161);">Подробнее о блоках</span>.](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-dobavlyat-kontentnye-bloki)

<details id="bkmrk-%D0%A1%D0%BA%D1%80%D0%B8%D0%BD%D1%88%D0%BE%D1%82-%D0%BA%D0%BD%D0%BE%D0%BF%D0%BA%D0%B8-%D0%B2-%D0%BC%D0%B5"><summary>Скриншот кнопки в меню блока</summary>

[![tab_1.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/tab-1.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/tab-1.png)

</details>### Как выглядит блок?

[![tabs1-look.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/tabs1-look.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/tabs1-look.gif)

### Как работать с блоком?

Все просто. Создайте блок и начните заполнять пустые поля вашим контентом. В блоке «**Вкладки**» можно добавить:

- заголовок каждой вкладки
- текст для каждой вкладки
- картинку для каждой вкладки

Картинки, которые вы добавили во «**Вкладки**», всегда могут быть просмотрены учениками в полном размере.

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D1%81%D0%BE%D0%B7%D0%B4%D0%B0%D0%BD%D0%B8%D1%8F-%D0%B8-%D0%B7%D0%B0"><summary>Создание и заполнение блока</summary>

[![tabs2-create.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/tabs2-create.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/tabs2-create.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>Использование изображений

<details id="bkmrk-%D0%93%D0%B5%D0%BD%D0%B5%D1%80%D0%B0%D1%86%D0%B8%D1%8F-%D0%BA%D0%B0%D1%80%D1%82%D0%B8%D0%BD%D0%BA%D0%B8"><summary>Загрузка изображения</summary>

</details>

Еще есть возможность сгенерировать картинку с помощью нейросети.

<details id="bkmrk-%D0%93%D0%B5%D0%BD%D0%B5%D1%80%D0%B0%D1%86%D0%B8%D1%8F-%D0%BA%D0%B0%D1%80%D1%82%D0%B8%D0%BD%D0%BA%D0%B8-%C2%A0"><summary>Генерация картинки</summary>

[![bandicam 2024-08-05 14-08-09-590.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-08/bandicam-2024-08-05-14-08-09-590.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-08/bandicam-2024-08-05-14-08-09-590.gif)

</details>

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

Количество вкладок в блоке «**Вкладки**» не ограничено. Вы можете добавить любое количество, нажав на кнопку «**Добавить новую вкладку**» внизу. А удалить ненужные вкладки можно, нажав на значок «**Корзина**».

<p class="callout warning">Обратите внимание, что после удаления, восстановить вкладку невозможно.</p>

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D0%B4%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D1%8F-%D0%BD%D0%BE"><summary>Удаление и добавление вкладок</summary>

[![tabs3-tabs.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/tabs3-tabs.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/tabs3-tabs.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>#### Как изменить внешний вид?

##### Текст

Вы можете отформатировать текст внутри вкладки с помощью текстового редактора. [<span style="color: rgb(35, 111, 161);">Подробнее о редакторе.</span>](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-formatirovat-tekst)

##### Подсказка

Вы можете изменить текст подсказки.

<details id="bkmrk-%D0%98%D0%B7%D0%BC%D0%B5%D0%BD%D0%B5%D0%BD%D0%B8%D0%B5-%D1%82%D0%B5%D0%BA%D1%81%D1%82%D0%B0-%D0%BF%D0%BE%D0%B4"><summary>Изменение текста подсказки</summary>

[![tabs4-info.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/tabs4-info.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/tabs4-info.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>##### Цвет

Цвет активной вкладки наследуется из цветовой темы лонгрида.


### Как я могу использовать этот блок?

Этот блок хорошо подходит:

- Для разделения информации на разные категории.  
    Например, кратко описать 3 основных продукта компании.
- Для пошаговых пояснений.  
    1 вкладка = 1 шаг.

# Внешняя ссылка

Блок «**Внешняя ссылка**» позволяет добавить к лонгриду ссылку на сайт или файл, оформив её в виде отдельной кнопки с настраиваемым внешним видом.

### Как выглядит блок?

[![link0-view.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-01/link0-view.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-01/link0-view.gif)

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

Наведите курсор на линию между блоками и нажмите на появившийся значок "**плюс**", чтобы открыть меню с блоками. [Подробнее о добавлении блоков](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-dobavlyat-kontentnye-bloki).

<details id="bkmrk-%C2%A0"><summary>Как выглядит блок в меню</summary>

[![link1-menu.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-01/scaled-1680-/link1-menu.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-01/link1-menu.jpg)

</details><details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D1%81%D0%BE%D0%B7%D0%B4%D0%B0%D0%BD%D0%B8%D1%8F-%D0%B8-%D0%B7%D0%B0"><summary>Добавление блока</summary>

[![link2-add.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-01/link2-add.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-01/link2-add.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Как вставить ссылку?

Чтобы добавить ссылку, вставьте её в специальное поле «**Ссылка**». Не забудьте также добавить текст на кнопку, чтобы ваши ученики поняли, куда они попадут, когда нажмут на неё.

<details id="bkmrk-%D0%94%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D1%81%D1%81%D1%8B%D0%BB%D0%BA%D0%B8-%D0%B8-"><summary>Добавление ссылки и текста</summary>

[![link3-link.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-01/link3-link.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-01/link3-link.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Как настроить переход к другому разделу?

Чтобы настроить переход к другому разделу, вставьте номер раздела в специальное поле «**Ссылка**», в формате "**\#номер\_раздела**". Не забудьте также добавить текст на кнопку, чтобы ваши ученики поняли, куда они попадут, когда нажмут на неё.

<details id="bkmrk-%D0%9D%D0%B0%D1%81%D1%82%D1%80%D0%BE%D0%B9%D0%BA%D0%B0-%D0%BF%D0%B5%D1%80%D0%B5%D1%85%D0%BE%D0%B4%D0%B0-%D0%BA"><summary>Настройка перехода к другому разделу</summary>

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-08/scaled-1680-/9OEimage.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-08/9OEimage.png)

</details>### Как изменить внешний вид?

В блоке «**Внешняя ссылка**» можно изменить:

- цвет самой кнопки
- цвет текста и иконки
- иконку

<details id="bkmrk-%D0%98%D0%BA%D0%BE%D0%BD%D0%BA%D0%B0-%D0%98%D0%BA%D0%BE%D0%BD%D0%BA%D0%B0-%D0%95%D1%81%D0%BB%D0%B8-%D0%B2"><summary>Цвет кнопки</summary>

#### Цвет кнопки  


Вы можете выбрать цвет для кнопки из палитры. Откройте выпадающее меню палитры: там вам будут доступны цвета из базовой палитры и те цвета, которые вы добавили самостоятельно.

<p class="callout info">Добавить свои цвета в палитру можно в **Настройках лонгрида**. [Подробнее о своих цветах](https://wiki.scroll-tool.ru/link/47#bkmrk--0).</p>

[![button4-colour.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-12/button4-colour.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-12/button4-colour.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details><details id="bkmrk-%D0%A6%D0%B2%D0%B5%D1%82-%D0%A6%D0%B2%D0%B5%D1%82-%D0%92%D1%8B-%D0%BC%D0%BE%D0%B6%D0%B5%D1%82%D0%B5-"><summary>Цвет текста и иконки</summary>

#### Цвет текста и иконки  


Текст и иконка имеют один и тот же цвет. Вы можете выбрать цвет для них из палитры. Откройте выпадающее меню палитры: там вам будут доступны цвета из стартовой палитры и цвета, которые вы добавили самостоятельно.

Добавить свои цвета в палитру можно в **Настройках лонгрида**. [Подробнее о своих цветах](https://wiki.scroll-tool.ru/link/47#bkmrk--0).

[![button5-colourtext.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-12/button5-colourtext.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-12/button5-colourtext.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details><details id="bkmrk-%D0%98%D0%BA%D0%BE%D0%BD%D0%BA%D0%B0-%D0%98%D0%BA%D0%BE%D0%BD%D0%BA%D0%B0-%D0%92%D1%8B-%D1%82%D0%B0%D0%BA"><summary>Иконка</summary>

#### Иконка

Вы также можете выбрать иконку из встроенной базы иконок.

[![button6-icon.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-12/button6-icon.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-12/button6-icon.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Как я могу использовать этот блок?

Рекомендуем вам использовать блок для таких целей:

- Перевести ученика на другой сайт.
- Поделиться с учеником файлом, хранящимся не на вашем компьютере.

---

<p class="callout success">Если у вас остались вопросы, напишите нам на почту <info@scroll-tool.ru>.</p>

# Вставка пропущенных слов

### Как добавить этот контентный блок?

[Через меню добавления контентных блоков](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-dobavlyat-kontentnye-bloki).

<details id="bkmrk-%D0%A1%D0%BA%D1%80%D0%B8%D0%BD%D1%88%D0%BE%D1%82-%D0%BA%D0%BD%D0%BE%D0%BF%D0%BA%D0%B8-%D0%B2-%D0%BC%D0%B5"><summary>Скриншот кнопки в меню блока</summary>

[![Frame 1.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-02/nMVframe-1.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-02/nMVframe-1.png)

</details>### Как выглядит контентный блок?

[![Вставка пропущенных слов - Вид.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-05/vstavka-propushhennyx-slov-vid.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-05/vstavka-propushhennyx-slov-vid.png)

### Как работать с блоком?

Работа с блоком делится на 2 этапа:

1. Создайте блок и заполните его контентом.  
    Вставьте нужный текст и оформите пропуски.
2. Настройте влияние блока на результат лонгрида.

Разберем каждый этап.

#### Создание и заполнение блока

Вставьте в блок ваш текст. Чтобы оформите пропуски, определите, что в тексте должно быть пропущено. Затем эту часть выделите вот так: <span style="background-color: rgb(251, 238, 184);">{{Ваш пропущенный текст}}.</span>

<p class="callout warning">Если рядом с пропущенным словом есть знаки препинания, отделите их пробелом, например:   
Столица Франции – {{Париж}} .<span style="background-color: rgb(251, 238, 184);">  
</span></p>

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D1%81%D0%BE%D0%B7%D0%B4%D0%B0%D0%BD%D0%B8%D1%8F-%D0%B8-%D0%B7%D0%B0"><summary>Пример оформления пропусков</summary>

[![Вставка-пропущенных-слов-Пример-оформления-пропусков_2.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-05/vstavka-propushhennyx-slov-primer-oformleniya-propuskov-2.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-05/vstavka-propushhennyx-slov-primer-oformleniya-propuskov-2.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>#### Настройте влияние блока на оценку лонгрида

Для этого откройте меню настройки блока. В нем вы можете отметить, будет ли этот вопрос влиять на статус прохождения лонгрида и сколько <span style="font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Oxygen, Ubuntu, Roboto, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif; font-size: 14px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400;">баллов</span><span style="font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Oxygen, Ubuntu, Roboto, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif; font-size: 14px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400;"> </span>слушатель лонгрида получит за верный ответ.

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D0%BD%D0%B0%D1%81%D1%82%D1%80%D0%BE%D0%B9%D0%BA%D0%B8-%D0%B2%D0%BB%D0%B8"><summary>Пример настройки влияния блока</summary>

[![Вставка-пропущенных-слов-Настройка-баллов_3.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-05/vstavka-propushhennyx-slov-nastroika-ballov-3.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-05/vstavka-propushhennyx-slov-nastroika-ballov-3.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Могу ли я изменить внешний вид блока?

Нет, внешний вид блока поменять нельзя. Ваша задача — только расставить пропуски в тексте.

### Есть ли особенности у блока?

Цветовое оформление блока наследуется из цветовой темы лонгрида.

### Как я могу использовать этот блок?

Этот блок хорошо подходит для различных упражнений на извлечение нужной информации или для заполнения документов.

# Диалог

Блок «**Диалог**» позволяет добавить к лонгриду реплики и настроить их внешний вид.

### Как выглядит блок?

[![dial0-look.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/scaled-1680-/dial0-look.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/dial0-look.jpg)

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

Наведите курсор на линию между блоками и нажмите на появившийся значок "**плюс**", чтобы открыть меню с блоками. [Подробнее о добавлении блоков](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-dobavlyat-kontentnye-bloki).

<details id="bkmrk-%C2%A0"><summary>Как выглядит блок в меню</summary>

![dialog0-menu.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/scaled-1680-/dialog0-menu.jpg)

</details><details id="bkmrk-%D0%94%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%B1%D0%BB%D0%BE%D0%BA%D0%B0-%D0%A7%D1%82%D0%BE"><summary>Добавление блока</summary>

[![dial2-new.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/dial2-new.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/dial2-new.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Как изменить содержимое?

В блоке «**Диалог**» можно добавить:

- текст реплики
- имя говорящего
- изображение говорящего
- отобразить текст с правой стороны

<p class="callout info">Вы можете использовать изображения в формате **JPG**, **PNG** и **SVG**.  
</p>

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D1%81%D0%BE%D0%B7%D0%B4%D0%B0%D0%BD%D0%B8%D1%8F-%D0%B8-%D0%B7%D0%B0"><summary>Заполнение блока</summary>

[![dial3-fill.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/dial3-fill.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/dial3-fill.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details><details id="bkmrk-%D0%A3%D0%B4%D0%B0%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%B8-%D0%B4%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8"><summary>Добавление и удаление реплик</summary>

Количество реплик в блоке «**Диалог**» не ограничено. Вы можете добавить любое количество, нажав на кнопку «**Добавить реплику**» внизу. А удалить ненужные реплики можно, нажав на значок «**Корзина**».

<p class="callout warning">Обратите внимание, что после удаления, восстановить реплику невозможно.</p>

[![dial4-add.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/dial4-add.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/dial4-add.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Как изменить внешний вид?

В блоке «**Диалог**» можно изменить:

- цвет реплики
- форматирование текста (вы можете отформатировать текст в имени говорящего и внутри реплики с помощью текстового редактора. [Подробнее о редакторе](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-formatirovat-tekst).)

<details id="bkmrk-%D0%A6%D0%B2%D0%B5%D1%82-%D1%80%D0%B5%D0%BF%D0%BB%D0%B8%D0%BA%D0%B8-%D0%A6%D0%B2%D0%B5%D1%82-%D1%80%D0%B5"><summary>Цвет</summary>

##### Цвет реплики

Вы можете выбрать цвет для реплики из **палитры**. Откройте выпадающее меню палитры: там вам будут доступны цвета из базовой палитры и те цвета, которые вы добавили самостоятельно.

<p class="callout info">Добавить свои цвета в палитру можно в настройках лонгрида. [Подробнее о своих цветах](https://wiki.scroll-tool.ru/link/47#bkmrk--0).</p>

Также вы можете задать свой собственный цвет с помощью **HEX-кода**.

<p class="callout warning">Обратите внимание, что при вставке HEX-кода нельзя удалять символ решетки. Иначе цвет не будет работать.</p>

[![dial5-color.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/dial5-color.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/dial5-color.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Как я отобразить текст с правой стороны?

Если вы использует нескольких персонажей в блоке "Диалог" то вы можете отобразить их по разным сторонам экрана, делается это с помощью настройки "Отображать справа".

<details id="bkmrk-%D0%9D%D0%B0%D1%81%D1%82%D1%80%D0%BE%D0%B9%D0%BA%D0%B0-%D0%BE%D1%82%D0%BE%D0%B1%D1%80%D0%B0%D0%B6%D0%B5%D0%BD%D0%B8"><summary>Настройка отображение текста с правой стороны</summary>

![Снимок экрана 2025-05-05 060149.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/scaled-1680-/snimok-ekrana-2025-05-05-060149.png)

</details>### Как я могу использовать этот блок?

Рекомендуем вам использовать блок для таких целей:

- Ввести в лонгрид персонажа (проводника), который будет сопровождать ученика на протяжении лонгрида.
- Ввести в лонгрид несколько персонажей и рассказать их историю (добавить сторителлинг).
- Привести примеры общения из реальной жизни в теоретической части лонгрида или в проверочных вопросах (создать диалоговый тренажер).

---

<p class="callout success">Если у вас остались вопросы, напишите нам на почту <info@scroll-tool.ru>.</p>

# Заголовок

Блок «**Заголовок**» позволяет добавить к лонгриду крупный заголовок и настроить его внешний вид.

### Как выглядит блок?

[![header0-look.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/scaled-1680-/header0-look.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/header0-look.jpg)

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

Наведите курсор на линию между блоками и нажмите на появившийся значок "**плюс**", чтобы открыть меню с блоками. [Подробнее о добавлении блоков](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-dobavlyat-kontentnye-bloki).

<details id="bkmrk-"><summary>Как выглядит блок в меню</summary>

[![header1-menu1.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/scaled-1680-/header1-menu1.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/header1-menu1.jpg)

</details><details id="bkmrk-%D0%94%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%B1%D0%BB%D0%BE%D0%BA%D0%B0-%D0%A7%D1%82%D0%BE"><summary>Добавление блока</summary>

[![header2-new.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/header2-new.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/header2-new.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Как изменить содержимое?

Чтобы ввести свой текст, поставьте курсор в поле заголовка и наберите текст.

<details id="bkmrk-%D0%92%D0%B2%D0%B5%D0%B4%D0%B5%D0%BD%D0%B8%D0%B5-%D1%82%D0%B5%D0%BA%D1%81%D1%82%D0%B0-%D0%A7%D1%82%D0%BE%D0%B1"><summary>Введение текста</summary>

[![header3-fill.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/header3-fill.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/header3-fill.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Как изменить внешний вид?

В блоке «**Заголовок**» можно изменить:

- шрифт и размер текста
- цвет текста
- подсветку текста
- выравнивание текста
- добавить ссылку и перечеркивание

<p class="callout info">Цвет полосы под текстом наследуется из цветовой схемы лонгрида. [Подробнее о цветовой схеме](https://wiki.scroll-tool.ru/books/razdel-longridy/page/nastroika-vnesnego-vida-longrida#bkmrk--0).  
</p>

<details id="bkmrk-%D0%9F%D0%BE%D0%B4%D1%80%D0%BE%D0%B1%D0%BD%D0%B5%D0%B5-%D0%A8%D1%80%D0%B8%D1%84%D1%82-%D0%B8-%D1%80%D0%B0"><summary>Подробнее</summary>

##### Шрифт и размер текста

Шрифт и размер текста в заголовке можно установить в настройках лонгрида. Вы можете выбрать из базовых шрифтов или загрузить свой собственный. А также выбрать любой размер шрифта. [Подробнее о настройке шрифтов](https://wiki.scroll-tool.ru/books/razdel-longridy/page/nastroika-vnesnego-vida-longrida#bkmrk-%D0%A8%D1%80%D0%B8%D1%84%D1%82%D1%8B-%D0%BA%D1%83%D1%80%D1%81%D0%B0).

##### Другие параметры  


Другие параметры настраиваются при помощи текстового редактора. Чтобы его открыть, нужно выделить часть текста, которую вы хотите изменить, а затем выбрать нужный параметр.

[![header4-color.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/header4-color.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/header4-color.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Есть ли альтернативные варианты этого блока?

Да. Вы можете добавить другой тип контентного блока «[Заголовок с подзаголовком](https://wiki.scroll-tool.ru/books/razdel-longridy/page/zagolovok-c-podzagolovkom)».

### Как я могу использовать этот блок?

Этот блок хорошо подходит для разделения урока на смысловые части. Например, чтобы выделить подтемы в уроке. Так слушатель лонгрида будет лучше ориентироваться в ваших материалах.

---

<p class="callout success">Если у вас остались вопросы, напишите нам на почту <info@scroll-tool.ru>.</p>

# Заголовок c подзаголовком

Блок «**Заголовок c подзаголовком**» позволяет добавить к лонгриду крупный заголовок и подзаголовок меньшего размера ниже, и настроить их внешний вид.

### Как выглядит блок?

[![headsub0-look.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/scaled-1680-/headsub0-look.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/headsub0-look.jpg)

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

Наведите курсор на линию между блоками и нажмите на появившийся значок "**плюс**", чтобы открыть меню с блоками. [Подробнее о добавлении блоков](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-dobavlyat-kontentnye-bloki).

<details id="bkmrk-%D0%9A%D0%B0%D0%BA-%D0%B2%D1%8B%D0%B3%D0%BB%D1%8F%D0%B4%D0%B8%D1%82-%D0%B1%D0%BB%D0%BE%D0%BA-%D0%B2-"><summary>Как выглядит блок в меню</summary>

[![headsub1-menu.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/scaled-1680-/headsub1-menu.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/headsub1-menu.jpg)

</details><details id="bkmrk-%D0%94%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%B1%D0%BB%D0%BE%D0%BA%D0%B0-%D0%A7%D1%82%D0%BE"><summary>Добавление блока</summary>

[![headsub2-new.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/headsub2-new.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/headsub2-new.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Как изменить содержимое?

Чтобы ввести свой текст, поставьте курсор в поле заголовка и наберите текст.

<details id="bkmrk-%D0%92%D0%B2%D0%B5%D0%B4%D0%B5%D0%BD%D0%B8%D0%B5-%D1%82%D0%B5%D0%BA%D1%81%D1%82%D0%B0-%D0%A7%D1%82%D0%BE%D0%B1"><summary>Введение текста</summary>

[![headsub3-fill.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/headsub3-fill.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/headsub3-fill.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Как изменить внешний вид?

В блоке «**Заголовок c подзаголовком**» можно изменить:

- шрифт и размер текста
- цвет текста
- подсветку текста
- выравнивание текста
- добавить ссылку и перечеркивание

<details id="bkmrk-%D0%9F%D0%BE%D0%B4%D1%80%D0%BE%D0%B1%D0%BD%D0%B5%D0%B5-%D0%A8%D1%80%D0%B8%D1%84%D1%82-%D0%B8-%D1%80%D0%B0"><summary>Подробнее</summary>

##### Шрифт и размер текста

Шрифт и размер текста в заголовке можно установить в настройках лонгрида. Вы можете выбрать из базовых шрифтов или загрузить свой собственный. А также выбрать любой размер шрифта. [Подробнее о настройке шрифтов](https://wiki.scroll-tool.ru/books/razdel-longridy/page/nastroika-vnesnego-vida-longrida#bkmrk-%D0%A8%D1%80%D0%B8%D1%84%D1%82%D1%8B-%D0%BA%D1%83%D1%80%D1%81%D0%B0).

<p class="callout info">Обратите внимание, что отдельный шрифт, выбранный в настройках, в этом блоке будет применяться только к **заголовку**. А в **подзаголовке** будет использован тот же шрифт, что и в обычном тексте.  
</p>

##### Другие параметры  


Другие параметры настраиваются при помощи текстового редактора. Чтобы его открыть, нужно выделить часть текста, которую вы хотите изменить, а затем выбрать нужный параметр.

[![headsub4-color.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/headsub4-color.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/headsub4-color.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Есть ли альтернативные варианты этого блока?

Да. Вы можете добавить другой тип контентного блока «[Заголовок](https://wiki.scroll-tool.ru/books/razdel-longridy/page/zagolovok)».

### Как я могу использовать этот блок?

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

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80"><summary>Пример</summary>

[![Screenshot_3.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-02/OpCscreenshot-3.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-02/OpCscreenshot-3.png)

</details>---

<p class="callout success">Если у вас остались вопросы, напишите нам на почту <info@scroll-tool.ru>.</p>

# Изображение

Блок «**Изображение**» позволяет добавить к лонгриду картинку и настроить её внешний вид.

### Как выглядит блок?

[![image1-look.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/image1-look.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/image1-look.gif)

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

Наведите курсор на линию между блоками и нажмите на появившийся значок "**плюс**", чтобы открыть меню с блоками. [Подробнее о добавлении блоков](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-dobavlyat-kontentnye-bloki).

<details id="bkmrk-"><summary>Как выглядит блок в меню</summary>

![image0-menu.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-10/scaled-1680-/image0-menu.jpg)

</details><details id="bkmrk-%D0%94%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%B1%D0%BB%D0%BE%D0%BA%D0%B0-%D0%A7%D1%82%D0%BE"><summary>Добавление блока</summary>

[![image2-new.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/image2-new.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/image2-new.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Как изменить содержимое?

Чтобы добавить своё изображение, нажмите на стартовую картинку и выберите нужный файл в проводнике.

<p class="callout info">Вы можете использовать изображения в формате **JPG**, **PNG**, **GIF**, **WEBP** и **SVG**.</p>

<p class="callout info">Максимальный размер файла изображения - **50Mb**</p>

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D0%B8%D0%B7%D0%BC%D0%B5%D0%BD%D0%B5%D0%BD%D0%B8%D1%8F-%D1%80%D0%B0%D0%B7"><summary>Заполнение блока</summary>

[![image3-fill.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/image3-fill.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/image3-fill.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>Еще есть возможность сгенерировать картинку с помощью нейросети.

<details id="bkmrk-%D0%93%D0%B5%D0%BD%D0%B5%D1%80%D0%B0%D1%86%D0%B8%D1%8F-%D0%BA%D0%B0%D1%80%D1%82%D0%B8%D0%BD%D0%BA%D0%B8"><summary>Генерация картинки</summary>

[![bandicam 2024-06-24 09-59-08-886.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-06/bandicam-2024-06-24-09-59-08-886.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-06/bandicam-2024-06-24-09-59-08-886.gif)

</details>### Как изменить внешний вид?

В блоке «**Изображение**» можно изменить:

- размер картинки

<details id="bkmrk-%D0%98%D0%B7%D0%BC%D0%B5%D0%BD%D0%B5%D0%BD%D0%B8%D0%B5-%D1%80%D0%B0%D0%B7%D0%BC%D0%B5%D1%80%D0%B0-%D0%A7%D1%82"><summary>Размер картинки</summary>

Чтобы изменить размер изображения, двигайте ползунок ширины в правую или левую сторону. Или просто нажимайте на него в нужном месте. Текущая ширина указана в пикселях слева от ползунка. При изменении размера исходные пропорции сохраняются.

[![image4-size.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/image4-size.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/image4-size.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Как настроить?

Вы можете запретить ученикам **увеличивать изображение**. В таком случае они смогут посмотреть его только в том размере, который вы укажете.

По умолчанию увеличение изображения разрешено. Чтобы его запретить, нажмите на соответствующий переключатель.

<details id="bkmrk-%D0%97%D0%B0%D0%BF%D1%80%D0%B5%D1%82-%D1%83%D0%B2%D0%B5%D0%BB%D0%B8%D1%87%D0%B5%D0%BD%D0%B8%D1%8F-%D0%BA%D0%B0"><summary>Запрет увеличения картинки</summary>

[![image5-download.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/image5-download.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/image5-download.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

<p class="callout info">**Совет**: если вы оставляете возможность для просмотра в полном размере **включенной**, то лучше не загружать в блок изображения с прозрачным фоном (такие изображения могут быть в формате png, gif, webp). Иначе при увеличении они не будут иметь фона.</p>

Пример с прозрачным фоном:

[![image3-transparent.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/image3-transparent.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/image3-transparent.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Есть ли альтернативные варианты этого блока?

Да. Вы можете добавить другой тип контентного блока [«Текст с изображением»](https://wiki.scroll-tool.ru/books/razdel-longridy/page/tekst-s-izobrazeniem).

### Как я могу использовать этот блок?

Этот блок хорошо подходит:

- Чтобы повысить наглядность лонгрида.  
    Например, вы можете поместить в этот блок схему процесса или образец вашей продукции.
- Чтобы украсить лонгрид.  
    Блок не обязательно должен содержать полезную для обучения картинку. Можно разместить просто красивое изображение в тему лонгрида. Например, в конце урока можно поместить картинку, которая сообщает об окончании урока. Красиво и функционально!

---

<p class="callout success">Если у вас остались вопросы, напишите нам на почту <info@scroll-tool.ru>.</p>

# Изображение с метками

Блок «**Изображение с метками**» это интерактивный блок, позволяющий расставить метки на изображении. Его можно использовать, чтобы показать, как выглядят те или иные объекты.

### Как выглядит блок?

[![imgspot0-look.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/imgspot0-look.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/imgspot0-look.gif)

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

Наведите курсор на линию между блоками и нажмите на появившийся значок "**плюс**", чтобы открыть меню с блоками. [Подробнее о добавлении блоков](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-dobavlyat-kontentnye-bloki).

<details id="bkmrk-%C2%A0" style="box-sizing: border-box; outline-color: var(--color-primary); outline-width: 1px; margin: 0px 0px 1em; padding: 12px; border: 1px solid rgb(221, 221, 221); font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-variant-numeric: inherit; font-variant-east-asian: inherit; font-weight: 400; font-stretch: inherit; font-size: 14px; line-height: inherit; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Oxygen, Ubuntu, Roboto, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif; vertical-align: baseline; display: block; color: rgb(68, 68, 68); letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;"><summary style="box-sizing: border-box; outline-color: var(--color-primary); outline-width: 1px; margin: -12px; padding: 6px 12px; border: 0px; font-style: inherit; font-variant: inherit; font-weight: bold; font-stretch: inherit; font-size: inherit; line-height: inherit; font-family: inherit; vertical-align: baseline; background-color: rgb(238, 238, 238);">Как выглядит блок в меню</summary>

 [![map0-menu.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-08/scaled-1680-/map0-menu.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-08/map0-menu.jpg)

</details><details id="bkmrk-%D0%94%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%B1%D0%BB%D0%BE%D0%BA%D0%B0-%D0%A7%D1%82%D0%BE"><summary>Добавление блока</summary>

[![imgspot2-new.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/imgspot2-new.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/imgspot2-new.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Как изменить содержимое?

В блоке «**Изображение с метками**» можно добавить:

- изображение
- метки
- подписи к меткам

<p class="callout info">Вы можете использовать изображения в формате **JPG**, **PNG**, **GIF**, **WEBP** и **SVG**.</p>

<details id="bkmrk-%D0%94%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%BA%D0%B0%D1%80%D1%82%D0%B8%D0%BD%D0%BA%D0%B8-"><summary>Добавление картинки</summary>

Чтобы добавить своё изображение, нажмите на черную полосу над картинкой и выберите нужный файл в проводнике.

[![imgspot3-fill.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/imgspot3-fill.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/imgspot3-fill.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details><details id="bkmrk-%D0%94%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%BC%D0%B5%D1%82%D0%BE%D0%BA-%D0%A7%D1%82%D0%BE"><summary>Добавление меток</summary>

Чтобы добавить метки на изображение, достаточно просто нажать на него в любом месте.

[![imgspot4-spots.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/imgspot4-spots.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/imgspot4-spots.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details><details id="bkmrk-%D0%94%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%BF%D0%BE%D0%B4%D0%BF%D0%B8%D1%81%D0%B8-%D0%A7"><summary>Добавление подписи</summary>

Чтобы добавить подпись к метке, нажмите на метку. Откроется окошко, где вы сможете ввести свой текст. Нажмите на метку ещё раз, чтобы закрыть окошко.

[![imgspot5-label.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/imgspot5-label.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/imgspot5-label.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details><details id="bkmrk-%D0%A3%D0%B4%D0%B0%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%BC%D0%B5%D1%82%D0%BA%D0%B8-%D0%A7%D1%82%D0%BE%D0%B1%D1%8B"><summary>Удаление метки</summary>

Чтобы удалить метку, нажмите на неё, откроется окошко для текста. Справа от текста вы увидите значок «**Корзина**». Нажмите на него, чтобы удалить эту метку.

[![imgspot6-deletespot.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/imgspot6-deletespot.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/imgspot6-deletespot.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details><details id="bkmrk-%D0%A8%D0%B8%D1%80%D0%B8%D0%BD%D0%B0-%D0%BC%D0%B0%D1%80%D0%BA%D0%B5%D1%80%D0%B0-%D0%92%D1%8B-%D0%BC%D0%BE"><summary>Ширина маркера</summary>

Вы можете изменить ширина маркера. По умолчанию стоит "**Адаптивно**", это значит, что после ввода текста размер маркера адаптируется по объем и формат текста, будет или широким или узким.  
Так же вы можете самостоятельно поставить "**Узко**" или **"Широко"**

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-11/scaled-1680-/image.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-11/image.png)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Как изменить внешний вид?

Вы можете настроить внешний вид меток. Можно выбрать:

- цвет метки
- иконку
- цвет иконки

Также в этом блоке вы можете ввести свой текст для подсказки к блоку.

<details id="bkmrk-%D0%9D%D0%B0%D1%81%D1%82%D1%80%D0%BE%D0%B9%D0%BA%D0%B0-%D0%BC%D0%B0%D1%80%D0%BA%D0%B5%D1%80%D0%BE%D0%B2-%D0%A7"><summary>Настройка меток</summary>

##### Цвет метки

Вы можете выбрать цвет для метки из **палитры**. Откройте выпадающее меню палитры: там вам будут доступны цвета из базовой палитры и те цвета, которые вы добавили самостоятельно.

<p class="callout info">Добавить свои цвета в палитру можно в настройках лонгрида. [Подробнее о своих цветах](https://wiki.scroll-tool.ru/link/47#bkmrk--0).</p>

Также вы можете задать свой собственный цвет с помощью **HEX-кода**.

<p class="callout warning">Обратите внимание, что при вставке HEX-кода нельзя удалять символ решетки. Иначе цвет не будет работать.</p>

[![imgspot7-color.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/imgspot7-color.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/imgspot7-color.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

##### Иконка

Вы можете выбрать иконку из встроенной базы иконок. И выбрать её цвет, а также задать свой собственный цвет с помощью **HEX-кода**.

[![imgspot8-icon.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/imgspot8-icon.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/imgspot8-icon.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Как я могу использовать этот блок?

Этот блок хорошо подходит:

- Для различных карт, схем, планов. Можно добавить схему и отметить на ней нужные объекты, одновременно показывая, как они выглядят и давая дополнительную информацию.

---

<p class="callout success">Если у вас остались вопросы, напишите нам на почту <info@scroll-tool.ru>.</p>

# Карточки

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

Через меню добавления контентных блоков. [<span style="color: rgb(35, 111, 161);">Подробнее о блоках</span>.](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-dobavlyat-kontentnye-bloki)

<details id="bkmrk-%D0%A1%D0%BA%D1%80%D0%B8%D0%BD%D1%88%D0%BE%D1%82-%D0%BA%D0%BD%D0%BE%D0%BF%D0%BA%D0%B8-%D0%B2-%D0%BC%D0%B5"><summary>Скриншот кнопки в меню</summary>

![cards0-menu.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/scaled-1680-/cards0-menu.jpg)

</details>### Как выглядит блок?

[![cards1-look1.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/cards1-look1.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/cards1-look1.gif "Карточки - вид")

### Как работать с блоком?

Все просто. Создайте блок и начните заполнять пустые поля вашим контентом. В блоке «**Карточки**» можно добавить:

- текст/картинку для внешней стороны (обложки)
- текст/картинку для внутренней стороны

Текст для внешней и внутренней сторон имеет ограничение по количеству символов. И там, и там действует ограничение — не более **175** символов.

<p class="callout info">Рекомендуемый размер изображений — **238 на 350** пикселей.</p>

<p class="callout info">Максимальный размер загружаемого изображение - **50Мb**</p>

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D1%81%D0%BE%D0%B7%D0%B4%D0%B0%D0%BD%D0%B8%D1%8F-%D0%B8-%D0%B7%D0%B0"><summary>Создание и заполнение блока</summary>

[![cards2-create.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/cards2-create.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/cards2-create.gif "Карточки - создание")

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>Чтобы добавить картинку в карточку, нужно изменить её настройки. Нажмите на значок «**Шестерёнка**» и выберите шаблон с изображением. Затем загрузите картинку. Картинку можно добавить и на внешнюю, и на внутреннюю сторону карточки.

Картинки, которые вы добавляете в «**Карточки**», не могут быть просмотрены учениками в полном размере.

<details id="bkmrk-%D0%94%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%B8%D0%B7%D0%BE%D0%B1%D1%80%D0%B0%D0%B6%D0%B5%D0%BD"><summary>Добавление изображения</summary>

[![cards3-image.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/cards3-image.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/cards3-image.gif "Карточки - картинки")

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>#### Как добавлять и удалять карточки?

Количество карточек в блоке «**Карточки**» не ограничено. Вы можете добавить любое количество, нажав на кнопку «**Добавить карточку**» внизу. А удалить ненужные карточки можно, нажав на значок «**Корзина**».

<p class="callout warning">Обратите внимание, что после удаления, восстановить карточку невозможно.</p>

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D0%B4%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D1%8F-%D0%BD%D0%BE"><summary>Удаление и добавление карточек</summary>

[![cards4-new.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/cards4-new.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/cards4-new.gif "Карточки - новые")

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>#### Как изменить внешний вид?

##### Текст

Вы можете отформатировать текст внутри карточки с помощью текстового редактора. [<span style="color: rgb(35, 111, 161);">Подробнее о редакторе.</span>](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-formatirovat-tekst)

##### Подсказка

Вы можете изменить текст подсказки.

<details id="bkmrk-%D0%98%D0%B7%D0%BC%D0%B5%D0%BD%D0%B5%D0%BD%D0%B8%D0%B5-%D1%82%D0%B5%D0%BA%D1%81%D1%82%D0%B0-%D0%BF%D0%BE%D0%B4"><summary>Изменение подсказки</summary>

[![cards5-info.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/cards5-info.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/cards5-info.gif "Карточки - подсказка")

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>
### Как я могу использовать этот блок?

Этот блок хорошо подходит:

- Для разделения информации на разные категории/этапы.  
    *Например, кратко описать 3 основных продукта компании.*

# Кнопка «Продолжить»

Кнопка «**Продолжить**» это блок, который скрывает остальную часть контента, находящуюся ниже него. Таким образом, эта кнопка помогает разделить контент на смысловые части в рамках одного урока. Это, с одной стороны, полезно для учащихся, так как они не увидят сразу весь урок целиком и не испугаются его большого объёма. С другой стороны, это позволяет автору лонгрида добавить активности (тестовые вопросы, опрос) в середину урока и сделать их прохождение обязательным. Так как остальная часть лонгрида будет заблокирована, пока учащийся не выполнит активность.

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

Через меню добавления контентных блоков. [<span style="color: rgb(35, 111, 161);">Подробнее о блоках</span>.](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-dobavlyat-kontentnye-bloki)

<details id="bkmrk-%C2%A0"><summary>Скриншот кнопки в меню блока</summary>

![Кнопка Продолжить.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-05/knopka-prodolzit.png)

</details>### Как выглядит блок?

[![next1-look.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/next1-look.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/next1-look.gif)

### Как работать с блоком?

Всё просто. Создайте блок и добавьте в него свой контент. В блоке «**Продолжить**» можно добавить:

- текст на заблокированной кнопке
- текст на разблокированной кнопке

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D1%81%D0%BE%D0%B7%D0%B4%D0%B0%D0%BD%D0%B8%D1%8F-%D0%B8-%D0%B7%D0%B0"><summary>Создание и заполнение блока</summary>

[![next2-create.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/next2-create.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/next2-create.gif "Продолжить - создание")

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>Кроме этого, вы можете настроить кнопку. У неё может быть два состояния:

- кнопка всегда разблокирована и доступна для нажатия
- кнопка заблокирована до тех пор, пока не пройдены все активности

<details id="bkmrk-%D0%9D%D0%B0%D1%81%D1%82%D1%80%D0%BE%D0%B9%D0%BA%D0%B0-%D0%BA%D0%BD%D0%BE%D0%BF%D0%BA%D0%B8-%C2%A0"><summary>Настройка кнопки</summary>

[![next3-options.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/next3-options.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/next3-options.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>Если вы выберете второй вариант, то кнопка будет не доступна для нажатия, пока учащиеся не пройдут все активности (тестовые вопросы, опросы) выше неё.

<details id="bkmrk-%D0%9A%D0%B0%D0%BA-%D1%80%D0%B0%D0%B1%D0%BE%D1%82%D0%B0%D0%B5%D1%82-%D0%B7%D0%B0%D0%B1%D0%BB%D0%BE%D0%BA%D0%B8"><summary>Как работает заблокированная кнопка</summary>

[![next4-block.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/next4-block.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/next4-block.gif "Продолжить - блок")

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>#### Как изменить внешний вид?

##### Цвет

Цвет разблокированной кнопки наследуется из цветовой темы лонгрида. Заблокированная кнопка всегда остается серой.

### Как я могу использовать этот блок?

Этот блок хорошо подходит:

- Для скрытия части урока, если он очень большой и учащихся может отпугнуть его объём.
- Для добавления обязательных активностей в середину урока, таких как: тестовые вопросы и опросы.

# Кнопка завершения просмотра

### Как добавить этот контентный блок?

[Через меню добавления контентных блоков](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-dobavlyat-kontentnye-bloki).

<details id="bkmrk-%D0%A1%D0%BA%D1%80%D0%B8%D0%BD%D1%88%D0%BE%D1%82-%D0%BA%D0%BD%D0%BE%D0%BF%D0%BA%D0%B8-%D0%B2-%D0%BC%D0%B5"><summary>Скриншот кнопки в меню блока</summary>

[![Кнопка Завершения Просмотра - Вид.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-05/knopka-zaverseniya-prosmotra-vid.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-05/knopka-zaverseniya-prosmotra-vid.png)

</details>### Как выглядит контентный блок?

[![Кнопка Завершения просмотра - Вид.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-07/knopka-zaverseniya-prosmotra-vid.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-05/knopka-zaverseniya-prosmotra.png)

### Как он работает?

После нажатия кнопки «Завершить просмотр» блок передает в СДО статус успешного прохождения лонгрида и 100% прогресса.

<p class="callout warning">Кнопка завершения просмотра отображается в лонгриде сразу. Он не скрыт, в отличие от контентного блока «Результаты с оценкой».</p>

<p class="callout warning">Контентные блоки из серии «Завершение просмотра и блокеры» могут быть только один из трех. Добавляется только в самом последнем разделе, последним блоком.</p>

### Как работать с блоком?

Просто добавьте блок в лонгрид:)

### Настройка иконок и цвета в блока

Вы так же можете изменить цвет кнопки, цвет шрифта и добавить иконку из банка иконок.

<details id="bkmrk-%D0%9D%D0%B0%D1%81%D1%82%D1%80%D0%BE%D0%B9%D0%BA%D0%B0-%D0%BA%D0%BD%D0%BE%D0%BF%D0%BA%D0%B8"><summary>Настройка кнопки</summary>

[![Кнопка Завершения просмотра - Настройка блока.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-07/knopka-zaverseniya-prosmotra-nastroika-bloka.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-07/knopka-zaverseniya-prosmotra-nastroika-bloka.gif)

</details>
### Когда лучше использовать этот блок завершения просмотра?

Когда в лонгриде нет вопросов, влияющих на результат прохождения лонгрида, и вы сторонник простоты и минимализма, или хотите этот блок сочетать с каким-то другим блоком в лонгриде.

# Опрос

Блок «**Опрос**» похож на тестовые вопросы, но имеет одно существенное отличие. Ответы за этот блок не попадают в итоговый результат и не оцениваются. Ученик видит обратную связь сразу после своего ответа. Вы можете указать в ней правильное решение. Или добавить вопрос, на который нет правильного ответа. Например, спросить учеников об их личном опыте. Такие приёмы помогают учащимся создавать личную связь с информацией в лонгриде и лучше её запоминать.

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

Через меню добавления контентных блоков. [<span style="color: rgb(35, 111, 161);">Подробнее о блоках</span>.](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-dobavlyat-kontentnye-bloki)

<details id="bkmrk-%C2%A0"><summary>Скриншот кнопки в меню</summary>

![quiz0-menu1.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/scaled-1680-/quiz0-menu1.jpg)

</details>### Как выглядит блок?

[![quiz1-look.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/quiz1-look.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/quiz1-look.gif "Опрос - вид")

### Как работать с блоком?

Всё просто. Создайте блок и начните заполнять пустые поля вашим контентом. В блоке «**Опрос**» можно добавить:

- текст вопроса
- варианты ответа
- обратную связь
- изображение к вопросу

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D1%81%D0%BE%D0%B7%D0%B4%D0%B0%D0%BD%D0%B8%D1%8F-%D0%B8-%D0%B7%D0%B0"><summary>Создание и заполнение блока</summary>

[![quiz2-create.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/quiz2-create.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/quiz2-create.gif "Опрос - создание")

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>##### Обратная связь

Вы можете включить и отключить обратную связь для «**Опроса**». Для этого нажмите на переключатель в верхней части блока.

<details id="bkmrk-%D0%94%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%BE%D0%B1%D1%80%D0%B0%D1%82%D0%BD%D0%BE%D0%B9-"><summary>Добавление обратной связи</summary>

[![quiz3-feedback.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/quiz3-feedback.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/quiz3-feedback.gif "Опрос - обратная связь")

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>Если вы не включите обратную связь, то после своего ответа ученик увидит стандартное сообщение с текстом по умолчанию. Это сообщение будет одинаковым независимо от того, какой вариант выберет ученик.

[![quiz4-default2.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/scaled-1680-/quiz4-default2.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/quiz4-default2.jpg)

##### Изображение

Вы также можете добавить изображение к вопросу. Изображение может быть только одно. В уроке оно будет находиться над блоком, занимая отдельную строку.

<p class="callout info">Совет: Изображения, добавленные в «**Опрос**», всегда будут отображаться в уроке в своём полном размере. Уменьшить их нельзя. Поэтому сразу подбирайте для блока небольшие по высоте изображения (рекомендуемая высота - не более 300 пикселей).</p>

[![quiz6-image.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/scaled-1680-/quiz6-image.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/quiz6-image.jpg)

Чтобы добавить изображение, раскройте поле «**Медиафайл к вопросу**» и загрузите изображение.

<details id="bkmrk-%D0%94%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%B8%D0%B7%D0%BE%D0%B1%D1%80%D0%B0%D0%B6%D0%B5%D0%BD"><summary>Добавление изображения</summary>

[![quiz7-addimage.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/quiz7-addimage.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/quiz7-addimage.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details><p class="callout warning">Картинки, которые вы добавляете в этот блок, всегда могут быть просмотрены учениками в полном размере.</p>

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

Количество вариантов ответа в блоке «**Опрос**» не ограничено. Вы можете добавить любое количество, нажав на кнопку «**Добавить вариант ответа**» внизу. А удалить ненужные варианты можно, нажав на значок «**Корзина**».

<p class="callout warning">Обратите внимание, что после удаления, восстановить вариант невозможно.</p>

<details id="bkmrk-%D0%A3%D0%B4%D0%B0%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%B8-%D0%B4%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8"><summary>Удаление и добавление вариантов</summary>

[![quiz5-new.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/quiz5-new.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/quiz5-new.gif "Опрос - новый")

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>#### Как изменить внешний вид?

##### Текст

Вы можете отформатировать текст во всех полях с помощью текстового редактора. [<span style="color: rgb(35, 111, 161);">Подробнее о редакторе.</span>](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-formatirovat-tekst)

##### Цвет

Цвет кнопок и выбранного ответа наследуется из цветовой темы лонгрида.

<p class="callout info">Совет: Мы рекомендуем дополнять блок «**Опрос**» блоком «**Кнопка "Продолжить"**». Это сделает ответ на опрос обязательным и избавит учащихся от соблазна его пропустить. [Подробнее о блоке «Продолжить».](https://wiki.scroll-tool.ru/books/razdel-longridy/page/knopka-prodolzit)</p>

### Как я могу использовать этот блок?

Этот блок хорошо подходит:

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

# Предупреждение

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

Через меню добавления контентных блоков. [<span style="color: rgb(35, 111, 161);">Подробнее о блоках</span>.](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-dobavlyat-kontentnye-bloki)

<details id="bkmrk-%C2%A0"><summary>Скриншот кнопки в меню блока</summary>

![warn0-menu.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-10/scaled-1680-/warn0-menu.jpg)

</details>### Как выглядит блок?

[![warning1-look.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/warning1-look.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/warning1-look.jpg)

### Как работать с блоком?

Всё просто. Создайте блок и добавьте в него свой контент. В блоке «**Предупреждение**» можно добавить:

- текст предупреждения

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D1%81%D0%BE%D0%B7%D0%B4%D0%B0%D0%BD%D0%B8%D1%8F-%D0%B8-%D0%B7%D0%B0"><summary>Создание и заполнение блока</summary>

[![warning2-create.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/warning2-create.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/warning2-create.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>#### Как изменить внешний вид?

##### Текст

Вы можете отформатировать текст внутри вкладки с помощью текстового редактора. [<span style="color: rgb(35, 111, 161);">Подробнее о редакторе.</span>](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-formatirovat-tekst)

##### Иконка

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

<details id="bkmrk-%D0%98%D0%B7%D0%BC%D0%B5%D0%BD%D0%B5%D0%BD%D0%B8%D0%B5-%D1%82%D0%B5%D0%BA%D1%81%D1%82%D0%B0-%D0%BF%D0%BE%D0%B4"><summary>Изменение иконки</summary>

[![warning3-icons.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/warning3-icons.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/list4-icons.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>##### Цвет

Цвет этого блока не наследуется из настроек лонгрида. Вы можете задать любой цвет и для фона предупреждения, и для его иконки. В настройках вам предлагается 5 цветов для фона и 2 цвета для иконки (чёрный и белый).

<details id="bkmrk-%D0%92%D1%8B%D0%B1%D0%BE%D1%80-%D1%86%D0%B2%D0%B5%D1%82%D0%B0-%D0%A7%D1%82%D0%BE%D0%B1%D1%8B-%D1%83%D0%B2"><summary>Выбор цвета</summary>

[![warning4-colors.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/warning4-colors.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/list5-colors.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>Также вы можете задать свой собственный цвет и для фона, и для иконки с помощью HEX-кода.

<p class="callout warning">Обратите внимание, что при вставке HEX-кода нельзя удалять символ решетки. Иначе цвет не будет работать.</p>

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D0%BE%D1%84%D0%BE%D1%80%D0%BC%D0%BB%D0%B5%D0%BD%D0%B8%D1%8F-%D0%B1%D0%BB"><summary>Добавление своего цвета</summary>

[![warning5-hex.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/warning5-hex.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/list6-hex.gif)

*<span style="color: rgb(149, 165, 166);">Нажмите на демонстрацию, чтобы ее увеличить.</span>*

</details>### Как я могу использовать этот блок?

Рекомендуем вам использовать блок:

- Для акцентирования внимания на важном учебном материале или мысли.
- Для сообщений. Например, об окончании урока (хорошо сочетается с иконкой галочки).
- Для заданий. Например, открыть рабочую тетрадь на 20 странице и выполнить задание №3 (хорошо сочетается с иконкой документа).

[![Screenshot_2.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-02/ZuWscreenshot-2.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-02/ZuWscreenshot-2.png)

# Разделитель

Блок «**Разделитель**» позволяет визуально отделить части текста друг от друга. Его можно использовать, чтобы показать начало новой смысловой части внутри одного урока.

### Как выглядит блок?

[![divider1-view.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-10/scaled-1680-/divider1-view.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-10/divider1-view.jpg)

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

Наведите курсор на линию между блоками и нажмите на появившийся значок "**плюс**", чтобы открыть меню с блоками. [Подробнее о добавлении блоков](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-dobavlyat-kontentnye-bloki).

<details id="bkmrk-%C2%A0"><summary>Блок в меню</summary>

![divider0-menu.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-10/scaled-1680-/divider0-menu.jpg)

</details><details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D1%81%D0%BE%D0%B7%D0%B4%D0%B0%D0%BD%D0%B8%D1%8F-%D0%B8-%D0%B7%D0%B0"><summary>Добавление блока</summary>

[![divider2-add.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-10/divider2-add.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-10/divider2-add.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Как изменить внешний вид?

В блоке «**Разделитель**» вы можете:

- выбрать тип разделителя
- выбрать иконку
- ввести текст
- настроить цвета
- настроить ширину

<details id="bkmrk-%D0%A2%D0%B8%D0%BF-%D1%80%D0%B0%D0%B7%D0%B4%D0%B5%D0%BB%D0%B8%D1%82%D0%B5%D0%BB%D1%8F-%D0%A2%D0%B8%D0%BF-"><summary>Тип разделителя</summary>

#### Тип разделителя

Выберите один из 7 типов:

- сплошная/пунктирная линия без фигуры
- сплошная/пунктирная линия с фигурой по центру
- пустой разделитель (добавляет дополнительный отступ).

[![divider3-type.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-10/divider3-type.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-10/divider3-type.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details><details id="bkmrk-%D0%98%D0%BA%D0%BE%D0%BD%D0%BA%D0%B0-%D0%98%D0%BA%D0%BE%D0%BD%D0%BA%D0%B0-%D0%95%D1%81%D0%BB%D0%B8-%D0%B2"><summary>Иконка</summary>

#### Иконка

Если вы выбрали тип разделителя с фигурой по центру, то вы можете выбрать иконку из встроенной базы иконок.

<p class="callout info">Если вы видите поле для ввода текста, то переключите тип поля на иконку.</p>

[![divider4-icon.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-10/divider4-icon.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-10/divider4-icon.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details><details id="bkmrk-%D0%A2%D0%B5%D0%BA%D1%81%D1%82-%D0%95%D1%81%D0%BB%D0%B8-%D0%B2%D1%8B-%D0%B2%D1%8B%D0%B1%D1%80%D0%B0%D0%BB"><summary>Текст</summary>

Если вы выбрали тип разделителя с фигурой по центру, то вы можете ввести свой собственный текст.

<p class="callout info">Если вы не видите поле для ввода текста, то переключите тип поля на текст.</p>

[![divider5-text.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-10/divider5-text.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-10/divider5-text.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

<p class="callout success">Введённый вами текст сохранится даже, если вы затем измените тип разделителя.</p>

</details><details id="bkmrk-%D0%A6%D0%B2%D0%B5%D1%82-%D0%A6%D0%B2%D0%B5%D1%82-%D0%92%D1%8B-%D0%BC%D0%BE%D0%B6%D0%B5%D1%82%D0%B5-"><summary>Цвета</summary>

#### Цвета

Вы можете отдельно задать цвет для линии, для фигуры в центре и для иконки/текста в этой фигуре.

[![divider6-color.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-10/divider6-color.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-10/divider6-color.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

Вам будут доступны цвета из палитры по умолчанию. А также ваши собственные цвета, добавленные в палитру в **Настройках**. [Подробнее о своих цветах](https://wiki.scroll-tool.ru/link/47#bkmrk--0).

</details><details id="bkmrk-%D0%A8%D0%B8%D1%80%D0%B8%D0%BD%D0%B0-%D0%A8%D0%B8%D1%80%D0%B8%D0%BD%D0%B0-%D0%92%D1%8B-%D0%BC%D0%BE%D0%B6"><summary>Ширина</summary>

#### Ширина

Вы можете настроить ширину линии разделителя в процентах, потянув за ползунок внизу.

[![divider7-width.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-10/divider7-width.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-10/divider7-width.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Как я могу использовать этот блок?

Рекомендуем вам использовать блок:

- Для разделения логических частей урока.

# Ранжирование

Блок «**<span class="text-xs text-[#828794] font-medium">Ранжирование</span>**» это один из видов тестовых вопросов в нашем конструкторе. Его можно использовать, чтобы расставить объекты, этапы или действия в правильном порядке.

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

Через меню добавления контентных блоков. [<span style="color: rgb(35, 111, 161);">Подробнее о блоках</span>.](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-dobavlyat-kontentnye-bloki)

<details id="bkmrk-%C2%A0"><summary>Скриншот кнопки в меню</summary>

![Ранжирование-Меню.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-05/ranzirovanie-menyu.png)

</details>### Как выглядит блок?

[![testrange1-look.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/testrange1-look.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/testrange1-look.gif "Ранжирование - вид")

### Как работать с блоком?

Всё просто. Создайте блок и начните заполнять пустые поля вашим контентом. В блоке «**<span class="text-xs text-[#828794] font-medium">Ранжирование</span>**» можно добавить:

- текст вопроса
- текст и/или изображение для вариантов ответа
- обратную связь

<p class="callout warning">Картинки, которые вы добавляете в «**<span class="text-xs text-[#828794] font-medium">Ранжирование</span>**», всегда могут быть просмотрены учениками в полном размере.</p>

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D1%81%D0%BE%D0%B7%D0%B4%D0%B0%D0%BD%D0%B8%D1%8F-%D0%B8-%D0%B7%D0%B0"><summary>Создание и заполнение блока</summary>

[![testrange2-create.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/testrange2-create.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/testrange2-create.gif "Ранжирование - создание")

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>У блока «**<span class="text-xs text-[#828794] font-medium">Ранжирование</span>**», как и у других тестовых вопросов, есть ряд специфичных настроек. Можно настроить:

- оценивается или не оценивается вопрос
- количество баллов за верный ответ
- обратную связь (включить/отключить, текст сообщений, показ правильного ответа)
- количество попыток

Давайте разберём каждую настройку.

##### Настройки прохождения

По умолчанию, все тестовые вопросы оцениваются, то есть учитываются в итоговом балле. И за каждый вопрос ученик получает 10 баллов.

Вы можете изменить эти настройки. То есть выбрать, будет ли вопрос учитываться в итоговом балле за лонгрид и сколько баллов ученик получит за правильный ответ. Для этого раскройте поле «**Показать настройки**», затем поле «**Настройки прохождения**» и нажмите на переключатель «**Вопрос влияет на оценку всего курса**». Затем введите баллы за верный ответ или оставьте число по умолчанию (10 баллов).

<details id="bkmrk-%D0%9D%D0%B0%D1%81%D1%82%D1%80%D0%BE%D0%B9%D0%BA%D0%B0-%D0%BF%D1%80%D0%BE%D1%85%D0%BE%D0%B6%D0%B4%D0%B5%D0%BD%D0%B8"><summary>Настройка прохождения</summary>

[![testrange3-points.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/testrange3-points.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/testrange3-points.gif "Ранжирование - баллы")

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>##### Обратная связь и попытки

По умолчанию, обратная связь выключена. Если вы оставите её выключенной, то у ученика будет всего 1 попытка на прохождение и после своего ответа он увидит стандартное сообщение. Это сообщение будет одинаковым, независимо от выбранного ответа.

[![testrange6-default.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/scaled-1680-/testrange6-default.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/testrange6-default.jpg)

Вы можете включить обратную связь. Для этого раскройте поле «**Показать настройки**», затем поле «**Обратная связь и попытки**» и нажмите на переключатель «**Обратная связь после ответа**». Здесь вы можете ввести текст для обратной связи. И задать количество попыток.

<details id="bkmrk-%D0%94%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%BE%D0%B1%D1%80%D0%B0%D1%82%D0%BD%D0%BE%D0%B9-"><summary>Добавление обратной связи</summary>

[![testrange4-feedback.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/testrange4-feedback.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/testrange4-feedback.gif "Ранжирование - фидбэк")

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>Вы также можете включить правильный ответ в обратную связь. Тогда ученик сможет увидеть правильный ответ после неверных ответов. Если все ответы ученика были неверными, то, после последней попытки, он увидит правильное решение. Верные ответы будут выделены зелёным цветом, а неверные — красным.

[![testrange5-correct1.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/scaled-1680-/testrange5-correct1.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/testrange5-correct1.jpg "Ранжирование - правильный")

[![testrange5-correct2.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/scaled-1680-/testrange5-correct2.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/testrange5-correct2.jpg "Ранжирование - правильный")

<details id="bkmrk-%D0%92%D0%BA%D0%BB%D1%8E%D1%87%D0%B5%D0%BD%D0%B8%D0%B5-%D0%BF%D1%80%D0%B0%D0%B2%D0%B8%D0%BB%D1%8C%D0%BD%D0%BE%D0%B3"><summary>Включение правильного ответа</summary>

[![testrange5-correct.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/testrange5-correct.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/testrange5-correct.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>#### Как добавлять и удалять варианты ответа?

Количество вариантов ответа в блоке «**<span class="text-xs text-[#828794] font-medium">Ранжирование</span>**» не ограничено. Вы можете добавить любое количество, нажав на кнопку «**Добавить вариант ответа**» внизу. А удалить ненужные варианты можно, нажав на значок «**Корзина**».

<p class="callout warning">Обратите внимание, что после удаления, восстановить вариант невозможно.</p>

<details id="bkmrk-%D0%A3%D0%B4%D0%B0%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%B8-%D0%B4%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8"><summary>Удаление и добавление вариантов</summary>

[![testrange7-new.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/testrange7-new.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/testrange7-new.gif "Ранжирование - новый")

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>#### Как изменить внешний вид?

##### Текст

Вы можете отформатировать текст во всех полях с помощью текстового редактора. [<span style="color: rgb(35, 111, 161);">Подробнее о редакторе.</span>](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-formatirovat-tekst)

##### Цвет

Цвет кнопок наследуется из цветовой темы лонгрида.

### Как я могу использовать этот блок?

Этот блок хорошо подходит:

- Для контроля за тем, запомнили ли ваши ученики правильный порядок чего-либо.  
    *Например, чтобы показать правильные действия кладовщика при приёме продукции (заполнить документы, разложить товар, занести товар в базу).*

# Результаты без оценки

### Как добавить этот контентный блок?

[Через меню добавления контентных блоков](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-dobavlyat-kontentnye-bloki).

<details id="bkmrk-%D0%A1%D0%BA%D1%80%D0%B8%D0%BD%D1%88%D0%BE%D1%82-%D0%BA%D0%BD%D0%BE%D0%BF%D0%BA%D0%B8-%D0%B2-%D0%BC%D0%B5"><summary>Скриншот кнопки в меню блока</summary>

[![Результаты без оценки-Меню.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-05/rezultaty-bez-ocenki-menyu.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-05/rezultaty-bez-ocenki-menyu.png)

</details>### Как выглядит контентный блок?

[![Результаты без оценки.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-05/rezultaty-bez-ocenki.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-05/rezultaty-bez-ocenki.png)

### Как он работает?

После нажатия кнопки «Завершить просмотр» блок передает в СДО статус успешного прохождения лонгрида и 100 баллов.

<p class="callout warning">Завершающий контентный блок отображается в проекте сразу. Он не скрыт, в отличие от контентного блока «Результаты с оценкой».</p>

<p class="callout warning">Контентные блоки из серии «Завершение просмотра и блокеры» могут быть только один из трех. Добавляется только в самом последнем разделе, последним блоком.</p>

### Как работать с блоком?

1. Добавьте блок.
2. Выберите шаблон блока.
3. Оформите текст и загрузите картинку (опционально).

[![no_grade_6.webp](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-02/no-grade-6.webp)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-02/no-grade-6.webp)


*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

<details id="bkmrk-%D0%9D%D0%B0%D1%81%D1%82%D1%80%D0%BE%D0%B9%D0%BA%D0%B0-%D0%B2%D0%BD%D0%B5%D1%88%D0%BD%D0%B5%D0%B3%D0%BE-%D0%B2"><summary>Настройка внешнего вида кнопки</summary>

[![bandicam 2024-07-05 01-14-39-555.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-07/bandicam-2024-07-05-01-14-39-555.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-07/bandicam-2024-07-05-01-14-39-555.gif)

</details>Еще есть возможность сгенерировать картинку с помощью нейросети.

<details id="bkmrk-%D0%93%D0%B5%D0%BD%D0%B5%D1%80%D0%B0%D1%86%D0%B8%D1%8F-%D0%BA%D0%B0%D1%80%D1%82%D0%B8%D0%BD%D0%BA%D0%B8"><summary>Генерация картинки</summary>

</details>

### Когда лучше использовать этот блок завершения проекта?

Когда в проекте нет вопросов, влияющих на результат прохождения лонгрида.

# Результаты с оценкой

### Как добавить этот контентный блок?

Через меню добавления контентных блоков. [<span style="color: rgb(35, 111, 161);">Подробнее о блоках</span>.](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-dobavlyat-kontentnye-bloki)

<details id="bkmrk-%D0%A1%D0%BA%D1%80%D0%B8%D0%BD%D1%88%D0%BE%D1%82-%D0%BA%D0%BD%D0%BE%D0%BF%D0%BA%D0%B8-%D0%B2-%D0%BC%D0%B5"><summary>Скриншот кнопки в меню блока</summary>

![resscore0-menu.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-10/scaled-1680-/resscore0-menu.jpg)

</details>### Как выглядит контентный блок?

[![result1-look.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/result1-look.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/result1-look.jpg)

### Как он работает?

Проходные баллы считаются по контентным блокам из группы «Тесты»:

- Ранжирование
- Сопоставление
- Тестовый вопрос
- Вставка пропущенных слов

<p class="callout warning">Баллы считаются только за те контентные блоки, в которых выставлена настройка влияния на оценку лонгрида.[![Результаты с оценкой - Пример.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-05/rezultaty-s-ocenkoi-primer.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-05/rezultaty-s-ocenkoi-primer.png)</p>

В качестве 100 баллов (100%) принимается максимальное число баллов за все верные ответы в лонгрида.

[![Результаты с оценкой - Пример 2.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-05/rezultaty-s-ocenkoi-primer-2.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-05/rezultaty-s-ocenkoi-primer-2.png)

Например, у вас в лонгриде 10 оцениваемых контентных блоков. Каждый из них приносит 1 балл. В сумме все могут принести 10 баллов = 100%. Если вы хотите, чтобы проходной балл за лонгрид был 80%, то <span style="font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Oxygen, Ubuntu, Roboto, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif; font-size: 14px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400;">в настройках завершающего блока укажите </span>80. Это будет равно 8 верным ответам (8 баллов за лонгрид).

При нажатии на кнопку «Завершить просмотр» считается набранный балл и сравнивается с проходным баллом в настройках блока. После сравнения в СДО передается статус лонгрида «Пройден» или «Не пройден» и набранный балл.

<p class="callout warning">Завершающий контентный блок по умолчанию скрыт. Он становится видимым, когда слушатель лонгрида ответит на все оцениваемые задания в лонгриде.</p>

<p class="callout warning">Контентный блок из серии «Завершение просмотра и блокеры» может быть только один на весь лонгрид. Добавляется только в самом последнем разделе, последним блоком.</p>

<p class="callout info">Если в вашем лонгриде 5 и меньше тестовых вопросов, для корректного подсчета результатов рекомендуем снизить процент до 75 (при 3-5 вопросах) или до 50 (при 2 вопросах).  
</p>

### Как работать с блоком?

1. Добавьте блок
2. Настройте проходной балл и количество попыток
3. Добавьте оформление для двух возможных исходов: «Курс пройден» и «Курс не пройден»

Разберем каждый этап.

#### Добавление и настройка блока

<details id="bkmrk-%D0%A7%D1%82%D0%BE%D0%B1%D1%8B-%D1%83%D0%B2%D0%B5%D0%BB%D0%B8%D1%87%D0%B8%D1%82%D1%8C-%D0%B4%D0%B5%D0%BC%D0%BE"><summary>Добавление и настройка блока</summary>

[![result-score2-create.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/result-score2-create.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/result-score2-create.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>#### Оформление блока

Когда вы выставили проходной балл за лонгрид, оформите экран результата. У вас два возможных исхода: слушатель завершил лонгрид успешно или неуспешно. Настройте каждый из них.

Настройте каждый результат лонгрида: выберите шаблон, загрузите картинку (в шаблоне с картинкой) и впишите свое сообщение слушателю лонгрида.

<details id="bkmrk-%D0%A7%D1%82%D0%BE%D0%B1%D1%8B-%D1%83%D0%B2%D0%B5%D0%BB%D0%B8%D1%87%D0%B8%D1%82%D1%8C-%D0%B4%D0%B5%D0%BC%D0%BE-0"><summary>Оформление блока</summary>

[![result-score3-design.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/result-score3-design.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/result-score3-design.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>Еще есть возможность сгенерировать картинку с помощью нейросети.

<details id="bkmrk-%D0%93%D0%B5%D0%BD%D0%B5%D1%80%D0%B0%D1%86%D0%B8%D1%8F-%D0%BA%D0%B0%D1%80%D1%82%D0%B8%D0%BD%D0%BA%D0%B8"><summary>Генерация картинки</summary>

</details>

<details id="bkmrk-%D0%9D%D0%B0%D1%81%D1%82%D1%80%D0%BE%D0%B9%D0%BA%D0%B0-%D0%BA%D0%BD%D0%BE%D0%BF%D0%BA%D0%B8"><summary>Настройка кнопки</summary>

[![bandicam 2024-07-05 01-17-47-104.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-07/bandicam-2024-07-05-01-17-47-104.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-07/bandicam-2024-07-05-01-17-47-104.gif)

</details><p class="callout info">Кстати! Вы можете сообщить слушателю лонгрида его прогресс по лонгриду с помощью переменных.</p>

- \*!resultPercentage!\* – процент правильных ответов пользователя.
- \*!resultScore!\* – набранные пользователем баллы.
- \*!passPercentage!\* – минимально необходимый процент правильных ответов.
- \*!passScore!\* – балл, минимально необходимый для прохождения лонгрида.

В этой статье мы приведем несколько шаблонов, которые вы можете скопировать себе в лонгрид. Также вы можете изучить примеры и придумать свой вариант.

<p class="callout success">**Как выглядит шаблон:** Вы успешно завершили курс. Ваш результат: 80% правильных ответов.  
**Как надо написать:** Вы успешно завершили курс. Ваш результат: \*!resultPercentage!\* % правильных ответов.</p>

<p class="callout success">**Как выглядит шаблон:** Вы успешно завершили курс. Ваш результат: 5 баллов из 10.  
**Как надо написать:** Вы успешно завершили курс. Ваш результат: \*!resultScore!\* баллов из (ваше количество баллов за лонгрид).</p>

<p class="callout danger">**Как выглядит шаблон:** Вы не набрали проходной балл. Ваш результат 5 баллов. Проходной балл: 10.  
**Как надо написать:** Вы не набрали проходной балл. Ваш результат \*!resultScore!\* баллов. Проходной балл: \*!passScore!\*.</p>

<p class="callout danger">**Как выглядит шаблон:** Вы не набрали проходной балл. Курс завершен на 70%, а необходимо набрать 80%.  
**Как надо написать:** Вы не набрали проходной балл. Курс завершен на \*!resultPercentage!\*%, а необходимо набрать \*!passPercentage!\*%.</p>

### Когда лучше использовать этот блок?

Когда в лонгриде есть оцениваемые вопросы и набранный балл нужно передавать в систему дистанционного обучения.

# Скачиваемый файл

### Как добавить этот контентный блок?

[Через меню добавления контентных блоков](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-dobavlyat-kontentnye-bloki).

<details id="bkmrk-%D0%A1%D0%BA%D1%80%D0%B8%D0%BD%D1%88%D0%BE%D1%82-%D0%BA%D0%BD%D0%BE%D0%BF%D0%BA%D0%B8-%D0%B2-%D0%BC%D0%B5"><summary>Скриншот кнопки в меню блока</summary>

[![Frame 1.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/rNaframe-1.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/rNaframe-1.png)

</details>### Как выглядит блок?

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-04/scaled-1680-/ouBimage.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-04/ouBimage.png)

### Как работать с блоком?

Создайте блок и добавьте в него свой файл.

<p class="callout warning">Размер файла ограничен (не более 10 Мб).</p>

<p class="callout info">Имя файла будет отображаться в блоке. Учитывайте это. Ученик не увидит, название файла.</p>

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D1%81%D0%BE%D0%B7%D0%B4%D0%B0%D0%BD%D0%B8%D1%8F-%D0%B8-%D0%B7%D0%B0"><summary>Пример создания и заполнения контентного блока</summary>

[![file_3.webp](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/file-3.webp)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/file-3.webp)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>#### Как заменить загруженный файл?

Просто загрузите новый файл.

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D0%B4%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D1%8F-%D0%BD%D0%BE"><summary>Пример замены файла</summary>

[![file_4.webp](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/file-4.webp)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/file-4.webp)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Могу ли я изменить внешний вид блока?

Нет.

### Есть ли особенности у блока?

Цвет блока и кнопки наследуется из цветовой темы лонгрида.

### Как я могу использовать этот блок?

Этот блок хорошо подходит для загрузки файлов. Например, можно загрузить файл и дать слушателю лонгрида <span style="font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Oxygen, Ubuntu, Roboto, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif; font-size: 14px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400;">задание</span><span style="font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Oxygen, Ubuntu, Roboto, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif; font-size: 14px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400;"> </span>поработать с ними. Или загрузить памятку с кратким конспектом <span style="font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Oxygen, Ubuntu, Roboto, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif; font-size: 14px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400;">в конце лонгрида</span>.

# Слайдер

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

Через меню добавления контентных блоков. [<span style="color: rgb(35, 111, 161);">Подробнее о блоках</span>.](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-dobavlyat-kontentnye-bloki)

<details id="bkmrk-%D0%A1%D0%BA%D1%80%D0%B8%D0%BD%D1%88%D0%BE%D1%82-%D0%BA%D0%BD%D0%BE%D0%BF%D0%BA%D0%B8-%D0%B2-%D0%BC%D0%B5"><summary>Скриншот кнопки в меню блока</summary>

![slider0-menu.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-10/scaled-1680-/slider0-menu.jpg)

</details>### Как выглядит блок?

[![slider1-look.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/slider1-look.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/slider1-look.gif)

### Как работать с блоком?

Создайте блок и добавьте в него свои изображения. То изображение, которое вы загрузите первым, будет идти первым и в самом слайдере.

<p class="callout info">Рекомендуемый размер изображения — 1000 на 600 пикселей.</p>

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D1%81%D0%BE%D0%B7%D0%B4%D0%B0%D0%BD%D0%B8%D1%8F-%D0%B8-%D0%B7%D0%B0"><summary>Создание блока</summary>

[![slider2-create.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/slider2-create.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/slider2-create.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>Вы можете выбрать, смогут ли ученики увеличить их при нажатии.

<details id="bkmrk-%D0%9D%D0%B0%D1%81%D1%82%D1%80%D0%BE%D0%B9%D0%BA%D0%B0-%D0%B1%D0%BB%D0%BE%D0%BA%D0%B0-%D0%A7%D1%82%D0%BE%D0%B1"><summary>Настройка блока</summary>

[![slider3-popup.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/slider3-popup.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/slider2-create.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details><p class="callout info">Совет: Если вы оставляете возможность для просмотра в полном размере включенной, то лучше не загружать в блок изображения с прозрачным фоном (такие изображения могут быть в формате png, gif, webp). Иначе при увеличении они не будут иметь фона.</p>

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D1%81-%D0%BF%D1%80%D0%BE%D0%B7%D1%80%D0%B0%D1%87%D0%BD%D1%8B%D0%BC-"><summary>Пример с прозрачным фоном</summary>

[![image3-transparent.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/image3-transparent.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/image3-transparent.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>#### Как удалять и передвигать изображения?

Количество изображений в «**Слайдере**» не ограничено. Вы можете добавить любое количество, нажав на кнопку «**Добавить изображение**». Удалить ненужные изображения можно, нажав на значок «**Корзина**». А переместить можно, нажимая на **стрелки**.

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D0%B4%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D1%8F-%D0%BD%D0%BE"><summary>Перемещение и удаление изображений</summary>

[![slider4-order.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/slider4-order.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/slider4-order.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>#### Как изменить внешний вид?

##### Подсказка

Вы можете изменить текст подсказки.

<details id="bkmrk-%D0%98%D0%B7%D0%BC%D0%B5%D0%BD%D0%B5%D0%BD%D0%B8%D0%B5-%D1%82%D0%B5%D0%BA%D1%81%D1%82%D0%B0-%D0%BF%D0%BE%D0%B4"><summary>Изменение текста подсказки</summary>

[![slider5-info.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/slider5-info.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/accordeon4-info.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Как я могу использовать этот блок?

Этот блок хорошо подходит:

- для пошаговых инструкций
- демонстрации какого-то процесса
- группировки изображений по одному принципу

# Сопоставление

Блок «**Сопоставление**» это один из видов тестовых вопросов в нашем конструкторе. Его можно использовать, чтобы соотнести между собой разные объекты или понятия.

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

Через меню добавления контентных блоков. [<span style="color: rgb(35, 111, 161);">Подробнее о блоках</span>.](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-dobavlyat-kontentnye-bloki)

<details id="bkmrk-%C2%A0"><summary>Скриншот кнопки в меню</summary>

![testmatch0-menu.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/scaled-1680-/testmatch0-menu.jpg)

</details>### Как выглядит блок?

[![test-match1-look.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/test-match1-look.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/test-match1-look.gif "Сопоставление - вид")

### Как работать с блоком?

Всё просто. Создайте блок и начните заполнять пустые поля вашим контентом. В блоке «**Сопоставление**» можно добавить:

- текст вопроса
- текст/изображения для вариантов ответа
- обратную связь

<p class="callout warning">Картинки, которые вы добавляете в «**Сопоставление**», всегда могут быть просмотрены учениками в полном размере.</p>

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D1%81%D0%BE%D0%B7%D0%B4%D0%B0%D0%BD%D0%B8%D1%8F-%D0%B8-%D0%B7%D0%B0"><summary>Создание и заполнение блока</summary>

[![test-match2-create.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/test-match2-create.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/test-match2-create.gif "Сопоставление - создание")

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>У блока «**Сопоставление**», как и у других тестовых вопросов, есть ряд специфичных настроек. Можно настроить:

- оценивается или не оценивается вопрос
- количество баллов за верный ответ
- обратную связь (включить/отключить, текст сообщений, показ правильного ответа)
- количество попыток

Давайте разберём каждую настройку.

##### Настройки прохождения

По умолчанию, все тестовые вопросы оцениваются, то есть учитываются в итоговом балле. И за каждый вопрос ученик получает 10 баллов.

Вы можете изменить эти настройки. То есть выбрать, будет ли этот вопрос влиять на итоговый балл и сколько баллов ученик получит за правильный ответ. Для этого раскройте поле «**Показать настройки**», затем поле «**Настройки прохождения**» и нажмите на переключатель «**Вопрос влияет на оценку всего курса**». Затем введите баллы за верный ответ или оставьте число по умолчанию (10 баллов).

<details id="bkmrk-%D0%9D%D0%B0%D1%81%D1%82%D1%80%D0%BE%D0%B9%D0%BA%D0%B0-%D0%BF%D1%80%D0%BE%D1%85%D0%BE%D0%B6%D0%B4%D0%B5%D0%BD%D0%B8"><summary>Настройка прохождения</summary>

[![testmatch3-score.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/testmatch3-score.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/testmatch3-score.gif "Сопоставление - баллы")

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>##### Обратная связь и попытки

По умолчанию, обратная связь выключена. Если вы оставите её выключенной, то у ученика будет всего 1 попытка на прохождение и после своего ответа он увидит стандартное сообщение. Это сообщение будет одинаковым, независимо от выбранного ответа.

[![testmatch-default.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/scaled-1680-/testmatch-default.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/testmatch-default.jpg)

Вы можете включить обратную связь. Для этого раскройте поле «**Показать настройки**», затем поле «**Обратная связь и попытки**» и нажмите на переключатель «**Обратная связь после ответа**». Здесь вы можете ввести текст для обратной связи. И задать количество попыток.

<details id="bkmrk-%D0%94%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%BE%D0%B1%D1%80%D0%B0%D1%82%D0%BD%D0%BE%D0%B9-"><summary>Добавление обратной связи</summary>

[![testmatch4-feedback.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/testmatch4-feedback.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/testmatch4-feedback.gif "Сопоставление - фидбэк")

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>Вы также можете выбрать, будет ли ученику показан правильный ответ после его ошибки. Если вы включите эту функцию, то в случае, если все ответы ученика были неверными, после последней попытки он увидит правильное решение. Верные сопоставления будут выделены зелёным цветом, а неверные — красным.

[![testmatch5-correct1.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/scaled-1680-/testmatch5-correct1.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/testmatch5-correct1.jpg)

[![testmatch5-correct2.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/scaled-1680-/testmatch5-correct2.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/testmatch5-correct2.jpg)

<details id="bkmrk-%D0%92%D0%BA%D0%BB%D1%8E%D1%87%D0%B5%D0%BD%D0%B8%D0%B5-%D0%BF%D1%80%D0%B0%D0%B2%D0%B8%D0%BB%D1%8C%D0%BD%D0%BE%D0%B3"><summary>Включение правильного ответа</summary>

[![testmatch5-correct.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/testmatch5-correct.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/testmatch5-correct.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>#### Как добавлять и удалять варианты ответа?

Количество вариантов ответа в блоке «**Сопоставление**» не ограничено. Вы можете добавить любое количество, нажав на кнопку «**Добавить вариант ответа**» внизу. А удалить ненужные варианты можно, нажав на значок «**Корзина**».

<p class="callout warning">Обратите внимание, что после удаления, восстановить вариант невозможно.</p>

<details id="bkmrk-%D0%A3%D0%B4%D0%B0%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%B8-%D0%B4%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8"><summary>Удаление и добавление вариантов</summary>

[![testmatch7-new.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/testmatch7-new.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/testmatch7-new.gif "Сопоставление - новый")

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>#### Как изменить внешний вид?

##### Текст

Вы можете отформатировать текст во всех полях с помощью текстового редактора. [<span style="color: rgb(35, 111, 161);">Подробнее о редакторе.</span>](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-formatirovat-tekst)

##### Цвет

Цвет кнопок наследуется из цветовой темы лонгрида.

### Как я могу использовать этот блок?

Этот блок хорошо подходит:

- Для вопросов, где можно соотнести одно понятие или явление с другим.

# Список

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

Через меню добавления контентных блоков. [<span style="color: rgb(35, 111, 161);">Подробнее о блоках</span>.](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-dobavlyat-kontentnye-bloki)

<details id="bkmrk-%C2%A0"><summary>Скриншот кнопки в меню блока</summary>

![list0-menu.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-10/scaled-1680-/list0-menu.jpg)

</details>### Как выглядит блок?

[![list1-look2.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/list1-look2.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/list1-look2.jpg)

### Как работать с блоком?

Все просто. Создайте блок и добавьте в него свой контент. В блоке «**Список**» можно добавить:

- общий заголовок для списка
- текст для каждого пункта списка

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D1%81%D0%BE%D0%B7%D0%B4%D0%B0%D0%BD%D0%B8%D1%8F-%D0%B8-%D0%B7%D0%B0"><summary>Создание и заполнение блока</summary>

[![list2-create.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/list2-create.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/list2-create.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>#### Как добавлять и удалять пункты списка?

Количество пунктов в блоке «**Список**» не ограничено. Вы можете добавить любое количество, нажав на кнопку «**Добавить элемент списка**» внизу. А удалить ненужные пункты можно, нажав на значок «**Корзина**».

<p class="callout warning">Обратите внимание, что после удаления, восстановить пункт списка невозможно.</p>

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D0%B4%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D1%8F-%D0%BD%D0%BE"><summary>Удаление и добавление пунктов</summary>

[![list3-items.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/list3-items.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/list3-items.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>#### Как изменить внешний вид?

##### Текст

Вы можете отформатировать текст внутри вкладки с помощью текстового редактора. [<span style="color: rgb(35, 111, 161);">Подробнее о редакторе.</span>](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-formatirovat-tekst)

##### Иконки

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

<details id="bkmrk-%D0%98%D0%B7%D0%BC%D0%B5%D0%BD%D0%B5%D0%BD%D0%B8%D0%B5-%D1%82%D0%B5%D0%BA%D1%81%D1%82%D0%B0-%D0%BF%D0%BE%D0%B4"><summary>Изменение иконки</summary>

[![list4-icons.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/list4-icons.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/list4-icons.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>##### Цвет

Цвет этого блока не наследуется из настроек лонгрида. Вы можете задать любой цвет для фона иконок и для самих иконок. В настройках вам предлагается 6 цветов для фона и 2 цвета для иконок (чёрный и белый).

Если вы выберете светлый фон, то, возможно, цвет иконки стоит поменять на чёрный.

<details id="bkmrk-%D0%92%D1%8B%D0%B1%D0%BE%D1%80-%D1%86%D0%B2%D0%B5%D1%82%D0%B0-%D0%A7%D1%82%D0%BE%D0%B1%D1%8B-%D1%83%D0%B2"><summary>Выбор цвета</summary>

[![list5-colors.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/list5-colors.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/list5-colors.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>Также вы можете задать свой собственный цвет с помощью HEX-кода как для фона, так и для самой иконки.

<p class="callout warning">Обратите внимание, что при вставке HEX-кода нельзя удалять символ решетки. Иначе цвет не будет работать.</p>

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D0%BE%D1%84%D0%BE%D1%80%D0%BC%D0%BB%D0%B5%D0%BD%D0%B8%D1%8F-%D0%B1%D0%BB"><summary>Добавление своего цвета</summary>

[![list6-hex.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/list6-hex.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/list6-hex.gif)

*<span style="color: rgb(149, 165, 166);">Нажмите на демонстрацию, чтобы ее увеличить.</span>*

</details>### Как я могу использовать этот блок?

Рекомендуем вам использовать блок:

- для наглядного отображения последовательности действий
- акцента на важных моментах (выводы к уроку, разделу)

# Таблица

### Как добавить этот контентный блок?

[Через меню добавления контентных блоков](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-dobavlyat-kontentnye-bloki).

<details id="bkmrk-%D0%A1%D0%BA%D1%80%D0%B8%D0%BD%D1%88%D0%BE%D1%82-%D0%BA%D0%BD%D0%BE%D0%BF%D0%BA%D0%B8-%D0%B4%D0%BE%D0%B1%D0%B0"><summary>Скриншот кнопки добавления блока в меню блоков</summary>

[![Frame 1.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/59nframe-1.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/59nframe-1.png)

</details>### Как выглядит этот контентный блок?

[![Screenshot_1.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/screenshot-1.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/screenshot-1.png)

### Могу ли я изменить его внешний вид?

Нет. Вы можете только отформатировать таблицу с помощью панели над ней.

[![Screenshot_2.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/8XHscreenshot-2.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/8XHscreenshot-2.png)

Кнопки сгруппированы по своему назначению. Разберем каждую группу:

<p class="callout info">Большинство кнопок работают относительно той строки или ячейки, в которой стоит курсор ввода. Т.е. если вы работаете со 2 строкой и нажмете «Добавить новую строку сверху», то строка добавится над 2 строкой таблицы.</p>

#### Работа со колонками

[![Screenshot_3.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/c1escreenshot-3.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/c1escreenshot-3.png)  
**Значения кнопок:**

- - - добавить колонку слева
        - добавить колонку справа
        - удалить выделенную колонку (или ту, в которой стоит курсор ввода)

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D1%80%D0%B0%D0%B1%D0%BE%D1%82%D1%8B"><summary>Пример работы</summary>

[![1.webp](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/xPP1.webp)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/xPP1.webp)

</details>---

#### Работа со строками  
[![Screenshot_4.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/screenshot-4.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/screenshot-4.png)  


**Значения кнопок:**

- - - добавить строку сверху
        - добавить строку снизу
        - удалить выделенную строку (или ту, в которой стоит курсор ввода)

---

#### Работа с ячейками  
[![Screenshot_5.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/screenshot-5.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/screenshot-5.png)

**Значения кнопок:**

- - - объединить выделенные ячейки
        - разбить выделенные ячейки

---

#### Работа с заголовками  
[![Screenshot_6.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/screenshot-6.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/screenshot-6.png)  


**Значения кнопок:**

- - выделить или снять выделение с первой колонки
    - выделить или снять выделение с первой строки

### Есть ли особенности у блока?

Да!

#### Особенность №1: Scrolltool + MS Excel или Google таблица = ❤️

Блок дружит с MS Excel и Google Таблицы. Вы можете скопировать вашу таблицу и перенести ее в лонгрид за несколько секунд.

[![Table_2.webp](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/1.webp)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/1.webp)

<p class="callout warning">Будьте осторожны с нестандартными таблицами, где есть различное форматирование и формулы.</p>

#### Особенность №2: Работа с клавиатуры

С таблицей удобно работать с клавиатуры. Рабочие кнопки:

- Tab  
    Переключает ввод на ячейку справа. Как доходит до последней ячейки, в строке происходит переключение на первую ячейку строки ниже. Если вы нажимаете клавишу в последней ячейке последней строки, то создастся новая строка. С помощью этой клавиши можно быстро заполнять ячейки таблицы и создавать новые строки не отвлекаясь на мышку.
- Клавиши стрелок  
    С их помощью можно переключаться по ячейкам и строкам. Тут все просто. Какую стрелку нажмете, туда и переместится мигающий указатель ввода.

### Как я могу использовать этот блок?

Мы рекомендуем использовать блок для того, чтобы:

- Отобразить данные в читаемом виде: например, тариф по банковской карте.
- Сравнить какие-то параметры: например, параметры разных двигателей.

# Текст

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

Через меню добавления контентных блоков. [Подробнее о блоках](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-dobavlyat-kontentnye-bloki).

<details id="bkmrk-%D0%A1%D0%BA%D1%80%D0%B8%D0%BD%D1%88%D0%BE%D1%82-%D0%BA%D0%BD%D0%BE%D0%BF%D0%BA%D0%B8-%D0%B4%D0%BE%D0%B1%D0%B0"><summary>Скриншот кнопки в меню</summary>

![text0-menu.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-10/scaled-1680-/text0-menu.jpg)

</details>### Как выглядит блок?

[![text1-look2.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/text1-look2.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/text1-look2.jpg)

### Как работать с блоком?

Все просто. Создайте блок и добавьте в него контент. В блоке «**Текст**» можно добавить:

- текст

Вы можете набрать текст вручную. Или вставить его из другого источника.

<details id="bkmrk-%D0%A1%D0%BE%D0%B7%D0%B4%D0%B0%D0%BD%D0%B8%D0%B5-%D0%B1%D0%BB%D0%BE%D0%BA%D0%B0"><summary>Создание блока</summary>

[![text2-create.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/text2-create.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/text2-create.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details><p class="callout success">Преимущество блока: Если вы копируете текст из другого источника, то большая часть форматирования текста сохранится (жирность, курсив, ссылки, верхние или нижние индексы, цитаты и т.д.).</p>

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D0%B2%D1%81%D1%82%D0%B0%D0%B2%D0%BA%D0%B8-%D1%82%D0%B5%D0%BA%D1%81%D1%82"><summary>Пример копирования текста из Википедии</summary>

[![text3-paste.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/text3-paste.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/text3-paste.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Как изменить внешний вид?

##### Текст

Вы можете отформатировать текст внутри вкладки с помощью текстового редактора.

**Возможности редактора:**

- выделение текста (курсив, жирность)
- изменение цвета текста
- добавление ссылок
- добавление заголовков 2-го и 3-го уровня
- создание списков (маркированных, нумерованных)
- добавление цитаты, разделителя
- добавление верхних и нижних индексов
- вставка кода с подсветкой
- изменить текст с помощью ИИ

Подробнее о текстовом редакторе читайте [в этой статье](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-formatirovat-tekst).

### Есть ли особенности у этого блока?

Да. Анимация проигрывается сразу на весь блок. Это означает, что во время скролла вашего лонгрида блок с текстом появляется с анимацией целиком. Если у вас большой объем текста, то он будет статичен во время скролла.

Если вы хотите чтобы блок текста аккуратно появлялся с анимацией по мере скролла, то большие объемы текста можно разбивать на отдельные текстовые блоки. Так лонгрид будет выглядеть динамичнее.

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D0%B0%D0%BD%D0%B8%D0%BC%D0%B0%D1%86%D0%B8%D0%B8-%D0%9E%D0%B1%D1%80%D0%B0"><summary>Пример анимации</summary>

<p class="callout info">Обратите внимание, первый блок появляется целиком и без анимации. Второй появляется с поэтапной анимацией.</p>

[![text_animation.webp](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-02/text-animation.webp)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-02/text-animation.webp)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Как я могу использовать этот блок?

Текст — это базовая единица контента. Пусть он и выглядит просто, не пренебрегайте им. Может, иногда стоит <span style="font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Oxygen, Ubuntu, Roboto, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif; font-size: 14px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400;">добавить аккуратно отформатированный текстовый блок </span>вместо целого зоопарка блоков и интерактивов? Сила может быть и в простоте.

#### Совет (как добавить активную ссылку на почту и телефон)  


Если вам нужно оставить в лонгриде свои контакты, то вы можете сделать их активными. Для этого можно использовать ссылку в тексте. Когда ученик нажмёт на текст с такой ссылкой, у него автоматически откроется почтовая программа, где он сразу сможет написать письмо по указанному адресу. А при просмотре лонгрида с телефона, ученик сможет нажать на указанный номер телефона, чтобы позвонить по нему.

<details id="bkmrk-%D0%9A%D0%B0%D0%BA-%D1%80%D0%B0%D0%B1%D0%BE%D1%82%D0%B0%D0%B5%D1%82-%D1%81%D1%81%D1%8B%D0%BB%D0%BA%D0%B0-"><summary>Как работает активная ссылка на почту</summary>

[![link-mailto.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-01/link-mailto.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-01/link-mailto.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>Чтобы создать такую активную ссылку, добавьте в текст ваш адрес электронной почты, выделите его и в открывшемся редакторе нажмите кнопку "**Создать гиперссылку**". [Подробнее о редакторе текста](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-formatirovat-tekst).

В открывшемся окне вставьте ссылку с текстом: **mailto:адрес электронной почты**. А вместо слов "адрес электронной почты" подставьте свою почту.

<p class="callout info">Ссылка для почты: "**mailto:адрес электронной почты**" (например: "mailto:info@scroll-tool.ru").  
</p>

Если вы хотите сделать активный номер телефона, то вставьте ссылку с текстом: **tel:номер телефона**. А вместо слов "номер телефона" подставьте свой телефон в международном формате.

<p class="callout info">Ссылка для телефона: "**tel:номер телефона**" (например: "tel:+74951202768").</p>

---

<p class="callout success">Если у вас остались вопросы, напишите нам на почту <info@scroll-tool.ru>.</p>

# Текст с изображением

Блок «**Текст с изображением**» позволяет добавить к лонгриду текст и картинку рядом с ним, и настроить их внешний вид.

### Как выглядит блок?

[![text-image1-look.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/text-image1-look.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/text-image1-look.gif)

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

Наведите курсор на линию между блоками и нажмите на появившийся значок "**плюс**", чтобы открыть меню с блоками. [Подробнее о добавлении блоков](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-dobavlyat-kontentnye-bloki).

<details id="bkmrk-"><summary>Как выглядит блок в меню</summary>

![text-image0-menu.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-10/scaled-1680-/text-image0-menu.jpg)

</details><details id="bkmrk-%D0%94%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%B1%D0%BB%D0%BE%D0%BA%D0%B0-%D0%A7%D1%82%D0%BE"><summary>Добавление блока</summary>

[![imgtext2-new.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/imgtext2-new.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/imgtext2-new.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Как изменить содержимое?

В блоке «**Текст с изображением**» можно добавить:

- изображение с компьютера
- текст

<p class="callout info">Вы можете использовать изображения в формате **JPG**, **PNG**, **GIF**, **WEBP** и **SVG**.</p>

<details id="bkmrk-%D0%A1%D0%BE%D0%B7%D0%B4%D0%B0%D0%BD%D0%B8%D0%B5-%D0%B1%D0%BB%D0%BE%D0%BA%D0%B0"><summary>Заполнение блока</summary>

Чтобы добавить своё изображение, нажмите на стартовую картинку и выберите нужный файл в проводнике. Чтобы ввести свой текст, поставьте курсор в текстовое поле и наберите его.

[![imgtext3-fill.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/imgtext3-fill.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/imgtext3-fill.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>Еще есть возможность сгенерировать картинку с помощью нейросети.

<details id="bkmrk-%D0%93%D0%B5%D0%BD%D0%B5%D1%80%D0%B0%D1%86%D0%B8%D1%8F-%D0%BA%D0%B0%D1%80%D1%82%D0%B8%D0%BD%D0%BA%D0%B8"><summary>Генерация картинки</summary>

[![bandicam 2024-07-04 13-37-00-691.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-07/bandicam-2024-07-04-13-37-00-691.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-07/bandicam-2024-07-04-13-37-00-691.gif)

</details>### Как изменить внешний вид?

В блоке «**Текст с изображением**» можно изменить:

- шаблон
- размер картинки
- форматирование текста (вы можете отформатировать текст с помощью текстового редактора. [Подробнее о редакторе](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-formatirovat-tekst).)

<details id="bkmrk-%D0%A8%D0%B0%D0%B1%D0%BB%D0%BE%D0%BD-%D0%A8%D0%B0%D0%B1%D0%BB%D0%BE%D0%BD-%D0%92%D1%8B%D0%B1%D0%BE%D1%80-"><summary>Шаблон</summary>

##### Шаблон

Выбор шаблона позволяет разместить картинку справа или слева от текста. Чтобы изменить шаблон, выберите соответствующий пункт.

[![text-image4-layout.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/text-image4-layout.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/text-image4-layout.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details><details id="bkmrk-%D0%A0%D0%B0%D0%B7%D0%BC%D0%B5%D1%80-%D0%BA%D0%B0%D1%80%D1%82%D0%B8%D0%BD%D0%BA%D0%B8-%D0%A0%D0%B0%D0%B7%D0%BC"><summary>Размер картинки</summary>

##### Размер картинки

Чтобы изменить размер изображения, двигайте ползунок ширины в правую или левую сторону. Или просто нажимайте на него в нужном месте. Текущая ширина указана в пикселях слева от ползунка. При изменении размера исходные пропорции сохраняются.

[![imgtext5-size.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/imgtext5-size.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/imgtext5-size.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Как настроить?

Вы можете запретить ученикам **увеличивать изображение**. В таком случае они смогут посмотреть его только в том размере, который вы укажете. По умолчанию увеличение изображения разрешено. Чтобы его запретить, нажмите на соответствующий переключатель.

<details id="bkmrk-%D0%9D%D0%B0%D1%81%D1%82%D1%80%D0%BE%D0%B9%D0%BA%D0%B0-%D0%B1%D0%BB%D0%BE%D0%BA%D0%B0"><summary>Запрет увеличения картинки</summary>

[![imgtext6-download.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/imgtext6-download.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/imgtext6-download.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

<p class="callout info">**Совет**: Если вы оставляете возможность для просмотра в полном размере **включенной**, то лучше не загружать в блок изображения с прозрачным фоном (такие изображения могут быть в формате png, gif, webp). Иначе при увеличении они не будут иметь фона.</p>

Пример с прозрачным фоном:

[![image3-transparent.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/image3-transparent.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/image3-transparent.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Есть ли альтернативные варианты этого блока?

Да. Вы можете добавить другой тип контентного блока <span style="color: rgb(35, 111, 161);">[<span style="color: rgb(0, 0, 0);">«</span>Изображение<span style="color: rgb(0, 0, 0);">»</span>](https://wiki.scroll-tool.ru/books/razdel-longridy/page/izobrazenie)</span>.

### Как я могу использовать этот блок?

Этот блок хорошо подходит, чтобы:

- Повысить наглядность лонгрида.  
    Вставьте свое изображение и дайте развернутый комментарий к нему.
- Украсить лонгрид или сделать акцент на какой-то теме.  
    Можно украсить текст лонгрида изображениями в тему. Так лонгрид будет восприниматься лучше.

---

<p class="callout success">Если у вас остались вопросы, напишите нам на почту <info@scroll-tool.ru>.</p>

# Тестовый вопрос

Блок «**<span class="text-xs text-[#828794] font-medium">Тестовый вопрос</span>**» это один из видов тестовых вопросов в нашем конструкторе. Его можно использовать, чтобы задавать вопросы с одним или несколькими правильными ответами.

### Как выглядит блок?

[![test1-look.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/test1-look.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/test1-look.gif)

---

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

Наведите курсор на линию между блоками и нажмите на появившийся значок "**плюс**", чтобы открыть меню с блоками. [Подробнее о добавлении блоков](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-dobavlyat-kontentnye-bloki).

<details id="bkmrk-%C2%A0"><summary>Как выглядит блок в меню</summary>

[![test1-menu.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/scaled-1680-/test1-menu.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/test1-menu.jpg)

</details><details id="bkmrk-%D0%94%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%B1%D0%BB%D0%BE%D0%BA%D0%B0-%C2%A0"><summary>Добавление блока</summary>

[![test2-new.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/test2-new.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/test2-new.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>---

### Как изменить содержимое?

В блоке «**<span class="text-xs text-[#828794] font-medium">Тестовый вопрос</span>**» можно добавить:

- текст вопроса
- варианты ответов
- изображение к вопросу
- обратную связь (рассматривается в разделе "Как настроить?")

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D1%81%D0%BE%D0%B7%D0%B4%D0%B0%D0%BD%D0%B8%D1%8F-%D0%B8-%D0%B7%D0%B0"><summary>Текст вопроса и вариантов</summary>

##### Текст вопроса и варианты ответов

Вы можете ввести свой текст, нажав на соответствующие поля.

[![test3-fill1.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/test3-fill1.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/test3-fill1.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details><details id="bkmrk-%D0%94%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%B8-%D1%83%D0%B4%D0%B0%D0%BB%D0%B5%D0%BD%D0%B8"><summary>Добавление и удаление вариантов</summary>

Количество вариантов ответа в блоке не ограничено. Вы можете добавить любое количество, нажав на кнопку «**Добавить вариант ответа**» внизу. А удалить ненужные варианты можно, нажав на значок «**Корзина**».

<p class="callout warning">Обратите внимание, что после удаления, восстановить вариант невозможно.</p>

[![test10-new.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/test10-new.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/test10-new.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details><details id="bkmrk-%D0%98%D0%B7%D0%BE%D0%B1%D1%80%D0%B0%D0%B6%D0%B5%D0%BD%D0%B8%D0%B5-%D0%98%D0%B7%D0%BE%D0%B1%D1%80%D0%B0%D0%B6%D0%B5"><summary>Изображение</summary>

##### Изображение

Вы также можете добавить картинку к вопросу. Картинка может быть только одна. В уроке она будет находиться над блоком, занимая отдельную строку.

<p class="callout info">**Совет**: Картинки, добавленные в «Тестовый вопрос», всегда будут отображаться в уроке в своём полном размере. Уменьшить их нельзя. Поэтому сразу подбирайте для блока небольшие по высоте изображения (рекомендуемая высота - не более 400 пикселей).</p>

[![test9-image.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/scaled-1680-/test9-image.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/test9-image.jpg)

Чтобы добавить изображение, раскройте поле «**Показать настройки**», затем поле «**Медиафайл к вопросу**» и загрузите изображение.

[![test9-image.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/test9-image.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/test9-image.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

<p class="callout warning">Картинки, которые вы добавляете в этот блок, всегда могут быть просмотрены учениками в полном размере.</p>

</details>---

### Как изменить внешний вид?

В блоке «**<span class="text-xs text-[#828794] font-medium">Тестовый вопрос</span>**» можно изменить:

- форматирование текста (вы можете отформатировать текст во всех полях с помощью текстового редактора. [Подробнее о редакторе](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-formatirovat-tekst).)

<p class="callout info">Цвет кнопок и выбранных вариантов наследуется из цветовой схемы лонгрида. [Подробнее о цветовой схеме](https://wiki.scroll-tool.ru/books/razdel-longridy/page/nastroika-vnesnego-vida-longrida#bkmrk--0).</p>

---

### Как настроить?

В блоке «**<span class="text-xs text-[#828794] font-medium">Тестовый вопрос</span>**» можно настроить:

- тип вопроса (вопрос с одним правильным ответом или с несколькими)
- перемешивание ответов
- оценивается или не оценивается вопрос
- количество баллов за верный ответ
- обратную связь (включить/отключить, текст сообщений, показ правильного ответа)
- количество попыток

<details id="bkmrk-%D0%9D%D0%B0%D1%81%D1%82%D1%80%D0%BE%D0%B9%D0%BA%D0%B0-%D0%BE%D1%82%D0%B2%D0%B5%D1%82%D0%BE%D0%B2-%D0%A7%D1%82"><summary>Тип вопроса</summary>

##### Тип вопроса

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

[![test3-answers.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/test3-answers.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/test3-answers.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details><details id="bkmrk-%D0%9F%D0%B5%D1%80%D0%B5%D0%BC%D0%B5%D1%88%D0%B8%D0%B2%D0%B0%D0%BD%D0%B8%D0%B5-%D0%BE%D1%82%D0%B2%D0%B5%D1%82%D0%BE"><summary>Перемешивание ответов</summary>

##### Перемешивание ответов

Вы можете настроить, будут ли ответы перемешиваться при показе вопроса в лонгриде. Для этого раскройте поле «**Показать настройки**», затем поле «**Настройки прохождения**» и нажмите на переключатель «**Перемешивать варианты ответов**».

[![test4-mix.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/test4-mix.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/test4-mix.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details><details id="bkmrk-%D0%9E%D1%86%D0%B5%D0%BD%D0%B8%D0%B2%D0%B0%D0%BD%D0%B8%D0%B5-%D0%B2%D0%BE%D0%BF%D1%80%D0%BE%D1%81%D0%B0-%D0%B8"><summary>Оценивание вопроса и баллы</summary>

##### Оценивание вопроса и баллы

По умолчанию, все тестовые вопросы оцениваются, то есть учитываются в итоговом балле. И за каждый вопрос ученик получает 10 баллов.

Вы можете изменить эти настройки. То есть выбрать, будет ли вопрос учитываться в итоговом балле за лонгрид и сколько баллов ученик получит за правильный ответ. Для этого раскройте поле «**Показать настройки**», затем поле «**Настройки прохождения**» и нажмите на переключатель «**Вопрос влияет на оценку всего курса**». Затем введите баллы за верный ответ или оставьте число по умолчанию (10 баллов).

[![test5-points.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/test5-points.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/test5-points.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details><details id="bkmrk-%D0%9E%D0%B1%D1%80%D0%B0%D1%82%D0%BD%D0%B0%D1%8F-%D1%81%D0%B2%D1%8F%D0%B7%D1%8C-%D0%B8-%D0%BF%D0%BE%D0%BF"><summary>Обратная связь и попытки</summary>

##### Обратная связь и попытки

По умолчанию, обратная связь выключена. Если вы оставите её выключенной, то у ученика будет всего 1 попытка на прохождение и после своего ответа он увидит стандартное сообщение. Это сообщение будет одинаковым, независимо от выбранного ответа.

[![test6-default.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/scaled-1680-/test6-default.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/test6-default.jpg)

Вы можете включить обратную связь. Для этого раскройте поле «**Показать настройки**», затем поле «**Обратная связь и попытки**» и нажмите на переключатель «**Обратная связь после ответа**». Здесь вы можете ввести текст для обратной связи. И задать количество попыток.

[![test7-feedback.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/test7-feedback.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/test7-feedback.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

Вы также можете включить правильный ответ в обратную связь. Тогда ученик сможет увидеть правильный ответ после своей ошибки.

[![test8-correct.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/scaled-1680-/test8-correct.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/test8-correct.jpg)

Включение правильного ответа в обратную связь:

[![test8-correct.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/test8-correct.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/test8-correct.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>---

### Есть ли альтернативные варианты этого блока?

Да. Вы можете добавить другой вид тестового вопроса: «[Ранжирование](https://wiki.scroll-tool.ru/books/razdel-longridy/page/ranzirovanie)», «[Сопоставление](https://wiki.scroll-tool.ru/books/razdel-longridy/page/sopostavlenie)» или «[Вставка пропущенных слов](https://wiki.scroll-tool.ru/books/razdel-longridy/page/vstavka-propushhennyx-slov)».

### Как я могу использовать этот блок?

Этот блок хорошо подходит, чтобы:

- Проверить знания учеников, используя вопросы с одним или несколькими вариантами ответа.

---

<p class="callout success">Если у вас остались вопросы, напишите нам на почту <info@scroll-tool.ru>.</p>

# Цитата

### Как добавить этот контентный блок?

[Через меню добавления контентных блоков](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-dobavlyat-kontentnye-bloki).

<details id="bkmrk-%D0%A1%D0%BA%D1%80%D0%B8%D0%BD%D1%88%D0%BE%D1%82-%D0%BA%D0%BD%D0%BE%D0%BF%D0%BA%D0%B8-%D0%B2-%D0%BC%D0%B5"><summary>Скриншот кнопки в меню блока</summary>

[![Frame 1.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-02/MIGframe-1.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-02/MIGframe-1.png)

</details>### Как выглядит блок?

[![Screenshot_1.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-02/scaled-1680-/DF8screenshot-1.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-02/DF8screenshot-1.png)

### Как работать с блоком?

1. Добавьте блок.
2. Впишите цитату.
3. Впишите автора цитаты.

[![Цитата-Как работать.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-05/citata-kak-rabotat.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-05/citata-kak-rabotat.gif)

### Могу ли я изменить внешний вид блока?

Да. Вы можете отформатировать текст внутри цитаты [с помощью текстового редактора](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-formatirovat-tekst).

### Есть ли особенности у блока?

Цветовое оформление блока наследуется из цветовой темы лонгрида.

### Как я могу использовать этот блок?

Этот блок хорошо подходит:

- для выделения ключевых мыслей и идей
- цитирования высказываний и источников информации

# Шаги

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

Через меню добавления контентных блоков. [<span style="color: rgb(35, 111, 161);">Подробнее о блоках</span>.](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-dobavlyat-kontentnye-bloki)

<details id="bkmrk-%D0%A1%D0%BA%D1%80%D0%B8%D0%BD%D1%88%D0%BE%D1%82-%D0%BA%D0%BD%D0%BE%D0%BF%D0%BA%D0%B8-%D0%B2-%D0%BC%D0%B5"><summary>Скриншот кнопки в меню блока</summary>

![steps0-menu.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-10/scaled-1680-/steps0-menu.jpg)

</details>### Как выглядит блок?

[![steps1-look.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/steps1-look.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/steps1-look.gif)

### Как работать с блоком?

Все просто. Создайте блок и начните заполнять пустые поля вашим контентом. В блоке «**Шаги**» можно добавить:

- название для шагов/этапов
- текст для каждого шага
- картинку для каждого шага

Картинки, которые вы добавляете в «**Шаги**», всегда могут быть просмотрены учениками в полном размере.

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D1%81%D0%BE%D0%B7%D0%B4%D0%B0%D0%BD%D0%B8%D1%8F-%D0%B8-%D0%B7%D0%B0"><summary>Создание и заполнение блока</summary>

[![steps2-create.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/steps2-create.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/tabs2-create.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>Вы можете изменить название шагов на своё усмотрение. Название, которое вы вводите в блоке, появляется в заголовке каждого шага.

<details id="bkmrk-%D0%94%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%BD%D0%B0%D0%B7%D0%B2%D0%B0%D0%BD%D0%B8%D1%8F-"><summary>Изменение названия шагов</summary>

[![steps3-name.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/steps3-name.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/steps3-name.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details><p class="callout info">Совет: Если вы оставляете возможность для просмотра в полном размере включенной, то лучше не загружать в блок изображения с прозрачным фоном (такие изображения могут быть в формате png, gif, webp). Иначе при увеличении они не будут иметь фона.</p>

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D1%81-%D0%BF%D1%80%D0%BE%D0%B7%D1%80%D0%B0%D1%87%D0%BD%D1%8B%D0%BC-"><summary>Пример с прозрачным фоном</summary>

[![image3-transparent.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/image3-transparent.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/image3-transparent.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>Еще есть возможность сгенерировать картинку с помощью нейросети.

<details id="bkmrk-%D0%93%D0%B5%D0%BD%D0%B5%D1%80%D0%B0%D1%86%D0%B8%D1%8F-%D0%BA%D0%B0%D1%80%D1%82%D0%B8%D0%BD%D0%BA%D0%B8"><summary>Генерация картинки</summary>

</details>

#### Как добавлять и удалять шаги?

Количество шагов в блоке «**Шаги**» не ограничено. Вы можете добавить любое количество, нажав на кнопку «**Добавить новый шаг**» внизу. А удалить ненужные шаги можно, нажав на значок «**Корзина**».

<p class="callout warning">Обратите внимание, что после удаления, восстановить вкладку невозможно.</p>

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D0%B4%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D1%8F-%D0%BD%D0%BE"><summary>Удаление и добавление вкладок</summary>

[![steps4-new.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/steps4-new.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/tabs3-tabs.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>#### Как изменить внешний вид?

##### Текст

Вы можете отформатировать текст внутри вкладки с помощью текстового редактора. [<span style="color: rgb(35, 111, 161);">Подробнее о редакторе.</span>](https://wiki.scroll-tool.ru/books/razdel-longridy/page/kak-formatirovat-tekst)

##### Подсказка

Вы можете изменить текст подсказки.

<details id="bkmrk-%D0%98%D0%B7%D0%BC%D0%B5%D0%BD%D0%B5%D0%BD%D0%B8%D0%B5-%D1%82%D0%B5%D0%BA%D1%81%D1%82%D0%B0-%D0%BF%D0%BE%D0%B4"><summary>Изменение текста подсказки</summary>

[![steps5-info.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/steps5-info.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-07/tabs4-info.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>##### Цвет

Цвет активного шага наследуется из цветовой темы лонгрида.

### Как я могу использовать этот блок?

Этот блок хорошо подходит:

- Для пошаговых инструкций.
- Для показа истории и таймлайна.
- Для перечисления этапов какого-либо процесса.

# Копирование контентных блоков

Вы можете копировать необходимые контентные блоки и вставлять их в рамках одного лонгрида. Так же можете скопировать в новый или другой лонгрид.

### Как копировать блок?

Все достаточно просто, нажимаете на "три точки" и появится меню где необходимо нажать "Копировать в буфер"

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-10/scaled-1680-/W2himage.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-10/W2himage.png)

### Как вставить блок?

Есть несколько вариантов как вставить блок.

Вариант первый, если требуется вставить контентный блок сразу между другими блоками. То вы наводите на поле между ними и у вас появится меню.

[![bandicam 2024-10-23 17-28-17-658.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-10/bandicam-2024-10-23-17-28-17-658.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-10/bandicam-2024-10-23-17-28-17-658.gif)

И второй вариант, в меню снизу страницы.

[![bandicam 2024-10-23 17-28-29-029.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-10/bandicam-2024-10-23-17-28-29-029.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-10/bandicam-2024-10-23-17-28-29-029.gif)

# Импорт

В этом разделе находятся статьи посвященные импорту курсов из конструкторов и документов.

# Импорт SCORM из Articulate Rise

У нас появился импорт SCORM из конструктора Articulate Rise. Загрузив архив с вашим курсом, вы сможете его редактировать на нашей площадке. А как это сделать и будет эта инструкция.

#### **Импорт курса**

Тут показано, как выглядит сам импорт. Вы выбираете необходимый SCORM пакет в формате .zip, который был сделан в Articulate Rise и загружаете его:

[![Как загрузить RISE на платформу Scroll.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-06/kak-zagruzit-rise-na-platformu-scroll.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-06/kak-zagruzit-rise-na-platformu-scroll.gif)

#### **Редактирование**

Далее, после того как нажали кнопку "Перейти" вы попадаете в стандартное редактирование курса в редакторе Scrolltool:

[![Вид из под редактора.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-06/vid-iz-pod-redaktora.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-06/vid-iz-pod-redaktora.gif)

#### **Сравнение внешнего вида готовых проектов в Scrolltool и Articulate Rise:**

**Scrolltool:**

[![Вид в предпросмотре SCROLL.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-06/vid-v-predprosmotre-scroll.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-06/vid-v-predprosmotre-scroll.gif)

**Articulate Rise:**

[![SCORM как выглядит в RISE.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-06/scorm-kak-vyglyadit-v-rise.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-06/scorm-kak-vyglyadit-v-rise.gif)

### Для чего эта функция?

Когда-то вы создали десятки, а то и сотни уникальных лонгридов:

- Они остались в Articulate Rise, к которому сейчас сложно получить доступ.
- Отредактировать курсы стало невозможно.

Это наш способ вернуть вашим курсам новую жизнь - без боли, лишних затрат и потери времени.

# Обучающие видео

Тут находятся наши видео с полезными советами, которые могут быть для вас полезны. Все видео в этом разделе относятся к разделу "Лонгриды"

# Обучающее видео блок "Диалог"

<video controls="controls" height="401" style="width: 809px; height: 401px;" width="809"> <source src="https://wiki.scroll-tool.ru/attachments/2"></source></video>

Более подробную информацию по блоку "[Диалог](https://wiki.scroll-tool.ru/books/razdel-longridy/page/dialog)" вы можете посмотреть в статье посвященный функционалу данного блока - [Диалог](https://wiki.scroll-tool.ru/books/razdel-longridy/page/dialog).

# Конвертация и Скрытие блока.

<video controls="controls" height="397" style="width: 810px; height: 397px;" width="810"> <source src="https://wiki.scroll-tool.ru/attachments/3"></source></video>

<span style="font-family: 'Arial',sans-serif; color: black; background: white;">В видео мы покажем две функции в нашем конструкторе, которые призваны ускорить разработку.   
  
Первая функция — **Конвертация блока**. </span>

<span style="font-family: 'Arial',sans-serif; color: black; background: white;">**Для чего это нужно?**</span><span style="font-family: 'Arial',sans-serif; color: black; background: white;"> </span>

<span style="font-family: 'Arial',sans-serif; color: black; background: white;">Это нужно, чтобы во время разработки курса сразу смотреть, как одна и та же информация выглядит в разных блоках, и выбрать подходящий без необходимость добавлять и удалять блоки вручную.</span><span style="font-family: 'Arial',sans-serif; color: black;">  
<span style="background: white;">Выбираете «Конвертировать». Например, посмотрим, как этот блок предупреждения выглядит в виде текста. Как видите, информация автоматически преобразуется. Можно посмотреть все варианты и оставить тот, который больше нравится.</span></span>

<span style="font-family: 'Arial',sans-serif; color: black;"><span style="background: white;">   
  
Вторая функция – **Скрыть блок**. </span></span>

<span style="font-family: 'Arial',sans-serif; color: black;"><span style="background: white;">**Зачем он нужен?** </span></span>

<span style="font-family: 'Arial',sans-serif; color: black;"><span style="background: white;">Первое назначение – посмотреть, как выглядят те или иные сочетания блоков, без необходимости удалять их и добавлять заново.   
Второе назначение – подготовить материал для согласования с руководителем или экспертом, когда нужно показать несколько вариантов материала. Третье назначение – на время скрыть блок, если информация в нем устарела, а новую еще не прислали.</span></span>

# Функционал блоков

Хоть все блоки и разные, у блоков есть и общий функционал. Подробнее расскажем вам в статьях, в этом разделе.

# Скрыть блок

Вы можете скрывать блок для ученика, чтобы он не был виден.

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-08/scaled-1680-/iluimage.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-08/iluimage.png)

Для чего это нужно?

- - Вы можете поставить разные варианты блоков и быстро скрыть ненужные в данный момент, чтобы в режиме предпросмотра посмотреть какой блок лучше подойдет в данный момент
- - Можно скрыть блок и выгрузить курс без этого блока и потом снова его вернуть и при этом не удаляя сам блок.

#### Внешний вид

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

Блок скрыт:

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-08/scaled-1680-/7L4image.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-08/7L4image.png)

Блок не скрыт:

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-08/scaled-1680-/6eaimage.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-08/6eaimage.png)

# Конвертация блока

У нас есть возможность конвертировать один блок в другой. Вы можете изменить ваш блок "Текст" на блок "Текст с изображением" или "Заголовок" и т.д.

Как это работает на примере блока "Изображение":

[![bandicam 2026-04-16 10-44-42-222.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2026-04/bandicam-2026-04-16-10-44-42-222.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2026-04/bandicam-2026-04-16-10-44-42-222.gif)

Как видим, открывается при выборе конвертации блока, нам открывается меню с блоками и подсвечены варианты, на какой блок можно конвертировать.  
  
**Перечень блоков которым доступна конвертация:**

- Заголовок
- Заголовок с подзаголовком
- Текстовый блок
- Изображение
- Текст с изображением
- Предупреждение
- Цитата
- Список
- Аккордеон
- Вкладки
- Шаги
- Слайдер
- Изображение с метками

<p class="callout warning">В случае если вы конвертируете к примеру "**Изображение**" в "**Текст с изображением**" и потом в "**Текстовый блок**", то изображение пропадет и его нужно будет загружать заново.</p>

**Для чего это нужно**

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

# Как оформить обложку лонгрида?

Рекомендуемые размеры для лонгрида на ПК 1920\*500 для ПК с разрешением 1920\*1080. Отступы со всех сторон рекомендуем сделать по 100px.

[![Frame 1.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2022-12/frame-1.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2022-12/frame-1.png)

Если лонгрид ориентирован только для прохождения на мобильных устройствах, используйте обложку 320\*500. Отступы по 30px со всех сторон.

[![size_cover_mobile.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2022-12/frame-2.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2022-12/frame-2.png)

<p class="callout info">Рекомендуем загружать обложки в формате SVG (вектор). Так у вас всегда будет самая четкая картинка :)</p>

<p class="callout warning">Это базовые рекомендации. Вы можете отклоняться от них и экспериментировать. Если найдете хорошие размеры, то напишите нам! Дополним документацию.</p>

И в завершение оформления обложки лонгрида не забудьте написать название лонгрида и его описание.

[![Screenshot_5.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2022-12/screenshot-5.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2022-12/screenshot-5.png)

<p class="callout info">Эта информация будет показана только в первом уроке. В дальнейшем всё скроется, чтобы ничего не отвлекало слушателей вашего лонгрида.</p>

# Настройка внешнего вида лонгрида

Настройка внешнего вида позволяет изменить шрифты, цвета, логотип и другие детали лонгрида. А также выбрать вид обложки. Вот так выглядит страница с настройками:

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/scaled-1680-/image.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/image.png)

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

Чтобы настроить внешний вид, нужно зайти в лонгрид и выбрать раздел «**Настройки**».

<details id="bkmrk-%D0%9E%D1%82%D0%BA%D1%80%D1%8B%D1%82%D0%B8%D0%B5-%D0%BD%D0%B0%D1%81%D1%82%D1%80%D0%BE%D0%B5%D0%BA-%D0%A7%D1%82"><summary>Открытие настроек</summary>

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/scaled-1680-/C0Vimage.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/C0Vimage.png)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>Давайте разберём каждую настройку подробнее.

### Обложка лонгрида

Обложка лонгрида в **Scrolltool** состоит из 3-х компонентов: изображение, цветной фон и заголовок.

Вы можете управлять всеми этими компонентами. А также выбрать, какие из них будут видны и в каком сочетании. Для этого нужно выбрать тип обложки. Всего их шесть:

- Текст на обложке (выбран по умолчанию)
- Текст на сплошном фоне
- Текст снизу
- Текст справа
- Текст слева
- Без обложки

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80%D1%8B-%D0%BE%D0%B1%D0%BB%D0%BE%D0%B6%D0%B5%D0%BA-%D0%B2-%D0%BA%D0%B0"><summary>Примеры обложек в каждом типе</summary>

##### Текст на обложке

[![op1-type1.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-08/scaled-1680-/op1-type1.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-08/op1-type1.jpg)

##### Текст на сплошном фоне

[![op1-type2.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-08/scaled-1680-/op1-type2.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-08/op1-type2.jpg)

##### Текст снизу

[![op1-type3.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-08/scaled-1680-/op1-type3.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-08/op1-type3.jpg)

##### Текст справа

[![op1-type4.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-08/scaled-1680-/op1-type4.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-08/op1-type4.jpg)

##### Текст слева

[![op1-type5.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-08/scaled-1680-/op1-type5.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-08/op1-type5.jpg)

##### Без обложки

[![op1-type6.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-08/scaled-1680-/op1-type6.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-08/op1-type6.jpg)

</details>На следующей таблице отмечено, какие компоненты скрыты или показаны в разных типах.

<table border="1" class="align-center" id="bkmrk-%D0%98%D0%B7%D0%BE%D0%B1%D1%80%D0%B0%D0%B6%D0%B5%D0%BD%D0%B8%D0%B5-%D0%A4%D0%BE%D0%BD-%D0%97%D0%B0%D0%B3%D0%BE" style="border-collapse: collapse; width: 100%; border-width: 1px;"><colgroup><col style="width: 24.9629%;"></col><col style="width: 24.9629%;"></col><col style="width: 24.9629%;"></col><col style="width: 24.9629%;"></col></colgroup><thead><tr><td style="border-width: 1px;">  
</td><td style="border-width: 1px;">**Изображение**  
</td><td style="border-width: 1px;">**Фон**  
</td><td style="border-width: 1px;">**Заголовок**  
</td></tr></thead><tbody><tr><td style="border-width: 1px;">**Текст на обложке**</td><td style="border-width: 1px;">**+**  
</td><td style="border-width: 1px;">**+**  
</td><td style="border-width: 1px;">**+**  
</td></tr><tr><td style="border-width: 1px;">**Текст на сплошном фоне**</td><td style="border-width: 1px;">  
</td><td style="border-width: 1px;">**+**  
</td><td style="border-width: 1px;">**+**  
</td></tr><tr><td style="border-width: 1px;">**Текст снизу**</td><td style="border-width: 1px;">**+**  
</td><td style="border-width: 1px;">**+**  
</td><td style="border-width: 1px;">**+**  
</td></tr><tr><td style="border-width: 1px;">**Текст справа**</td><td style="border-width: 1px;">**+**  
</td><td style="border-width: 1px;">**+**  
</td><td style="border-width: 1px;">**+**  
</td></tr><tr><td style="border-width: 1px;">**Текст слева**</td><td style="border-width: 1px;">**+**  
</td><td style="border-width: 1px;">**+**  
</td><td style="border-width: 1px;">**+**  
</td></tr><tr><td style="border-width: 1px;">**Без обложки**</td><td style="border-width: 1px;">  
</td><td style="border-width: 1px;">  
</td><td style="border-width: 1px;">  
</td></tr></tbody></table>

Как видно из таблицы, последний тип («**Без обложки**») полностью скрывает все 3 компонента. Фактически лонгрид не имеет обложки. Второй тип («**Текст на сплошном фоне**») скрывает изображение и показывает только фон с заголовком. В остальных типах видны все 3 компонента.

Рассмотрим каждый компонент отдельно.

##### Изображение

Чтобы выбрать изображение для обложки, зайдите в лонгрид и нажмите на кнопку «**Сменить изображение**» в правом верхнем углу. Затем выберите изображение с компьютера.

<details id="bkmrk-%C2%A0"><summary>Загрузить изображение</summary>

[![Настройка внешнего вида проекта-Загрузить изображение.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-05/nastroika-vnesnego-vida-proekta-zagruzit-izobrazenie.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-05/nastroika-vnesnego-vida-proekta-zagruzit-izobrazenie.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>##### Фон

Фон используется в 5 типах обложки, а в первом типе («**Текст на обложке**») он накладывается поверх загруженного изображения. Вы можете менять цвет и прозрачность фона.

По умолчанию установлен белый цвет фона. Но вы можете поменять его на любой цвет из предложенных, или на цвет цветовой схемы.

<details id="bkmrk-%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80-%D0%BD%D0%B0%D1%81%D1%82%D1%80%D0%BE%D0%B9%D0%BA%D0%B8-%D1%84%D0%BE%D0%BD"><summary>Выбор цвета фона</summary>

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/scaled-1680-/HvLimage.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/HvLimage.png)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>По умолчанию прозрачность фона установлена на 75%. Если выбрать число больше, то фон станет темнее, а если меньше — то светлее.

<details id="bkmrk-%D0%92%D1%8B%D0%B1%D0%BE%D1%80-%D0%BF%D1%80%D0%BE%D0%B7%D1%80%D0%B0%D1%87%D0%BD%D0%BE%D1%81%D1%82%D0%B8-%D1%84"><summary>Выбор прозрачности фона</summary>

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/scaled-1680-/6Ddimage.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/6Ddimage.png)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>##### Заголовок

В настройках вы можете выбрать цвет для заголовка лонгрида.

<details id="bkmrk-%D0%92%D1%8B%D0%B1%D0%BE%D1%80-%D1%86%D0%B2%D0%B5%D1%82%D0%B0-%D0%B7%D0%B0%D0%B3%D0%BE%D0%BB%D0%BE%D0%B2%D0%BA"><summary>Выбор цвета заголовка</summary>

![](https://wiki.scroll-tool.ru/loading.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details><p class="callout info">Обратите внимание, что цвет текста для описания лонгрида задается в самом лонгриде с помощью выделения.</p>

### Цветовая схема лонгрида

В конструкторе **Scrolltool** есть возможность задать цвет для элементов интерфейса лонгрида. Для этого используется цветовая схема. Цвет, выбранный для цветовой схемы, наследуется многими контентными блоками как основной.

Вы можете выбрать цвет из системной палитры, в которой есть 20 цветов, в том числе чёрный и белый. Посмотреть все 20 цветов можно в блоке «**Палитра**». А чтобы выбрать какой-то цвет, раскройте список «**Цветовая схема лонгрида**» и выберите нужный цвет.

<details id="bkmrk-%D0%92%D1%8B%D0%B1%D0%BE%D1%80-%D0%BE%D1%81%D0%BD%D0%BE%D0%B2%D0%BD%D0%BE%D0%B3%D0%BE-%D1%86%D0%B2%D0%B5%D1%82"><summary>Выбор основного цвета лонгрида</summary>

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/scaled-1680-/lDKimage.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/lDKimage.png)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>#### Как добавить свой цвет

Вы можете также добавить свой собственный цвет. Для этого скопируйте HEX-код своего цвета и вставьте его в окошко «**Своя палитра**». Затем нажмите кнопку «**Добавить цвет**».

<details id="bkmrk-%D0%94%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D1%81%D0%B2%D0%BE%D0%B5%D0%B3%D0%BE-%D1%86%D0%B2"><summary>Добавление своего цвета</summary>

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/scaled-1680-/XCtimage.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/XCtimage.png)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>После этого ваш цвет появится в списке «**Цветовая схема лонгрида**» и вы сможете выбрать его, чтобы применить к лонгриду.

<details id="bkmrk-%D0%A7%D1%82%D0%BE%D0%B1%D1%8B-%D1%83%D0%B2%D0%B5%D0%BB%D0%B8%D1%87%D0%B8%D1%82%D1%8C-%D0%B4%D0%B5%D0%BC%D0%BE"><summary>Выбор своего цвета</summary>

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/scaled-1680-/bbAimage.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/bbAimage.png)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details><p class="callout warning">Обязательно вставлять HEX-код без символа решётки (**\#**), иначе цвет не будет работать.</p>

### Логотип

Вы можете добавить логотип вашей компании на верхнюю панель лонгрида. Для этого подготовьте изображение на прозрачном фоне (формат "**png**") и загрузите его в поле «**Логотип**» в «**Настройках**» лонгрида.

<details id="bkmrk-%D0%94%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%BB%D0%BE%D0%B3%D0%BE%D1%82%D0%B8%D0%BF%D0%B0-"><summary>Добавление логотипа</summary>

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/scaled-1680-/AJMimage.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/AJMimage.png)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details><p class="callout info">Обратите внимание, что верхняя панель лонгрида всегда остается тёмной, поэтому старайтесь выбирать логотип светлого цвета.</p>

### Время на прохождение

Вы можете добавить время на изучение. Оно будет отображаться на обложке лонгрида. Если вы выбрали тип обложки «**Без обложки**», то эта настройка работать не будет.

Чтобы включить эту настройку, нажмите переключатель «**Демонстрация времени на изучение**» и введите минуты в появившемся ниже поле.

<details id="bkmrk-%D0%94%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%B2%D1%80%D0%B5%D0%BC%D0%B5%D0%BD%D0%B8-%D0%A7"><summary>Добавление времени</summary>

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/scaled-1680-/85Rimage.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/85Rimage.png)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Цвет хедера

Вы можете выбрать цвет из системной палитры, в которой есть 20 цветов, в том числе чёрный и белый. Посмотреть все 20 цветов можно в блоке «**Внешний вид**». А чтобы выбрать какой-то цвет, раскройте список «**Цветовая схема**» и выберите нужный цвет.

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2026-04/scaled-1680-/YyWimage.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2026-04/YyWimage.png)

### Шрифты лонгрида

В конструкторе **Scrolltool** есть возможность задать шрифты для всего лонгрида. Вы можете выбрать начертание шрифта и его размер. При этом, шрифты для заголовков и для основного текста задаются отдельно.

Чтобы настроить шрифт, зайдите в «**Настройки**» и перейдите на вкладку «**Шрифты и размеры**». Здесь можно выбрать 4 вида шрифта:

- шрифт для заголовка лонгрида
- шрифт для описания лонгрида
- шрифт для заголовка блока
- шрифт для основного текста

<details id="bkmrk-%D0%92%D1%8B%D0%B1%D0%BE%D1%80-%D1%88%D1%80%D0%B8%D1%84%D1%82%D0%B0-%D0%A7%D1%82%D0%BE%D0%B1%D1%8B-%D1%83"><summary>Выбор шрифта</summary>

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/scaled-1680-/5zKimage.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/5zKimage.png)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>Вы также можете загрузить свой собственный шрифт. Для этого нажмите на кнопку «**Добавить пользовательский шрифт**», перед вами появится окно для добавления шрифта, где нужно ввести имя шрифта и загрузить файл с компьютера.

<details id="bkmrk-%D0%97%D0%B0%D0%B3%D1%80%D1%83%D0%B7%D0%BA%D0%B0-%D1%81%D0%B2%D0%BE%D0%B5%D0%B3%D0%BE-%D1%88%D1%80%D0%B8%D1%84"><summary>Загрузка своего шрифта</summary>

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/scaled-1680-/NQ4image.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/NQ4image.png)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details><p class="callout info">Желательно добавлять шрифты в формате "**ttf**".</p>

Теперь этот шрифт появится в списке шрифтов, и вы сможете выбрать его в любом из 4-х полей. Он будет иметь то имя, которое вы ввели при загрузке.

<details id="bkmrk-%D0%92%D1%8B%D0%B1%D0%BE%D1%80-%D1%81%D0%B2%D0%BE%D0%B5%D0%B3%D0%BE-%D1%88%D1%80%D0%B8%D1%84%D1%82%D0%B0-"><summary>Выбор своего шрифта</summary>

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/scaled-1680-/X0zimage.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/X0zimage.png)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Наименование уроков

В конструкторе **Scrolltool** есть возможность изменить слово, которым называются уроки лонгрида. По умолчанию, в начале каждого урока стоит заголовок «**Урок**» и порядковый номер урока. Но если вам не подходит слово «Урок» и вы хотите, чтобы уроки назывались по-другому, вы можете легко изменить это в настройках лонгрида.

Для этого зайдите в «**Настройки**» и перейдите на вкладку «**Плеер и навигация**». Здесь вы увидите поле, где написано слово «Урок». Вместо него вы можете вписать любое другое слово. Затем кликните мышкой вне этого поля, чтобы сохранить изменения.

<details id="bkmrk-%D0%98%D0%B7%D0%BC%D0%B5%D0%BD%D0%B5%D0%BD%D0%B8%D0%B5-%D0%BD%D0%B0%D0%B8%D0%BC%D0%B5%D0%BD%D0%BE%D0%B2%D0%B0%D0%BD-0"><summary>Изменение наименования уроков</summary>

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/scaled-1680-/7oGimage.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/7oGimage.png)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>

# Как правильно завершить лонгрид?

**Для корректного завершения добавьте один из этих блоков в конец лонгрид:**

- [Результаты с оценкой](https://wiki.scroll-tool.ru/books/razdel-longridy/page/rezultaty-s-ocenkoi)  
    Когда нужно передать статус лонгрида и набранный балл.
- [Результаты без оценки](https://wiki.scroll-tool.ru/books/razdel-longridy/page/rezultaty-bez-ocenki)  
    Когда нужно передать статус лонгрида 100 баллов, а еще хочется красиво оформить блок.
- [Кнопка завершения просмотра](https://wiki.scroll-tool.ru/books/razdel-longridy/page/knopka-zaverseniya-prosmotra)  
    Когда нужно передать статус лонгрида 100 баллов, и для этого хватит простой кнопки.

Подробное описание каждого блока вы можете прочитать перейдя по ссылкам.

# Папки для лонгридов

В модуле «**Лонгриды**» есть возможность объединять отдельные лонгриды в папках. Это помогает организовать хранение лонгридов, особенно, если их накопилось очень много. Вот как выглядят папки в модуле:

[![folders0-view.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-12/scaled-1680-/folders0-view.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-12/folders0-view.jpg)

Вы можете:

- создать папку
- перенести в неё лонгриды
- переименовать папку
- удалить папку.

### Как создать папку

Чтобы создать папку, зайдите в модуль «**Лонгриды**» и нажмите кнопку «**Добавить папку**» в верхней части экрана. Появится форма для заполнения, где нужно указать название папки. Введите название и нажмите кнопку «**Сохранить**». После этого вы попадёте внутрь вновь созданной папки.

<details id="bkmrk-%D0%A1%D0%BE%D0%B7%D0%B4%D0%B0%D0%BD%D0%B8%D0%B5-%D0%BD%D0%BE%D0%B2%D0%BE%D0%B9-%D0%BF%D0%B0%D0%BF%D0%BA%D0%B8"><summary>Создание новой папки</summary>

[![folders1a-new.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-12/folders1a-new.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-12/folders1a-new.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>Внутри новой папки вы можете создать новый лонгрид. Для этого нажмите на кнопку «**Добавить лонгрид**».

<details id="bkmrk-%D0%A1%D0%BE%D0%B7%D0%B4%D0%B0%D0%BD%D0%B8%D0%B5-%D0%BA%D1%83%D1%80%D1%81%D0%B0-%D0%B2%D0%BD%D1%83%D1%82%D1%80"><summary>Создание лонгрида внутри папки</summary>

[![folders2-makecourse.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-12/scaled-1680-/folders2-makecourse.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-12/folders2-makecourse.jpg)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить изображение, нажмите на него.</span>*

</details>### Как перенести лонгрид в папку

Вы также можете перенести в созданную папку уже существующие лонгриды. Для этого вернитесь в общую папку с лонгридами, нажав на её название в верхней части экрана.

<details id="bkmrk-%D0%92%D0%B5%D1%80%D0%BD%D1%83%D1%82%D1%8C%D1%81%D1%8F-%D0%B2-%22%D0%9F%D1%80%D0%BE%D0%B5%D0%BA%D1%82%D1%8B"><summary>Вернуться в "Лонгриды"</summary>

[![folders3-backtomain.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-12/scaled-1680-/folders3-backtomain.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-12/folders3-backtomain.jpg)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить изображение, нажмите на него.</span>*

</details>Теперь вы увидите свою папку над всеми имеющимися лонгриды.

<details id="bkmrk-%D0%92%D0%B0%D1%88%D0%B0-%D0%BF%D0%B0%D0%BF%D0%BA%D0%B0-%D0%B2-%22%D0%9F%D1%80%D0%BE%D0%B5%D0%BA%D1%82"><summary>Ваша папка в "Лонгриды"</summary>

[![folders4-appear.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-12/scaled-1680-/folders4-appear.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-12/folders4-appear.jpg)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить изображение, нажмите на него.</span>*

</details>Чтобы перенести лонгрид, нажмите на значок «**три точки**» в нижнем правом углу лонгрида. В появившемся меню выберите значок «**Переместить в папку**». Нажмите на него, и перед вами откроется окно с выбором папки. Выберите нужную папку и нажмите «**Сохранить**». После этого вы попадёте внутрь папки и увидите перемещённый лонгрид.

<details id="bkmrk-%D0%9F%D0%B5%D1%80%D0%B5%D0%BC%D0%B5%D1%89%D0%B5%D0%BD%D0%B8%D0%B5-%D0%BA%D1%83%D1%80%D1%81%D0%B0-%D0%B2-"><summary>Перемещение лонгрида в папку</summary>

[![folders5-replace.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-12/folders5-replace.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-12/folders5-replace.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>Если вы захотите вернуть лонгрид обратно в общую папку, сделайте это таким же образом, но выбрав в окне папку «**Лонгриды**».

<details id="bkmrk-%D0%9F%D0%B5%D1%80%D0%B5%D0%BC%D0%B5%D1%89%D0%B5%D0%BD%D0%B8%D0%B5-%D0%BE%D0%B1%D1%80%D0%B0%D1%82%D0%BD%D0%BE-"><summary>Перемещение обратно в "Лонгриды"</summary>

[![folders6-replaceback.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-12/folders6-replaceback.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-12/folders6-replaceback.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Как переименовать папку

Вы можете изменить название уже созданной папки. Для этого нажмите на значок «**три точки**» рядом с именем папки и выберите значок «**Переименовать**». Перед вами откроется окно, где вы сможете ввести новое имя. Чтобы подтвердить, нажмите кнопку «**Переименовать**».

<details id="bkmrk-%D0%9F%D0%B5%D1%80%D0%B5%D0%B8%D0%BC%D0%B5%D0%BD%D0%BE%D0%B2%D0%B0%D0%BD%D0%B8%D0%B5-%D0%BF%D0%B0%D0%BF%D0%BA%D0%B8"><summary>Переименование папки</summary>

[![folders7-rename.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-12/folders7-rename.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-12/folders7-rename.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Как удалить папку

Вы можете удалить созданную папку. Для этого нажмите на значок «**три точки**» рядом с именем папки и выберите значок «**Удалить**». Перед вами откроется окно с предупреждением. Чтобы подтвердить удаление, нажмите кнопку «**Удалить**».

<details id="bkmrk-%D0%A3%D0%B4%D0%B0%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%BF%D0%B0%D0%BF%D0%BA%D0%B8-%D0%A7%D1%82%D0%BE%D0%B1%D1%8B"><summary>Удаление папки</summary>

[![folders8-delete.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-12/folders8-delete.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-12/folders8-delete.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details><p class="callout warning">**При удалении папки удаляются все лонгриды, находящиеся внутри неё.**</p>

<p class="callout warning">**Удалённую папку невозможно восстановить.**</p>

---

<p class="callout success">Если у вас остались вопросы, напишите нам на почту <info@scroll-tool.ru>.</p>

# Как создать новый лонгрид?

**Есть несколько способов создания нового лонгрида:**

1. По кнопке «Добавить лонгрид»  
    [![gif-1.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2022-12/gif-1.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2022-12/gif-1.gif)  
    *<span style="color: rgb(149, 165, 166);">Чтобы увеличить картинку нажми на нее</span>*
2. По заглушке нового курса в общем списке лонгридов  
    [![gif-2.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2022-12/gif-2.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2022-12/gif-2.gif)  
    *<span style="color: rgb(149, 165, 166);">Чтобы увеличить картинку нажми на нее</span>*

# Экспорт лонгрида

Для того, чтобы ученики могли пройти лонгрид, его сначала необходимо **экспортировать**. Вот так выглядит страница экспорта лонгрида:

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-09/scaled-1680-/chkimage.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-09/chkimage.png)

В **Scrolltool** есть возможность делать экспорт лонгрида в разные форматы. Всего таких форматов 4:

- Экспорт в SCORM
- Экспорт в СДО
- Запустить обучение
- Web-версия

Все эти форматы предназначены для разных целей. Ниже мы подробно рассмотрим, как создается и для чего используется каждый из форматов.

### Запустить обучение

В этом разделе экспорта у вас есть 3 варианта выбора экспорта - Ссылка без авторизации, Ссылка с авторизацией и Отправка лонгридов по E-Mail.

#### Ссылка без авторизации

Для этого зайдите в лонгрид, нажмите на раздел «**Экспорт**» и выберите «**Ссылка без авторизации**». Нажмите кнопку «**Опубликовать**». И перед вами появится ссылка.

<details id="bkmrk-%D0%A7%D1%82%D0%BE%D0%B1%D1%8B-%D1%83%D0%B2%D0%B5%D0%BB%D0%B8%D1%87%D0%B8%D1%82%D1%8C-%D0%B4%D0%B5%D0%BC%D0%BE"><summary>Создание ссылки</summary>

[![bandicam 2024-08-29 12-27-05-741.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-08/bandicam-2024-08-29-12-27-05-741.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-08/bandicam-2024-08-29-12-27-05-741.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>Вы можете сразу перейти по этой ссылке. Или скопировать её, нажав на значок «**Копия**».

<details id="bkmrk-%D0%A7%D1%82%D0%BE%D0%B1%D1%8B-%D1%83%D0%B2%D0%B5%D0%BB%D0%B8%D1%87%D0%B8%D1%82%D1%8C-%D0%B4%D0%B5%D0%BC%D0%BE-0"><summary>Копирование и открытие ссылки</summary>

[![bandicam 2024-08-29 14-39-14-189.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-08/bandicam-2024-08-29-14-39-14-189.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-05/eksport-proekta-perexod-po-ssylke.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>По умолчанию ссылка работает без пароля. Но вы можете его добавить. Чтобы добавить пароль, нажмите на зелёную кнопку «**Задать пароль**» и введите придуманный вами пароль. Нажмите «**Сохранить**». Теперь, при переходе по ссылке, появится окно для введения пароля.

<details id="bkmrk-%D0%94%D0%BE%D0%B1%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%BF%D0%B0%D1%80%D0%BE%D0%BB%D1%8F-%D0%A7%D1%82"><summary>Добавление пароля</summary>

[![bandicam 2024-08-29 14-31-45-206.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-08/bandicam-2024-08-29-14-31-45-206.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-05/eksport-proekta-sozdanie-parolya.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>Если вы подозреваете, что пароль попал в ненадёжные руки, вы в любой момент можете его удалить и создать новый.

<details id="bkmrk-%D0%A3%D0%B4%D0%B0%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%BF%D0%B0%D1%80%D0%BE%D0%BB%D1%8F-%D0%A7%D1%82%D0%BE%D0%B1"><summary>Удаление пароля</summary>

[![bandicam 2024-08-29 14-32-28-389.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-08/bandicam-2024-08-29-14-32-28-389.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-05/eksport-proekta-udalenie-parolya.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>Также вы можете удалить ранее созданную ссылку на лонгрид, чтобы закрыть к нему доступ. Или создать новую ссылку. При этом старая ссылка перестанет работать.

<details id="bkmrk-%D0%A3%D0%B4%D0%B0%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D1%81%D1%81%D1%8B%D0%BB%D0%BA%D0%B8-%D0%A7%D1%82%D0%BE%D0%B1"><summary>Удаление ссылки</summary>

[![bandicam 2024-08-29 14-32-39-896.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-08/bandicam-2024-08-29-14-32-39-896.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-05/eksport-proekta-udalenie-ssylki.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>Таким образом, вы можете закрывать доступ к лонгриду людям, которым выдали его ранее. И открывать доступ для новых людей.

#### Ссылка с авторизацией

Для этого зайдите в лонгрид, нажмите на раздел «**Экспорт**» и выберите «**Ссылка с авторизации**». Нажмите кнопку «**Опубликовать**». И перед вами появится ссылка.

<details id="bkmrk-%D0%A1%D0%BE%D0%B7%D0%B4%D0%B0%D0%BD%D0%B8%D0%B5-%D1%81%D1%81%D1%8B%D0%BB%D0%BA%D0%B8-%D0%A7%D1%82%D0%BE%D0%B1"><summary>Создание ссылки</summary>

[![bandicam 2025-01-22 12-24-02-992.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-01/bandicam-2025-01-22-12-24-02-992.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-01/bandicam-2025-01-22-12-24-02-992.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>Вы можете настроить что именно должен указать ученик, для авторизации.

<details id="bkmrk-%D0%9D%D0%B0%D1%81%D1%82%D1%80%D0%BE%D0%B9%D0%BA%D0%B8-%D0%B0%D0%B2%D1%82%D0%BE%D1%80%D0%B8%D0%B7%D0%B0%D1%86%D0%B8"><summary>Настройки авторизации</summary>

[![bandicam 2025-01-22 12-24-21-260.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-01/bandicam-2025-01-22-12-24-21-260.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-01/bandicam-2025-01-22-12-24-21-260.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>После чего ученик будет видеть вот такое окно авторизации.

<details id="bkmrk-%D0%9E%D0%BA%D0%BD%D0%BE-%D0%B0%D0%B2%D1%82%D0%BE%D1%80%D0%B8%D0%B7%D0%B0%D1%86%D0%B8%D0%B8-%D0%A7%D1%82%D0%BE"><summary>Окно авторизации</summary>

[![bandicam 2025-01-22 12-24-29-854.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-01/bandicam-2025-01-22-12-24-29-854.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-01/bandicam-2025-01-22-12-24-29-854.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>Также вы можете удалить ранее созданную ссылку на лонгрид, чтобы закрыть к нему доступ. Или создать новую ссылку. При этом старая ссылка перестанет работать.

<details id="bkmrk-%D0%A3%D0%B4%D0%B0%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D1%81%D1%81%D1%8B%D0%BB%D0%BA%D0%B8-%D0%A7%D1%82%D0%BE%D0%B1-0"><summary>Удаление ссылки</summary>

[![bandicam 2025-01-22 12-24-11-281.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-01/bandicam-2025-01-22-12-24-11-281.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-01/bandicam-2025-01-22-12-24-11-281.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>После прохождения курса вы в модуле Отчеты может посмотреть как ученик прошел тот или иной курс. Подробнее про этот тип отчета можно узнать в "[Лонгриды отправленные ссылкой с авторизацией](https://wiki.scroll-tool.ru/books/razdel-otcety/page/longridy-otpravlennye-ssylkoi-s-avtorizaciei)"

[![Снимок экрана 2025-01-21 151951.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-01/scaled-1680-/snimok-ekrana-2025-01-21-151951.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-01/snimok-ekrana-2025-01-21-151951.png)

<p class="callout warning">В отчетах вы сможете увидеть только если лонгрид был запущен как "Ссылка с авторизацией" или "[Отправка лонгрида по E-Mail](https://wiki.scroll-tool.ru/books/razdel-longridy/page/otpravka-longrida-po-e-mail)"</p>

#### Отправка лонгрида по E-Mail

Можно запустить обучение в несколько потоков прямо из конструктора. Этот функционал поможет вам если вы решили запустить обучение без использования LMS. Подробнее вы сможете узнать в разделе "[Отправка лонгрида по E-Mail](https://wiki.scroll-tool.ru/books/razdel-longridy/page/otpravka-longrida-po-e-mail)"

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-01/scaled-1680-/image.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-01/image.png)

### Web-версия

Этот формат позволяет сохранить лонгрид на компьютер в виде веб-сайта. После публикации будет создан архив со всеми ресурсами лонгрида(уроки, изображения, встроенные видео и файлы), который скачается на ваш компьютер.

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

Используйте этот формат, чтобы запустить лонгрид локально, то есть без подключения к интернету. Или чтобы сохранить себе резервную копию лонгрида на случай форс-мажора.

#### Как сделать экспорт

Для этого зайдите в лонгрид, нажмите на раздел «**Экспорт**» и выберите «**Веб-версия**». Нажмите кнопку «**Опубликовать**». После этого произойдет автоматическое скачивание архива на компьютер.

<details id="bkmrk-%D0%A1%D0%BE%D0%B7%D0%B4%D0%B0%D0%BD%D0%B8%D0%B5-%D0%B0%D1%80%D1%85%D0%B8%D0%B2%D0%B0-%D0%A7%D1%82%D0%BE%D0%B1"><summary>Создание архива</summary>

[![bandicam 2024-08-29 12-28-51-306.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-08/bandicam-2024-08-29-12-28-51-306.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-08/bandicam-2024-08-29-12-28-51-306.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>Чтобы открыть такой лонгрид, нужно распаковать архив, найти файл под названием «index.html» и открыть этот файл с помощью любого браузера.

<details id="bkmrk-%D0%9E%D1%82%D0%BA%D1%80%D1%8B%D1%82%D0%B8%D0%B5-%D0%BA%D1%83%D1%80%D1%81%D0%B0-%D0%A7%D1%82%D0%BE%D0%B1%D1%8B"><summary>Открытие лонгрида</summary>

[![ex7-web2.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-08/ex7-web2.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-08/ex7-web2.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>А чтобы передать лонгрид другому человеку, нужно скопировать и отправить ему полученный архив.

### SCORM 2004 и 1.2  


Эти форматы позволяют разместить лонгрид в системе СДО, чтобы получать статистику о прохождении лонгрида учащимися. Почти все современные СДО-системы поддерживают формат SCORM 2004 или 1.2.

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

Используйте этот формат, чтобы запустить обучение в вашей системе СДО.

#### Как сделать экспорт

Эти виды экспорта похожи, поэтому мы опишем их на примере SCORM 2004.

Чтобы сделать экспорт, зайдите в лонгрид, нажмите на раздел «**Экспорт**» и выберите «**SCORM 2004**» или «**SCORM 1.2**». Нажмите кнопку «**Экспортировать**». После этого произойдет автоматическое скачивание архива на компьютер.

<details id="bkmrk-%D0%A1%D0%BE%D0%B7%D0%B4%D0%B0%D0%BD%D0%B8%D0%B5-%D0%B0%D1%80%D1%85%D0%B8%D0%B2%D0%B0-%D0%A7%D1%82%D0%BE%D0%B1-0"><summary>Создание архива</summary>

[![bandicam 2024-08-29 12-25-54-019.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-08/bandicam-2024-08-29-12-25-54-019.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-05/eskport-proekta-sozdanie-arxiva.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>Загрузите получившийся архив в свою систему СДО.

### Экспорт в Word

Лонгрид можно выгрузить в как Word-документв, в формате .docx.

<details id="bkmrk-%D0%9A%D0%B0%D0%BA-%D1%81%D0%B4%D0%B5%D0%BB%D0%B0%D1%82%D1%8C-%D1%8D%D0%BA%D1%81%D0%BF%D0%BE%D1%80%D1%82-"><summary>Как сделать экспорт в Word</summary>

В меню выбора экспорта выбираете "**Microsoft Word**"

![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-08/scaled-1680-/K1Wimage.png)

И нажимаете кнопку "Экспортировать"

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-08/scaled-1680-/z0Fimage.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-08/z0Fimage.png)

После у вас скачивается .docx файл с названием вашего лонгрида и файл уже можно открыть в текстовом редакторе, который поддерживает, формат - .docx.

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-08/scaled-1680-/ao7image.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-08/ao7image.png)

</details>### Экспорт в СДО

Этот формат позволяет напрямую передать лонгрид в СДО, минуя этап сохранения лонгрида в формате SCORM.

<p class="callout success">На данный момент поддерживается интеграция с СДО "**Teachbase**", "**Moodle**" и "**Эквио**".  
</p>

Чтобы делать прямой экспорт лонгридов, необходимо сначала включить интеграцию сервиса **Scrolltool** с СДО-системой. Для этого достаточно ввести в аккаунте **Scrolltool** ключи для интеграции. Подробнее об этом можно прочитать в статье «[Аккаунт](https://wiki.scroll-tool.ru/link/49#bkmrk-%D0%98%D0%BD%D1%82%D0%B5%D0%B3%D1%80%D0%B0%D1%86%D0%B8%D0%B8)».

<details id="bkmrk-%D0%AD%D0%BA%D1%81%D0%BF%D0%BE%D1%80%D1%82-%D0%B2-%22teachbase"><summary>Экспорт в "Teachbase"</summary>

Перед тем, как сделать экспорт, вам нужно будет подготовить место для экспорта, а для этого создать пустой курс в системе Teachbase. И создать в нём как минимум один раздел.

<details id="bkmrk-%D0%A1%D0%BE%D0%B7%D0%B4%D0%B0%D0%BD%D0%B8%D0%B5-%D0%BA%D1%83%D1%80%D1%81%D0%B0-%D0%B2-tea"><summary>Создание курса в Teachbase</summary>

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-08/scaled-1680-/image.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-08/image.png)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить изображение, нажмите на него.</span>*

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-08/scaled-1680-/qCwimage.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-08/qCwimage.png)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить изображение, нажмите на него.</span>*

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-08/scaled-1680-/qBoimage.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-08/qBoimage.png)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить изображение, нажмите на него.</span>*

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-08/scaled-1680-/nmuimage.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-08/nmuimage.png)

*<span style="color: rgb(149, 165, 166);">  
</span>*

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить изображение, нажмите на него.</span>*

</details>После этого зайдите в лонгрид в сервисе **Scrolltool**, нажмите на раздел «**Экспорт**» и выберите «**Экспорт в СДО**». В поле «Лонгриды» выберите созданный вами новый лонгрида в Teachbase. Затем появится поле «**Секции**», где вы сможете выбрать раздел. И затем нажмите кнопку «**Опубликовать**».

[![ex12-sdo.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-08/ex12-sdo.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-08/ex12-sdo.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

Теперь лонгрид появится в системе Teachbase в том разделе, в котором вы его опубликовали.

[![ex13-sdolook2.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-08/ex13-sdolook2.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-08/ex13-sdolook2.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details><p class="callout info">Для корректной работы интеграции версия вашей системы "**Moodle**" должна быть не ниже версии 4.0.</p>

<details id="bkmrk-%D0%AD%D0%BA%D1%81%D0%BF%D0%BE%D1%80%D1%82-%D0%B2-%22moodle%22"><summary>Экспорт в "Moodle"</summary>

Для интеграции потребуются [плагины](https://test.scroll-tool.ru/moodle-plugin/scroll2moodle.zip), которые позволяют создавать и обновлять SCORM-пакеты из сервиса **Scrolltool**.

1. Скачиваем [архив](https://test.scroll-tool.ru/moodle-plugin/scroll2moodle.zip). Распаковываем.
2. В Moodle устанавливаем плагин **webservice\_restjson**. Установка осуществляется путём установки плагинов через Администрирование.
3. В Moodle устанавливаем плагин **local\_scroll-develop**.
4. В Moodle переходим в раздел Администрирование -&gt; Сервер -&gt; Веб-службы -&gt; Управление протоколами и "глазиком" включаем протокол REST with JSON.
5. В Moodle переходим в раздел Администрирование -&gt; Сервер -&gt; Веб-службы -&gt; Управление ключами и нажимаем на кнопку Создать ключ. Пользователя необходимо выбрать с правами Администратора или управляющего, службу выбрать "Scroll integration" и нажать кнопку Сохранить.
6. Полученный ключ вводим в **Scrolltool** в разделе Аккаунт -&gt; Интеграции -&gt; Moodle в поле Секретный ключ.
7. В **Scrolltool** в разделе Аккаунт -&gt; Интеграции -&gt; Moodle в поле URL вводим адрес сайта, на котором установлен Moodle. К адресу добавьте /webservice/restjson/server.php
8. Там же нажимаем Подключить. Далее вам становится доступен экспорт лонгридов напрямую в СДО Moodle.

</details><details id="bkmrk-%D0%AD%D0%BA%D1%81%D0%BF%D0%BE%D1%80%D1%82-%D0%B2-%22%D0%AD%D0%BA%D0%B2%D0%B8%D0%BE%22-%D0%94%D0%BB"><summary>Экспорт в "Эквио"</summary>

Для интеграции с платформой "**Эквио**" вам сначала необходимо запросить токен и хост у поддержки "**Эквио**".

Они вам предоставят одноразовую ссылку на токен и имя хоста.

После получения необходимых данных, вам лишь требуется ввести их в поля:

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-07/scaled-1680-/cz1image.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-07/cz1image.png)

<p class="callout success">Так же вы сразу можете указать, какие редакторы имеют право на экспорт лонгридов на платформу "**Эквио**"</p>

<p class="callout warning">Если вы хотите заменить материал, который загружали в СДО "**Эквио**", то название материла должно совпадать. К примеру если у вас был курс который назывался - "**5 секретов продаж**", а потом вы сделали новый курс и назвали его - "**Секреты продаж 2.0**", то заменить один файл на другой не получится.</p>

<p class="callout warning">При экспорте в "**Эквио**" если лонгрид весит более 500 мегабайт, то он может не загрузиться на платформу. Это связано может происходить из-за долгой загрузки на сервера нашего партнера.</p>

</details><details id="bkmrk-%D0%AD%D0%BA%D1%81%D0%BF%D0%BE%D1%80%D1%82-%D0%B2-%22moodle%22-%D0%94"><summary>Экспорт в "Kampus"</summary>

Для интеграции вам потребуется:

1. Логин от вашего аккаунта аккаунта в админ-панели Кампуса.
2. Пароль от вашего аккаунта аккаунта в админ-панели Кампуса.
3. Ссылка на вашу админ-панель Кампуса.

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-11/scaled-1680-/0l6image.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-11/0l6image.png)

Название можно прописать как вам будет удобно.

<p class="callout success">Так же вы сразу можете указать, какие редакторы имеют право на экспорт лонгридов на платформу "**Кампус**"</p>

<p class="callout warning">Изначально вы должны создать материал в СДО "**Кампус**".  
Так же на данный момент нельзя заменить материал по интеграции, он всегда будет добавляться как новый SCORM.</p>

</details>

# Как форматировать текст?

### Как открыть текстовый редактор?

**Текстовый редактор** появляется, когда вы выделяете текст в блоке.

[![texte0-view.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-02/scaled-1680-/texte0-view.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-02/texte0-view.jpg)

<p class="callout info">В некоторых блоках текстовый редактор может не появиться. Это означает, что в этом блоке нельзя редактировать текст.  
</p>

### Для чего нужен редактор?

При разработке курса не пренебрегайте возможностью отформатировать текст. Это позволит вам:

- сделать внешний вид курса аккуратнее
- <span style="font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Oxygen, Ubuntu, Roboto, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif; font-size: 14px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400;">верно </span>расставить акценты в тексте

### Что означают кнопки редактора?  


<table border="1" class="align-center" id="bkmrk-%D0%9A%D0%BD%D0%BE%D0%BF%D0%BA%D0%B0-%D0%A4%D1%83%D0%BD%D0%BA%D1%86%D0%B8%D1%8F-%C2%AB%D0%93%D0%BE%D1%80%D1%8F" style="border-collapse: collapse; width: 100%; height: 2427.87px; border-width: 1px; border-spacing: 10px; border-style: groove;"><colgroup><col style="width: 10.6304%;"></col><col style="width: 55.9951%;"></col><col style="width: 16.6873%;"></col><col style="width: 16.6873%;"></col></colgroup><tbody><tr style="height: 72.3833px; background-color: rgb(236, 240, 241);"><th rowspan="2" style="height: 124.767px; border-width: 1px; padding: 10px; vertical-align: middle;">**Кнопка**  
</th><th rowspan="2" style="height: 124.767px; border-width: 1px; padding: 10px; vertical-align: middle;">**Функция**  
</th><th class="align-center" colspan="2" style="height: 72.3833px; border-width: 1px; padding: 10px; vertical-align: middle;">**Горячие клавиши**  
</th></tr><tr style="height: 52.3833px; background-color: rgb(236, 240, 241);"><th style="border-width: 1px; height: 52.3833px; padding: 10px; vertical-align: middle;">*Win + Linux*</th><th style="border-width: 1px; height: 52.3833px; padding: 10px; vertical-align: middle;">*Mac OS*</th></tr><tr style="height: 50px;"><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 50px;">[![button1-color.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/scaled-1680-/button1-color.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/button1-color.png)</td><td class="align-left" style="border-width: 1px; padding: 10px; vertical-align: middle; height: 50px;">Выбрать цвет текста  
</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 50px;">-  
</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 50px;">-  
</td></tr><tr style="height: 52.3833px;"><td style="border-width: 1px; padding: 10px; height: 52.3833px; vertical-align: middle;">![Group 1.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/c7Egroup-1.png)</td><td class="align-left" style="border-width: 1px; padding: 10px; height: 52.3833px; vertical-align: middle;">Сделать текст жирным или убрать жирное начертание  
</td><td style="border-width: 1px; padding: 10px; height: 52.3833px; vertical-align: middle;">`Control` `B`</td><td style="border-width: 1px; padding: 10px; height: 52.3833px; vertical-align: middle;">`Cmd` `B`</td></tr><tr style="height: 51.3833px;"><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 51.3833px;">![Frame 2.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/frame-2.png)</td><td class="align-left" style="border-width: 1px; padding: 10px; vertical-align: middle; height: 51.3833px;">Сделать текст курсивом или убрать курсивное начертание  
</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 51.3833px;">`Control` `I`</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 51.3833px;">`Cmd` `I`</td></tr><tr style="height: 56.5333px;"><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 56.5333px;">![Frame 4.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/frame-4.png)</td><td class="align-left" style="border-width: 1px; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; vertical-align: middle; height: 56.5333px;">Сделать текст зачёркнутым  
</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 56.5333px;">`Control` `Shift` `X`</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 56.5333px;">`Cmd` `Shift` `X`</td></tr><tr style="height: 50px;"><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 50px;">[![Frame 7.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/frame-7.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/frame-7.png)</td><td class="align-left" style="border-width: 1px; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; vertical-align: middle; height: 50px;">Перенести текст в верхний индекс</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 50px;">`Control` `,`</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 50px;">`Cmd` `,`</td></tr><tr style="height: 47.2px;"><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 47.2px;">![Frame 8.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/frame-8.png)</td><td class="align-left" style="border-width: 1px; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; vertical-align: middle; height: 47.2px;">Перенести текст в нижний индекс</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 47.2px;">`Control` `.`</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 47.2px;">`Cmd` `.`</td></tr><tr style="height: 50px;"><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 50px;">[![button7-align-left.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/scaled-1680-/button7-align-left.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/button7-align-left.png)</td><td class="align-left" style="border-width: 1px; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; vertical-align: middle; height: 50px;">Выровнять текст по левому краю.  
</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 50px;">-  
</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 50px;">-  
</td></tr><tr style="height: 50px;"><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 50px;">[![button8-align-center.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/scaled-1680-/button8-align-center.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/button8-align-center.png)</td><td class="align-left" style="border-width: 1px; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; vertical-align: middle; height: 50px;">Выровнять текст по центру.</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 50px;">-  
</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 50px;">-  
</td></tr><tr style="height: 50px;"><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 50px;">[![button9-align-right.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/scaled-1680-/button9-align-right.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/button9-align-right.png)</td><td class="align-left" style="border-width: 1px; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; vertical-align: middle; height: 50px;">Выровнять текст по правому краю.</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 50px;">-  
</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 50px;">-  
</td></tr><tr style="height: 50px;"><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 50px;">[![button10-align-wide.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/scaled-1680-/button10-align-wide.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/button10-align-wide.png)</td><td class="align-left" style="border-width: 1px; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; vertical-align: middle; height: 50px;">Выровнять текст по ширине.</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 50px;">-  
</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 50px;">-  
</td></tr><tr style="height: 134.4px;"><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 134.4px;">![Frame 12.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/frame-12.png)</td><td class="align-left" style="border-width: 1px; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; vertical-align: middle; height: 134.4px;">Создать маркированный список

<p class="callout warning">Помните, что один пункт списка равен одному абзацу. Т.е. если вы выделите часть абзаца и нажмете эту кнопку, то весь абзац станет одним пунктом списка.</p>

</td><td style="border-width: 1px; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; vertical-align: middle; height: 134.4px;">`Control` `Shift` `8`</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 134.4px;">`Cmd` `Shift` `8`</td></tr><tr style="height: 56.5333px;"><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 56.5333px;">![Frame 13.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/frame-13.png)</td><td class="align-left" style="border-width: 1px; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; vertical-align: middle; height: 56.5333px;">Создать нумерованный список</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 56.5333px;">`Control` `Shift` `7`</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 56.5333px;">`Cmd` `Shift` `7`</td></tr><tr style="height: 203.35px;"><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 203.35px;">![Frame 9.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/frame-9.png)</td><td class="align-left" style="border-width: 1px; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; vertical-align: middle; height: 203.35px;">Создать заголовок второго уровня

<p class="callout info">Роль заголовка первого уровня (H1) играет контентный блок «Заголовок».</p>

<p class="callout warning">Для создания заголовка обязательно отделите текст нажатием Enter. Иначе весь текстовый абзац превратится в заголовок.</p>

</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 203.35px;">`Control` `Alt` `2`</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 203.35px;">`Cmd` `Alt` `2`</td></tr><tr style="height: 51.3833px;"><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 51.3833px;">![Frame 10.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/frame-10.png)</td><td class="align-left" style="border-width: 1px; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; vertical-align: middle; height: 51.3833px;">Создать заголовок третьего уровня (H3)

</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 51.3833px;">`Control` `Alt` `3`</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 51.3833px;">`Cmd` `Alt` `3`</td></tr><tr style="height: 134.567px;"><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 134.567px;">![Frame 11.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/frame-11.png)</td><td class="align-left" style="border-width: 1px; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; vertical-align: middle; height: 134.567px;">Привести текст к нормальному состоянию

<p class="callout info">Например, если у вас есть заголовок второго уровня (H2), то при нажатии на эту кнопку текст перестанет быть заголовком и придет к обычному виду.</p>

</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 134.567px;">`Control` `Alt` `0`</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 134.567px;">`Cmd` `Alt` `0`</td></tr><tr style="height: 52.5667px;"><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 52.5667px;">![btn_4.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/frame-5.png)</td><td class="align-left" style="border-width: 1px; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; vertical-align: middle; height: 52.5667px;">Создать гиперссылку</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 52.5667px;">-  
</td><td style="border-width: 1px; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; vertical-align: middle; height: 52.5667px;">-</td></tr><tr style="height: 55.2167px;"><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 55.2167px;">![Frame 6.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/frame-6.png)</td><td class="align-left" style="border-width: 1px; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; vertical-align: middle; height: 55.2167px;">Удалить существующую гиперссылку

</td><td style="border-width: 1px; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; vertical-align: middle; height: 55.2167px;">-</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 55.2167px;">-  
</td></tr><tr style="height: 50px;"><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 50px;">[![button18-highlight.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/scaled-1680-/button18-highlight.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-03/button18-highlight.png)</td><td style="border-width: 1px; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; vertical-align: middle; height: 50px;">Выбрать цвет для подсветки текста

</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 50px;">-  
</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 50px;">-  
</td></tr><tr style="height: 112px;"><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 112px;">![btn_14.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/frame-15.png)</td><td style="border-width: 1px; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; vertical-align: middle; height: 112px;">Оформить текст как цитату

<p class="callout info align-left">Появится отступ текста и полоска слева. Весь текст будет оформлен в кавычки.</p>

</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 112px;">`Control` `Shift` `B`</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 112px;">`Cmd` `Shift` `B`</td></tr><tr style="height: 112.167px;"><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 112.167px;">![Frame 14.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/frame-14.png)</td><td class="align-left" style="border-width: 1px; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; vertical-align: middle; height: 112.167px;">Оформить текст как блок с кодом

<p class="callout info">При включении опции появится темная подложка и немного уменьшится шрифт.</p>

</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 112.167px;">`Control` `Alt` `C`</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 112.167px;">`Cmd` `Alt` `C`</td></tr><tr style="height: 46.1667px;"><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 46.1667px;">[![Frame 19.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/frame-19.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/frame-19.png)</td><td class="align-left" style="border-width: 1px; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; vertical-align: middle; height: 46.1667px;">Очистить форматирование</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 46.1667px;">-  
</td><td style="border-width: 1px; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; vertical-align: middle; height: 46.1667px;">-</td></tr><tr style="height: 51.3833px;"><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 51.3833px;">![Frame 20.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/frame-20.png)</td><td class="align-left" style="border-width: 1px; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; vertical-align: middle; height: 51.3833px;">Отменить последнее действий (Undo)

</td><td style="vertical-align: middle; height: 51.3833px;">`Control` `Z`</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 51.3833px;">`Cmd` `Z`</td></tr><tr style="height: 56.5333px;"><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 56.5333px;">![Frame 21.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2023-01/frame-21.png)</td><td class="align-left" style="border-width: 1px; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; vertical-align: middle; height: 56.5333px;">Вернуть последнее действие после отмены (Redo)

</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 56.5333px;">`Control` `Shift` `Z`</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 56.5333px;">`Cmd` `Shift` `Z`</td></tr><tr style="height: 89.6px;"><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 89.6px;">![texte1-ai-button-24p.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-02/scaled-1680-/texte1-ai-button-24p.png)</td><td style="border-width: 1px; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; vertical-align: middle; height: 89.6px;">Редактировать текст с помощью ИИ

<p class="callout info align-left">Подробнее об использовании ИИ читайте ниже.  
</p>

</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 89.6px;">  
</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 89.6px;">  
</td></tr><tr style="background-color: rgb(236, 240, 241); height: 43.3833px;"><td colspan="4" style="border-width: 1px; padding: 10px; vertical-align: middle; height: 43.3833px;">**Дополнительные горячие клавиши**

</td></tr><tr style="height: 56.5333px;"><td class="align-left" colspan="2" style="border-width: 1px; padding: 10px; vertical-align: middle; height: 56.5333px;">Вставить текст из буфера обмена без форматирования</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 56.5333px;">`Control` `Shift` `V`</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 56.5333px;">`Cmd` `Shift` `V`</td></tr><tr style="height: 38.6667px;"><td class="align-left" colspan="2" style="border-width: 1px; padding: 10px; vertical-align: middle; height: 38.6667px;">Выделить весь текст в блоке</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 38.6667px;">`Control` `A`</td><td style="border-width: 1px; padding: 10px; vertical-align: middle; height: 38.6667px;">`Cmd` `A`</td></tr><tr style="height: 37.8px;"><td class="align-left" colspan="2" style="border-width: 1px; padding: 10px; vertical-align: middle; height: 37.8px;">Расширить выделение на один символ влево</td><td colspan="2" style="height: 37.8px;">`Shift` `←`  
</td></tr><tr style="height: 37.8px;"><td class="align-left" colspan="2" style="border-width: 1px; padding: 10px; vertical-align: middle; height: 37.8px;">Расширить выделение на один символ вправо</td><td colspan="2" style="height: 37.8px;">`Shift` `→`  
</td></tr><tr style="height: 37.8px;"><td class="align-left" colspan="2" style="border-width: 1px; padding: 10px; vertical-align: middle; height: 37.8px;">Расширить выделение на одну строку вниз</td><td colspan="2" style="height: 37.8px;">`Shift` `↓`  
</td></tr><tr style="height: 37.8px;"><td class="align-left" colspan="2" style="border-width: 1px; padding: 10px; vertical-align: middle; height: 37.8px;">Расширить выделение на одну строку вверх</td><td colspan="2" style="height: 37.8px;">`Shift` `↑`  
</td></tr><tr style="height: 47.2167px;"><td class="align-left" colspan="2" style="border-width: 1px; padding: 10px; vertical-align: middle; height: 47.2167px;">Расширить выделение на одно слово вправо</td><td colspan="2" style="height: 47.2167px;">`Control` `Shift``→`  
</td></tr><tr style="height: 37.8px;"><td class="align-left" colspan="2" style="border-width: 1px; padding: 10px; vertical-align: middle; height: 37.8px;">Расширить выделение на одно слово влево</td><td colspan="2" style="height: 37.8px;">`Control` `Shift``←`  
</td></tr></tbody></table>

### Редактирование текста с помощью ИИ

Нейросеть в Scrolltool выполняет 3 операции по работе с текстом:

- Исправление ошибок
- Упрощение текста
- Изменение формулировки текста

Чтобы использовать ИИ, выделите всю часть текста, которую вы хотите изменить. Рядом с текстом появится панель текстового редактора. Выберите значок с ИИ в редакторе. Откроется **окно ИИ**.

<details id="bkmrk-%D0%9E%D1%82%D0%BA%D1%80%D1%8B%D1%82%D1%8C-%D0%BE%D0%BA%D0%BD%D0%BE-%D0%98%D0%98-%D0%A7%D1%82%D0%BE%D0%B1"><summary>Открыть окно ИИ</summary>

[![texte2-ai-open.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-02/texte2-ai-open.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-02/texte2-ai-open.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>Чтобы закрыть окно, нажмите на значок "крестик" в верхнем правом углу окна.

<details id="bkmrk-%D0%97%D0%B0%D0%BA%D1%80%D1%8B%D1%82%D1%8C-%D0%BE%D0%BA%D0%BD%D0%BE-%D0%98%D0%98"><summary>Закрыть окно ИИ</summary>

![ai2-close.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-02/scaled-1680-/ai2-close.jpg)

</details>#### Исправление ошибок

Нейросеть может исправить ошибки в тексте: как орфографические, так и ошибки пунктуации.

В открытом окне ИИ выберите пункт «**Исправить ошибки**». После этого начнётся работа нейросети. А результат появится под исходным текстом (в нижней части окна). Если вы хотите заменить исходный текст, то нажмите кнопку «**Заменить выделенный текст**».

<details id="bkmrk-%D0%98%D1%81%D0%BF%D1%80%D0%B0%D0%B2%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5-%D0%BE%D1%88%D0%B8%D0%B1%D0%BE%D0%BA-%D0%B2"><summary>Исправление ошибок в тексте</summary>

[![ai2-mistakes-v2.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-02/ai2-mistakes-v2.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-02/ai2-mistakes-v2.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>#### Упрощение текста

Нейросеть позволяет упростить сложный текст, чтобы он проще читался.

В открытом окне ИИ выберите пункт «**Упростить текст**». После этого начнётся работа нейросети. А результат появится под исходным текстом (в нижней части окна). Если вы хотите заменить исходный текст, то нажмите кнопку «**Заменить выделенный текст**».

<details id="bkmrk-%D0%A3%D0%BF%D1%80%D0%BE%D1%89%D0%B5%D0%BD%D0%B8%D0%B5-%D1%82%D0%B5%D0%BA%D1%81%D1%82%D0%B0-%D0%A7%D1%82%D0%BE"><summary>Упрощение текста</summary>

[![ai4-simplify-v2.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-02/ai4-simplify-v2.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-02/ai4-simplify-v2.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>#### Изменение формулировки текста

Нейросеть может переписать текст, изменив его формулировку, но сохранив при этом смысл.

В открытом окне ИИ выберите пункт «**Переформулировать текст**». После этого начнётся работа нейросети. А результат появится под исходным текстом (в нижней части окна). Если вы хотите заменить исходный текст, то нажмите кнопку «**Заменить выделенный текст**».

<details id="bkmrk-%D0%98%D0%B7%D0%BC%D0%B5%D0%BD%D0%B5%D0%BD%D0%B8%D0%B5-%D1%84%D0%BE%D1%80%D0%BC%D1%83%D0%BB%D0%B8%D1%80%D0%BE%D0%B2-0"><summary>Изменение формулировки текста</summary>

[![ai5-rephrase.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-02/ai5-rephrase.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-02/ai5-rephrase.gif)

*<span style="color: rgb(149, 165, 166);">Чтобы увеличить демонстрацию, нажмите на нее.</span>*

</details>### Есть ли нюансы работы?

Да. Текстовый редактор старается соблюдать стиль скопированного текста из вашего первоисточника. Например, вы копируете информацию с вашего сайта о компании. В тексте есть выделение жирным и гиперссылка. Все это, по возможности, перенесется в курс с сохранением форматирования.

Если вы не хотите, чтобы ваш текст вставлялся в курс с сохранением форматирования то следуйте одному из советов:

- Очистите форматирование в вашем первоисточнике.
- Очистите форматирование через какое-то приложение. Например, через «Блокнот».
- Вставляйте текст через сочетание клавиш `Ctrl`/ `Cmd` + `Shift` + `V` .
- Вставьте текст без изменений и воспользуйтесь в редакторе кнопкой «**Очистить форматирование**».

# Отправка лонгрида по e-mail

Можно запустить обучение в несколько потоков прямо из конструктора. Этот функционал поможет вам если вы решили запустить обучение без использования LMS. В этой статье будет описано как вы можете это сделать.

### Внешний вид

[![bandicam 2024-10-02 10-16-58-198.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-10/scaled-1680-/bandicam-2024-10-02-10-16-58-198.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-10/bandicam-2024-10-02-10-16-58-198.jpg)

### Добавить поток

С помощью кнопки "Добавить поток" вы можете запустить обучение на определенную группу участников.

<p class="callout success">Как добавить участников мы разберем ниже или вы можете посмотреть в разделе [Модуль "Команда", Участник обучения.](https://wiki.scroll-tool.ru/books/razdel-komanda/page/ucastniki-obuceniya)</p>

[![bandicam 2024-10-02 10-17-00-685.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-10/scaled-1680-/bandicam-2024-10-02-10-17-00-685.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-10/bandicam-2024-10-02-10-17-00-685.jpg)

Тут вам понадобится ввести название вашего потока, дату начала и дату завершения обучения. Как это сделать вы можете видеть на примере ниже:

[![Как добавить поток.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-10/kak-dobavit-potok.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-10/kak-dobavit-potok.gif)

### Добавить участника

До запуска потока, необходимо добавить участников обучения. Нажав на кнопку "Добавить участника" перед вам откроется вот такое меню:

[![bandicam 2024-10-02 10-17-53-090.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-10/scaled-1680-/bandicam-2024-10-02-10-17-53-090.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-10/bandicam-2024-10-02-10-17-53-090.jpg)

[![Как добавить участника.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-10/kak-dobavit-ucastnika.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-10/kak-dobavit-ucastnika.gif)

Если вы уже ранее добавляли участников обучения через - [Модуль "Команда", Участник обучения](https://wiki.scroll-tool.ru/books/razdel-komanda/page/ucastniki-obuceniya), то тогда вы можете воспользоваться кнопкой "Добавить из общего списка"

[![bandicam 2024-10-02 10-25-23-953.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-10/bandicam-2024-10-02-10-25-23-953.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-10/bandicam-2024-10-02-10-25-23-953.gif)

### Запуск обучения

После нажатия на кнопку "Запустить обучение" начинается рассылка писем с индивидуальной ссылкой на прохождение курса.

[![bandicam 2024-10-02 10-25-34-179.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-10/bandicam-2024-10-02-10-25-34-179.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-10/bandicam-2024-10-02-10-25-34-179.gif)

Пример письма

[![bandicam 2024-10-03 11-03-48-366.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-10/scaled-1680-/bandicam-2024-10-03-11-03-48-366.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-10/bandicam-2024-10-03-11-03-48-366.jpg)

Ученик переходит по индивидуальной ссылке "Перейти к материалу"

<p class="callout warning">Результаты по прохождение потоков вы можете наблюдать в [разделе "Отчеты", Лонгриды отправленные по E-Mail.](https://wiki.scroll-tool.ru/books/razdel-otcety/page/longridy-otpravlennye-po-e-mail)</p>

# Копирование лонгридов между оплаченными аккаунтами

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

[![bandicam 2024-12-16 15-58-56-138.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-12/scaled-1680-/bandicam-2024-12-16-15-58-56-138.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-12/bandicam-2024-12-16-15-58-56-138.jpg)

Войти в него очень просто из быстрого меню настроек:

[![bandicam 2024-12-16 15-15-18-581.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-12/bandicam-2024-12-16-15-15-18-581.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-12/bandicam-2024-12-16-15-15-18-581.gif)

Теперь осталось лишь ввести почту другого аккаунта, куда вы хотите передать ваш лонгрид:

[![bandicam 2024-12-16 15-57-40-036.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-12/bandicam-2024-12-16-15-57-40-036.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-12/bandicam-2024-12-16-15-57-40-036.gif)

На другой стороне же пользователь должен его принять:

[![bandicam 2024-12-16 15-58-20-944.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-12/bandicam-2024-12-16-15-58-20-944.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-12/bandicam-2024-12-16-15-58-20-944.gif)

И после обновления страницы лонгрид появляется на аккаунте куда он был отправлен:

[![bandicam 2024-12-16 15-58-36-021.jpg](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-12/scaled-1680-/bandicam-2024-12-16-15-58-36-021.jpg)](https://wiki.scroll-tool.ru/uploads/images/gallery/2024-12/bandicam-2024-12-16-15-58-36-021.jpg)

<p class="callout warning">**Копирование возможно только между оплаченными аккаунтами. На тарифах Демо это сделать невозможно.**</p>

<p class="callout warning">**Принять лонгрид может только "Владелец" аккаунта, методисты не могут принимать лонгриды, которые были отправлены на аккаунт.**</p>

# Как добавить видео с VK Видео

Иногда появляется вопрос, как вставить видео с VK Видео.

В это инструкции вы наглядно увидите, что нужно сделать, чтобы ваши видео работали на нашей платформе.

**Первым делом, на самом видео в ВК Видео, вы нажимаете на кнопку "Поделиться"**

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/scaled-1680-/sKdimage.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/sKdimage.png)

**И попадаете в такое меню:**

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/scaled-1680-/bbsimage.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/bbsimage.png)

**После вы копируете первую ссылку "Прямая ссылка":**

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/scaled-1680-/CfSimage.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/CfSimage.png)

**И вставляете ее в блок "Видео":**

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/scaled-1680-/TeBimage.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/TeBimage.png)

**Далее, нужно переименовать vkvideo.ru на vk.com и ваше видео работает и ученики его увидят:**

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/scaled-1680-/vhximage.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-05/vhximage.png)

<p class="callout info">Если же требуется, чтобы видео проигрывалось сразу же как только ученик зашел на страницу. То в конце ссылки на видео нужно добавить **&amp;autoplay=1**, как на примере: [https://vk.com/video-220992818\_456239025&amp;autoplay=1](https://vk.com/video-220992818_456239025&autoplay=1)</p>

# Глоссарий

Глоссарий нужен, чтобы унифицировать термины, сделать контент доступным для учеников разных уровней и ускорить процесс создания материалов.  
Разработчик использует глоссарий, чтобы ученики быстро находили объяснения терминов без отвлечения на внешние источники, повышая вовлеченность и снижая отток.

### Главное меню Глоссария

[![Снимок экрана 2025-12-29 190601.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-12/scaled-1680-/snimok-ekrana-2025-12-29-190601.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-12/snimok-ekrana-2025-12-29-190601.png)

*Чтобы увеличить картинку, нажмите на нее.*

### Добавление термина  


Нажимая на кнопку "Настроить термины" у вас открывается меню добавления термина. В нем представлено несколько полей. Это поля "Термин" и "Определение".

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-12/scaled-1680-/image.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-12/image.png)

Ниже мы покажем как работает добавление "Термина" и "Определения"

[![Как добавить термин.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-12/kak-dobavit-termin.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-12/kak-dobavit-termin.gif)

*Чтобы увеличить картинку, нажмите на нее.*

### Связка термина с текстом  


Чтобы связать термин с текстом, нужно будет выделить слово или фразу. Откроется меню текстового редактора и выбираем кнопку "Добавить ссылку термин". Откроется меню добавления термина, где из списка нам потребуется выбрать нужный.

[![Как прикрепить термин.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-12/kak-prikrepit-termin.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-12/kak-prikrepit-termin.gif)

*Чтобы увеличить картинку, нажмите на нее.*

### Внешний вид глоссария от лица ученика

Тут мы покажем, как выглядит отображение термина от лица ученика.

[![Внешний вид внутри от ученика.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-12/vnesnii-vid-vnutri-ot-ucenika.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-12/vnesnii-vid-vnutri-ot-ucenika.gif)

Так же можно включить для ученика отображение всех терминов которые будут у вас присутствовать. Для этого переключите ползунок "Отображать кнопку глоссария" в настройках. И уже в самом лонгриде в правой верхней части будет отобраться кнопка Глоссария.

[![bandicam 2025-12-30 09-05-06-931.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-12/bandicam-2025-12-30-09-05-06-931.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-12/bandicam-2025-12-30-09-05-06-931.gif)

*Чтобы увеличить картинку, нажмите на нее.*

### Удаление привязки термина

Чтобы удалить связку с термином, так же открываете текстовый редактор и выбираете кнопку "Удалить ссылку на термин"

[![bandicam 2025-12-30 09-07-59-778.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-12/bandicam-2025-12-30-09-07-59-778.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-12/bandicam-2025-12-30-09-07-59-778.gif)

*Чтобы увеличить картинку, нажмите на нее.*

### Удаление термина

Чтобы удалить термин, воспользуйтесь кнопкой "Корзина" в общем списке терминов в настройках.

[![bandicam 2025-12-30 09-09-42-773.gif](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-12/bandicam-2025-12-30-09-09-42-773.gif)](https://wiki.scroll-tool.ru/uploads/images/gallery/2025-12/bandicam-2025-12-30-09-09-42-773.gif)

*Чтобы увеличить картинку, нажмите на нее.*

# Автоматическое завершение лонгрида.

У нас настроена система автоматического завершения лонгрида, когда пользователь доходит доходит до финального блока или отвечает на последний вопрос.

Таким образом, вы можете сделать лонгрид без "**Завершающих блоков**", если они не вписываются в дизайн вашего лонгрида.

**Лонгрид без баллов и с баллами.**

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

В случае, если есть тестовые вопросы, которые оценивают прохождением учеником лонгрида, то при ответе на последний вопрос, будет передана статистика прохождения ученика, на сколько вопросов он ответил и статус "Успешно/Не успешно".

# AI-помощники

Тут вы найдете статьи, которые расскажут вам о функциях наших AI-помощников.

# AI-переводчик

У нас есть возможность полностью перевести ваш лонгрид на один из 51-го языков.

Для этого в общем пространстве лонгрида нажмите на AI-переводчика.

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2026-05/scaled-1680-/Cfximage.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2026-05/Cfximage.png)

И перед вами откроется выбор языка, на который вы хотите перевести ваш лонгрид.

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2026-05/scaled-1680-/XFaimage.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2026-05/XFaimage.png)

После чего создается копия вашего лонгрида.

<p class="callout warning">Изначально копия создается на русском языке и спустя несколько минут она переводится на выбранный вами язык. </p>

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2026-05/scaled-1680-/eOOimage.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2026-05/eOOimage.png)

<p class="callout warning">Так же на данный момент есть известная ошибка, что если выбрать язык лонгрида отличный от того, что есть в настройках нашего плеера. То лонгрид может не проигрываться. Для этого важно в настроках лонгрида поставить язык плеера.</p>

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2026-05/scaled-1680-/RwCimage.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2026-05/RwCimage.png)

# AI-помощник

Как помощь для ваших проектов у нас есть AI-помощник. Который может вам помочь в решении ваших задач.\\

Вызывается он нажатием на кнопку в верхней части экрана.

[![image.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2026-05/scaled-1680-/iESimage.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2026-05/iESimage.png)

**AI-помощник по разделу** — инструмент для удобной работы со всем содержимым раздела.

При его вызове доступны несколько основных функции.

- **Генерация вопросов по содержанию.** [![{802C2AFB-F9B4-4E8E-A4F6-79094AE601DC}.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2026-05/scaled-1680-/802c2afb-f9b4-4e8e-a4f6-79094ae601dc.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2026-05/802c2afb-f9b4-4e8e-a4f6-79094ae601dc.png)

Помощник предлагает список вопросов на основе текста раздела. Вы можете просмотреть сгенерированные варианты, выбрать подходящие и нажать кнопку «Добавить выбранные» в том же окне. Вопросы автоматически появятся в конце раздела — вам останется лишь распределить их по нужным логическим блокам.

- **Поиск ошибок в разделе.** [![{7176FB10-6C95-40F7-BA92-5C9C84292920}.png](https://wiki.scroll-tool.ru/uploads/images/gallery/2026-05/scaled-1680-/7176fb10-6c95-40f7-ba92-5c9c84292920.png)](https://wiki.scroll-tool.ru/uploads/images/gallery/2026-05/7176fb10-6c95-40f7-ba92-5c9c84292920.png)

По вашему запросу AI-помощник проанализирует весь текст и укажет на найденные ошибки. Чтобы исправить их, достаточно нажать кнопку «Применить» в этом же окне. Это существенно сокращает время на ручную проверку и корректировку.