Главы и уроки
Права на создание и редактирование курсов и их элементов есть у следующих пользователей:
- Администраторы
- Группа HR-отдела
- Группа авторов курсов
- Пользователи, которым отдельно даны права на создание и редактирование курсов
Онлайн-курсы: основные понятия
Курс может включать в себя следующие элементы:
-
Глава — тематический раздел или подраздел курса, который может содержать любое количество дочерних элементов (подразделов и уроков). Без вложенных уроков глава является обычным уроком.
-
Урок — отдельная страница с информационным наполнением. Если в урок вложить другой урок, то он станет главой.
-
Тест — инструмент оценки знаний, который создается на основе вопросов к конкретным урокам или ко всему курсу.
-
Вопрос — элемент теста, который используется для оценки знаний и понимания сотрудниками пройденного материала. Вопросы могут быть привязаны к конкретным урокам/главам, так и к курсам в целом.
Добавление урока/главы (редактор «Сайты 24»)
Принцип создания уроков и глав одинаков. При добавлении нового раздела курса вы создаете урок. Урок становится главой только после добавления в него уроков или подглав. Создать новый урок/главу можно из двух мест: из описания курса и из текущей главы/урока.
Создание урока из описания курса
Для добавления урока нажмите на колесо шестеренки (⚙️) и выберите опцию «Добавить главу/урок».
На слайдере добавления урока/главы вы увидите следующие поля:
- Название. В этом поле укажите наименование главы/урока. Поле обязательно для заполнения.
- Символьный код. С помощью этого кода создается уникальная ссылка на главу/урок. По умолчанию символьный код совпадает с названием главы, но его можно указать вручную. Для этого кликните на кнопку справа от строки с названием или символьным кодом. После этого символьный код будет доступен для редактирования.
- Предпросмотр страницы. В это поле вы можете загрузить изображение, которое станет обложкой (превью) для данного урока/главы. Подробнее о превью написано ниже.
После заполнения нужных полей нажмите «Создать» — вы попадете на страницу для наполнения урока/главы контентом. Здесь выберите место расположения урока/главы: в корне курса или внутри другого урока/главы.
Если урок А привязывается к уроку Б, то урок Б, соответственно, становится главой.
Изменить привязку и расположение глав/уроков курса вы всегда сможете через интерфейс управления структурой курса.
Создание нового урока из текущего урока
Откройте нужный урок или главу курса и нажмите на шестеренку. Выберите опцию «Добавить урок/главу».

Затем выберите, куда именно добавить новый урок/главу:
- На один уровень с текущим уроком. Урок будет добавлен сразу после текущего урока.


- Вложенный в текущий урок. Урок будет добавлен внутрь текущего урока. Текущий урок станет главой.


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

Наполнение глав/уроков контентом
После добавления урока/главы можно приступать к созданию контента. Для этого выберите опцию «Добавить блок».
В левой части экрана откроется слайдер с большим выбором блоков, которые можно использовать для наполнения курса. Эти блоки включают текстовые поля, изображения, видео, интерактивные элементы и многое другое, что позволяет гибко и эффективно организовать учебный материал.
Подробнее о работе с редактором «Сайты24» вы можете узнать из этой статьи.
Редактирование урока/главы
Чтобы отредактировать урок или главу, откройте нужный слайдер и нажмите «Редактировать».
После этого вы попадете в режим редактирования контента главы/урока. Здесь вы можете добавлять или удалять блоки, создавать ссылки и так далее. Чтобы отредактировать название, символьный код и обложку (превью) главы, нажмите на шестеренку в правом верхнем углу.
Так вы попадете на слайдер для изменения урока/главы. Здесь в блоке «Превью страницы» появляется опция «Снять скрин».
Эта опция позволяет сделать скриншот верхней части главы/урока и использовать его в качестве превью.
Обратите внимание, что если в статью добавлены фото, которые хранятся на другом домене, то они не будут отображаться на скриншоте.
Превью урока/главы используется для более удобной работы с курсом. Увидеть превью можно при создании внутренней перелинковки курса.
Например, в тексте урока/главы можно сделать ссылку на другую страницу курса:
В этом случае откроется список глав и уроков данного курса, на которые можно сделать ссылку. Здесь главы и уроки будут отображаться вместе со своими обложками, что позволит лучше в них ориентироваться.
Использование HTML-кода для наполнения уроков
Помимо уже готовых блоков конструктор «Сайты24» позволяет добавлять в уроки HTML-код. Благодаря этому, имея знания HTML и CSS, в курсах можно создавать самый разнообразный контент и добавлять в уроки те блоки, которых нет в шаблонах конструктора.
Добавление HTML-блока
Чтобы добавить блок HTML-кода в курс откройте нужную главу курса и нажмите «Редактировать».

Затем наведите курсор на нужную часть страницы и нажмите на кнопку «Добавить блок».

В списке блоков выберите раздел «Другое» и блок «Онлайн-курс: HTML-код».

Наведите курсор на добавленный блок и нажмите «Редактировать».

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

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

Пример HTML-кода для этого блока вы можете скачать здесь. Обратите внимание, что представленный код не адаптирован для мобильного приложения Битрикс24.
Загрузка видео через HTML-блок
С помощью HTML-блоков вы также можете добавлять в уроки видеоматериалы. Хотя среди блоков Сайтов24 есть те, что позволяют вставлять ссылки на видео с сервисов Youtube, VK видео, RuTube или Vimeo, их не всегда бывает достаточно. Есть материалы, которые компания не считает нужным выкладывать в открытый доступ и хранит только на корпоративном портале. HTML-блок удобно использовать для добавления именно таких видео.
Предварительно загрузите нужное вам видео на корпоративный портал. Например, в раздел «Медиабиблиотека».

В медиабиблиотеке дважды кликните на загруженное видео и нажмите «Прямая ссылка на файл». Скопируйте появившуюся ссылку.

Затем вставьте в HTML-блок код показанный ниже и укажите в нем желаемую ширину видео и ссылку на него. Представленный код будет также корректно отображаться в мобильном приложении Битрикс24.
<div style="width:100%; max-width:960px; margin:0 auto;">
<video
width="100%"
height="auto"
controls
autoplay
playsinline
style="display:block; border-radius:4px;">
<source src="Ссылка на видео" type="video/mp4">
</video>
</div>
Примеры ширины для видео (max-width):
-
960px
-
640px
-
560px

После завершения настройки нажмите «Сохранить» и обновите страницу. Видео будет отображено в уроке.















