Конструктор учебного контента CYHPER

конструктор контента

Обзор

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

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

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

Информация
Обратите внимание, что на бизнес-платформе по умолчанию используется семестровый курс , а на академической платформе — семестровый класс . В данной статье термины «курс» и «класс» взаимозаменяемы.

Доступ к редактору

Редактор отображается всякий раз, когда вы редактируете страницу в рамках курса.

Чтобы получить доступ к редактору в уже существующем курсе:
  1. Получите доступ к существующему курсу.
  2. Выберите модуль/урок.
  3. Нажмите «Добавить раздел» , чтобы добавить новый раздел (или выбрать существующий раздел).
  4. Нажмите на страницу .
  5. Добавьте заголовок на страницу.
  6. Нажмите « Сохранить ».
  7. Нажмите «Редактировать» .
Информация
Чтобы узнать, как создать новый курс, посетите раздел «Добавление курса» в статье «Курсы и занятия для преподавателей» .


Отображается страница редактирования , состоящая из множества меню и инструментов:
  1. Верхнее меню : Верхнее меню позволяет редактировать заголовок раздела, переключать режим просмотра между редактором и предварительным просмотром , а также сохранять или отменять изменения.
    1. По умолчанию страница отображается в режиме редактора , который позволяет активно редактировать контент. Чтобы просмотреть контент перед сохранением, нажмите «Предварительный просмотр» .
  2. Меню «Конструктор контента» : Меню «Конструктор контента» отображается в левой части редактора. Это меню позволяет перетаскивать макеты и виджеты контента на страницу. Макеты и виджеты контента будут рассмотрены более подробно в этой статье.
    1. Обратите внимание, что меню «Конструктор контента» можно сворачивать и разворачивать с помощью стрелки. Значок рядом с кнопкой «Структура» предоставляет дополнительное пространство для размещения контента на странице.
  3. Панель инструментов : Панель инструментов предоставляет множество инструментов форматирования, позволяющих настраивать текст, добавлять изображения, ссылки и многое другое. Функциональность панели инструментов будет более подробно рассмотрена в этой статье.
  4. Страница или холст : Холст — это место, куда вы добавляете текст, изображения и виджеты для создания содержимого страницы.
Информация
Обратите внимание, что новый редактор с конструктором контента станет доступен только с 1 апреля 2026 года.



Меню конструктора контента

Меню «Конструктор контента» позволяет добавлять на холст виджеты макета и контента. Меню «Конструктор контента» состоит из трех разделов:
  1. Режим конструктора контента : В меню конструктора контента по умолчанию установлен пункт «Виджеты» , который позволяет выбрать виджеты макета и контента, которые можно добавить на холст. После добавления виджетов на холст вы можете нажать «Структура» , чтобы увидеть порядок добавленных виджетов. Вкладка «Структура» позволяет быстро и легко изменить порядок виджетов.
  2. Макет : Раздел «Макет» включает виджеты «Сетка» и « Столбцы» . Эти виджеты позволяют добавлять редактируемую сетку или набор столбцов в ваш контент.
  3. Контент : Раздел «Контент» включает в себя множество виджетов, позволяющих добавить интерактивность и визуальную привлекательность вашему контенту, таких как аккордеоны , вкладки , карточки и многое другое. Вы можете добавить любой из виджетов контента на холст, чтобы начать настраивать его с помощью вашего учебного контента. Кроме того, любой из виджетов контента можно разместить внутри виджета «Макет» . Например, вы можете добавить виджет «Перелистывание» в каждый раздел столбца, чтобы создать ряд интерактивных элементов «Перелистывание».

Макет: Сетка

В разделе «Макет» находятся два виджета: «Сетка» и «Столбцы» . Чтобы создать настраиваемую сетку на холсте:
  1. Наведите курсор на холст и нажмите кнопку «Сетка» .
  2. Или же перетащите виджет «Сетка» на холст.


Виджет «Сетка» по умолчанию отображает две колонки и две строки.
  1. Используйте выпадающие списки «Столбцы» и «Строки» , чтобы определить расположение элементов в сетке. Вы можете выбрать до четырех столбцов и четырех строк.
  2. Вы можете отрегулировать расстояние между столбцами и строками с помощью выпадающего списка «Расстояние» . Выберите один из вариантов: Малый , Средний , Большой и Очень большой .
  3. Вертикальное выравнивание значок вертикального выравнивания Кнопка позволяет выбрать вертикальное выравнивание текста и изображений в сетке: по верхнему краю, по центру или по нижнему краю.
  4. Нажмите «Добавить строку» , чтобы добавить еще одну строку, максимум четыре строки.
  5. Нажмите «Добавить столбец» , чтобы добавить дополнительный столбец (до четырех столбцов).
  6. Нажмите «Удалить строку» или «Удалить столбец» , чтобы удалить строку или столбец.
Чтобы добавить контент в сетку:
  1. Щелкните внутри раздела сетки, чтобы начать добавлять контент.
  2. Используйте панель инструментов для форматирования текста и добавления изображений, ссылок или даже видео.
    1. Обратите внимание, что панель инструментов подробно рассматривается далее в этой статье.
  3. В раздел сетки можно добавлять виджеты контента.
    1. Например, вы можете разместить блок с эффектом перелистывания страниц внутри каждой секции сетки.
  4. Вы можете в любой момент нажать кнопку «Предварительный просмотр» , чтобы просмотреть содержимое.
    1. Нажмите кнопку «Редактор» , чтобы вернуться в режим редактирования.

Макет: Столбцы

Чтобы создать настраиваемые столбцы на вашей странице:
  1. Наведите курсор на холст и нажмите кнопку «Столбец» .
  2. Или же перетащите виджет « Столбец» на холст.


Виджет « Столбцы» по умолчанию отображает два столбца.
  1. Используйте раскрывающийся список «Столбцы» , чтобы выбрать количество столбцов. Вы можете выбрать до четырех столбцов.
  2. Вы можете отрегулировать расстояние между столбцами с помощью выпадающего списка «Расстояние» . Выберите один из вариантов: Малый , Средний , Большой и Очень большой .
  3. Используйте выпадающее меню «Направление» , чтобы создать горизонтальные или вертикальные столбцы.
  4. Вертикальное выравнивание значок вертикального выравнивания Кнопка позволяет выбрать вертикальное выравнивание текста и изображений в колонке: по верхнему краю, по центру или по нижнему краю.
  5. Нажмите «Добавить столбец» , чтобы добавить дополнительный столбец (до четырех столбцов).
  6. Нажмите «Удалить столбец» , чтобы удалить столбец.
Чтобы добавить содержимое в столбец:
  1. Щелкните внутри столбца, чтобы начать добавление содержимого.
  2. Используйте панель инструментов для форматирования текста и добавления изображений, ссылок или даже видео.
    1. Панель инструментов подробно рассматривается далее в этой статье.
  3. В колонку можно добавлять виджеты с контентом.
    1. Например, вы можете разместить виджет «Карточка» внутри колонки.
  4. Вы можете в любой момент нажать кнопку «Предварительный просмотр» , чтобы просмотреть содержимое.
    1. Нажмите кнопку «Редактор» , чтобы вернуться в режим редактирования.

Виджеты контента

Раздел «Содержание» включает шесть виджетов: «Аккордеон», «Вкладки», «Карточка», «Выноска», «Цитата» и «Переворачивающийся блок». Чтобы добавить виджет на холст:
  1. Наведите курсор на холст и щелкните по виджету контента.
  2. Или же перетащите виджет контента на холст.
  3. На холсте можно разместить несколько виджетов контента друг над другом.
  4. Вы также можете разместить любой виджет контента внутри раздела «Сетка» или «Колонка» .
    1. Например, если вам нужна группа виджетов Flip Box, вы можете сначала добавить сетку (Grid) , а затем разместить виджеты Flip Box в каждом разделе сетки.


После добавления виджетов на холст их можно перемещать и менять их порядок различными способами. Чтобы изменить порядок виджетов:
  1. Чтобы просмотреть список виджетов, добавленных в данный момент на холст, нажмите кнопку «Структура» в меню конструктора контента.
    1. Используйте стрелки вверх и вниз рядом с виджетами, чтобы изменить порядок виджетов на холсте.
  2. Каждый виджет на холсте также имеет небольшое меню в правом верхнем углу виджета.
    1. Используйте стрелки вверх и вниз, чтобы изменить порядок виджетов на холсте.
  3. Также вы можете перетаскивать виджеты на холст, щелкнув и удерживая кнопку изменения порядка. значок переупорядочивания значок слева от виджета и перетаскивание виджета в новое место.


Любой виджет на странице также можно удалить или продублировать. Чтобы удалить или продублировать виджет:
  1. Чтобы отобразить небольшое меню, нажмите на значок с тремя точками в правом верхнем углу виджета.
  2. Нажмите «Удалить» , чтобы удалить виджет.
  3. Нажмите «Дублировать» , чтобы создать копию виджета. Все добавленные вами элементы будут включены в дублированный виджет.
Аккордеонное меню на холсте страницы с выделенным значком меню из трех точек.

Виджет контента: Аккордеон

Аккордеон — это интерактивный виджет, который располагает разделы контента друг над другом и позволяет пользователям разворачивать и сворачивать каждый раздел по своему усмотрению. Каждый раздел имеет кликабельный заголовок, который отображает содержимое. Чтобы добавить аккордеон на холст:
  1. Наведите курсор на холст и нажмите «Аккордеон» , или перетащите виджет «Аккордеон» из меню «Конструктор контента» на холст.
По умолчанию аккордеон отображает две секции, каждая из которых содержит заголовок и раздел с содержимым. Чтобы настроить аккордеон :
  1. Чтобы отредактировать текст заголовка, щелкните непосредственно по тексту-заполнителю в заголовке.
  2. Щелкните заголовок , чтобы развернуть раздел и отобразить его содержимое.
  3. Чтобы отредактировать текст содержимого, щелкните непосредственно по тексту-заполнителю . Вы можете использовать панель инструментов для добавления изображений, ссылок или видео в раздел содержимого.
  4. Нажмите «Добавить элемент» , чтобы добавить дополнительный раздел. Вы можете добавить до десяти разделов аккордеона.
  5. Нажмите «Удалить элемент» , чтобы удалить раздел.
Информация
Обратите внимание, что при просмотре вашего контента все разделы аккордеона по умолчанию будут закрыты.

Виджет контента: Вкладки

Виджет «Вкладки» — это интерактивный виджет, который организует связанный контент в отдельные представления (вкладки), позволяя пользователям переключаться между вкладками, не покидая виджет. Чтобы добавить виджет «Вкладки» на холст:
  1. Наведите курсор на холст и нажмите «Вкладки» , или перетащите виджет «Вкладки» из меню «Конструктор контента» на холст.
По умолчанию в виджете отображаются три вкладки, каждая из которых имеет заголовок и раздел с содержимым. Чтобы настроить виджет «Вкладки» :
  1. Щелкните непосредственно по тексту-заполнителю заголовка вкладки. для редактирования текста заголовка вкладки.
    1. Обратите внимание, что цвет текста заголовка вкладки соответствует основному акцентному цвету вашей платформы.
  2. Чтобы отредактировать текст содержимого вкладки , щелкните непосредственно по тексту-заполнителю. Вы можете использовать панель инструментов для добавления изображений, ссылок или видео в содержимое вкладки.
  3. Нажмите на заголовок другой вкладки. Чтобы перейти на вкладку для редактирования заголовка и содержимого.
  4. Нажмите «Добавить вкладку» , чтобы добавить еще одну вкладку. Вы можете добавить до восьми вкладок.
  5. Нажмите «Удалить вкладку» , чтобы удалить вкладку.

Виджет контента: Карточка

Виджет «Карточка» — это контейнер, который применяет встроенное форматирование, чтобы выделить контент на фоне остальной страницы. Виджеты «Карточка» включают заголовок и контент. Основной акцентный цвет вашей платформы отображается в левой части контейнера. Чтобы добавить виджет «Карточка» на холст:
  1. Наведите курсор на холст и нажмите «Карточка» , или перетащите виджет «Карточка» из меню «Конструктор контента» на холст.
По умолчанию в виджете «Карточка» отображается текст-заполнитель. Чтобы настроить виджет «Карточка» :
  1. Чтобы отредактировать текст заголовка карточки, щелкните непосредственно по тексту-заполнителю в заголовке.
  2. Чтобы отредактировать текст содержимого карточки, щелкните непосредственно по тексту-заполнителю. Вы можете использовать панель инструментов для добавления изображений, ссылок или видео в содержимое карточки.

Виджет контента: Выноска

Виджет «Всплывающий текст» предлагает четыре предустановленных формата для привлечения внимания к различным типам контента. Четыре варианта: «Подсказка» , «Примечание» , «Предупреждение» и «Пример» . Чтобы добавить виджет «Всплывающий текст» на холст:
  1. Наведите курсор на холст и нажмите «Выноска» , или перетащите виджет «Выноска» из меню «Конструктор контента» на холст.
По умолчанию в виджете «Текст выноски» отображается текст-заполнитель. Чтобы настроить виджет «Текст выноски» :
  1. Выберите тип выноски из раскрывающегося списка «Тип» . Доступные варианты: «Подсказка» , «Примечание» , «Предупреждение» и «Пример» .
    1. Выбранный вами тип выноски определит цвет контура и фона виджета.
  2. Чтобы отредактировать текст в выноске, щелкните непосредственно по тексту-заполнителю . Вы можете использовать панель инструментов для добавления изображений, ссылок или видео в виджет выноски.

Виджет контента: Цитата

Виджет «Цитата» предоставляет три предустановленных формата цитат, которые можно использовать при добавлении цитат в контент. Три варианта: «Классический», «Современный» и «Минималистичный» . Чтобы добавить виджет «Цитата» на холст:
  1. Наведите курсор на холст и нажмите «Цитата» , или перетащите виджет «Цитата» из меню «Конструктор контента» на холст.
По умолчанию в виджете «Цитата» отображается текст-заполнитель. Чтобы настроить виджет «Цитата»:
  1. Выберите тип предложения из выпадающего списка «Тип» . Доступные варианты: «Классический», «Современный» и «Минималистичный» .
    1. Выбранный вами тип запроса определит форматирование виджета запроса.
  2. Щелкните непосредственно по тексту-заполнителю цитаты. Для редактирования текста. Вы можете использовать панель инструментов, чтобы добавить изображения, ссылки или видео в виджет цитаты.
  3. Чтобы отредактировать исходный текст цитаты, щелкните непосредственно по тексту-заполнителю в поле " Источник цитаты".

Виджет контента: Переворачивающийся блок

Виджет Flip Box — это интерактивная двусторонняя карточка, которая переворачивается при нажатии пользователем. Виджеты Flip Box идеально подходят для карточек и ответов на вопросы. Чтобы добавить виджет Flip Box на холст:
  1. Наведите курсор на холст и нажмите кнопку «Перевернуть рамку» или перетащите кнопку «Перевернуть рамку» в окно. виджет из меню конструктора контента на холст.
По умолчанию на лицевой стороне виджета Flip Box отображается текст-заполнитель. Чтобы настроить виджет Flip Box :
  1. Нажмите «Редактировать лицевую сторону» или щелкните непосредственно по тексту-заполнителю «Перевернуть блок» , чтобы отредактировать текст на лицевой стороне карточки. Вы можете использовать панель инструментов для добавления изображений, ссылок или видео на карточку.
  2. Нажмите «Редактировать оборотную сторону» , чтобы отредактировать текст на обратной стороне карточки. Вы можете использовать панель инструментов для добавления изображений, ссылок или видео на карточку.
  3. Нажмите кнопку «Перевернуть» , чтобы перевернуть карточку в любой момент редактирования содержимого.
  4. Нажмите на выпадающее меню «Фигура» , чтобы выбрать между квадратным и прямоугольным окном для переворачивания.

Меню панели инструментов

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