Для оформления заказа будет использована форма с кодом b-70070
В базовый набор входят шаблоны:
- Оформления списка тренингов
- Оформления списка уроков
- Оформления уроков внутри
- Горячие кнопки (в столбик или в ряд на выбор)
Для приобретения базового набора:
- Перейдите по кнопке «Собрать коллекцию» в карточке товара
- Положите в корзину шаблоны входящие в набор по минимальной стоимости.
В шаблоне предусмотрена настройка цветов и шрифтов для стандартных блоков урока.
Если потребуется оформить элементы, не предусмотренные переменными, мы с радостью поможем со стилизацией индивидуально под ваш проект — напишите нам для согласованию сроков и стоимости.
HTML* — (от англ. HyperText Markup Language) — язык разметки гипертекста, который используется для создания структуры веб-страниц в Интернете.
CSS* — (от англ. Cascading Style Sheets) — каскадные таблицы стилей, технология, с помощью которой оформляется внешний вид веб-страниц.
JS* (JavaScript) — язык программирования, который используется для создания интерактивных элементов на веб-страницах.
GetScript — магазин готовых решений для Геткурс
GetCourse — площадка для онлайн-обучения
GetМодуль — платёжный модуль от Геткурса
FAQ — с англ. «Frequently Asked Questions». Раздел с часто задаваемыми вопросами и ответами.
Акция! Скидка 50% на покупку шаблона для страницы оплаты
Если у вас в школе еще не подключен Get Модуль, то вы можете получить 50% скидку на покупку шаблона
«Оформление страницы оплаты для Get Модуль».
Условия акции:
- Подключите Get Модуль по этой ссылке или через настройки аккаунта указав промокод: 29009671
- После подключения, создайте заказ на шаблон;
- В момент создания заказа вас переадресует в наш Телеграм-бот;
- Напишите боту «Участвую в акции и название аккаунта на который подключили платежный сервис»;
- В течение 24 часов мы проверим наличие подключения на указанном аккаунте;
- Если проверка пройдет успешно, мы сделаем вам скидку 50% на созданный заказ, и свяжемся с вами в телеграм.
Гетшоп
Коллекция ДИЗАЙНЕРСКИХ шаблонов для GetCourse «Хай-тек». ТЕМА №1
Шаблон «Хай-тек» — это современное решение для оформления онлайн-обучения, вдохновлённое эстетикой технологий и искусственным интеллектом. Основой визуального стиля стали сине-голубые оттенки матового стекла, металлические детали и лаконичные элементы — всё, что создает ощущение технологичности и легкости.
На экране — продуманная структура: легко ориентироваться в тренингах, уроках и заданиях, вся нужная информация доступна в один клик. Робот на фоне символизирует поддержку интеллектуальных решений и инновационный подход к обучению.
Особенности коллекции — плиточные карточки, динамическое расписание, приветствия и незаметные анимации при наведении, которые делают интерфейс современным и интуитивным. Всё привычное: управление профилем, покупками, доступами и полезные ссылки собраны в лаконичном и понятном формате.
Шаблон «Хай-тек» помогает учебным проектам показать свой прогрессивный подход и заботу о комфорте учеников, экономит время на организации материала и создаёт атмосферу доверия и технологичности на платформе.
🔥 Быстрая замена цветов и шрифтов на свои.
🔥 Адаптировано под мобильные и приложение (чатиум).
🔥 Пошаговая видео-инструкция по установке, по принципу смотри-повторяй.
🔥 Возможность приобрести коллекцию по-частям, или всю сразу со скидкой до 25%! Скидка активируется автоматически при добавлении товара в корзину на сумму от 7100 руб. Чем больше товаров из коллекции в корзине, тем больше скидка!
Кому может подойти предложенное цветовое оформление:
Сочетание матового стекла, металлических деталей и акцент на искусственном интеллекте задают коллекции «Хай-тек» ощущение прогрессивности, легкости и технологичности. Такой дизайн подходит для онлайн-курсов и образовательных платформ, где важно подчеркнуть современный подход, надежность и заботу о комфорте учеников.
Вот какие направления могут извлечь наибольшую пользу из такого дизайна: Читать дальше
Обзор коллекции
инструкция по установке коллекции
Важно! Это общая информация обязательна для просмотра если вы устанавливаете шаблон. Без этой части вы можете не понять как его установить.
- Важно! Если у вас новый дизайн GetCourse, то для возможности сменить оформление вам нужно перейти на старый дизайн
С этого момента вы можете переходить к тайм-коду своего элемента шаблона.
🟣 Установка единой панели ученика
🟣 Установка баннера
🟣 Установка шаблона оформления списка тренингов без плашки модуль в личном кабинете
🟣 Подключение оформления к тренингам внутри через ссылку импорта (подходит если вам нужно оформить одну страницу или если вы приобретали единичные элементы коллекции)
- Важно! Если вы устанавливаете оформление списка уроков через ссылку импорта, то дополнительно на страницу нужно поставить JS для списка уроков.
🟣 Подключение оформления через настройки тренинга (быстрый способ подключения оформления сразу ко всему тренингу)
🟣 Установка горячих кнопок
🟣 Установка прогресс-баров
🟣 Установка календаря с ручным добавлением событий
🟣 Установка календаря с автоматическим подтягиванием событий
- Важно! Если вы устанавливаете календарь внутри тренинга и будете подключать оформление через настройки тренинга, то JS под календарём размещать не нужно, т к этот скрипт уже есть в теме которую мы подключаем.
🟣 Установка календаря с комбинированным внесением событий
🟣 Установка актуальных событий с горячими кнопками
📌Подключение оформления если приобретен только этот шаблон или если вы ставите его в личном кабинете
🟣 Установка зачётки / цели курса
🟣 Включаем отображение оформления в приложении
🟣 Установка шаблона страниц авторизации и обратной связи с фоновым изображением
Тарифы коллекции «Хай-тек»
Шаблон оформления списка тренингов плитками
- Список тренингов расположен в две колонки на ПК версии и в одну на мобильных устройствах.
- Автоматический показ номера модуля (для курсов с несколькими модулями) и возможность скрыть плашку с модулем, если модуль один или деление не нужно;
- Анимация при наведении;
- Возможность смены цветов и шрифтов на свои;
- Работает в приложении.
Шаблон оформления списка уроков плитками с картинками
- Оформление хорошо смотрится как с картинкой в уроке, так и без нее. Добавление картинки в урок стандартное.
- Отображение статуса домашнего задания на кнопке урока.
- Анимация при наведении.
- Стилизация недоступного урока.
- Подходит для длинных названий и описаний урока.
- Возможность смены цветов и шрифтов на свои
- Работает в приложении.
Шаблон оформления уроков внутри
- Основные элементы проработаны под общую концепцию шаблона.
- Анимация при наведении
- Возможность смены цветов и шрифтов на свои
- Работает в приложении.
Единая панель ученика
Что включает информационная панель:
- Возможность смены цветов и шрифтов на свои
- Работает в приложении.
- Приветствуем ученика по имени
- Вы можете добавить любую надпись
- Возможность смены цветов и шрифтов на свои
- Работает в приложении.
Актуальные события в аккордеоне
Стильное расписание: Отображение общих мероприятий в визуально привлекательной форме. Ваши ученики всегда будут в курсе событий.
- Список событий по умолчанию скрыт и открывается при нажатии на кнопку.
- Автоматически подтягивает события из расписания уроков на ближайшую неделю.
- Акцентное выделение сегодняшнего дня поможет ученикам не пропустить занятия.
- Возможность смены цветов и шрифтов на свои
- Работает в приложении.
Календарь с ручным добавлением событий
- Наглядное и стильное расписания в виде календаря, поможет ученикам не пропускать важные события обучения и станет украшением вашего тренинга.
- Легкая замена цветов и шрифтов под ваш проект
- ❗️ Важно. События в календарь добавляются вами в ручном режиме
Календарь с автоматическим подтягиванием событий
- Календарь создан на базе актуальных событий и автоматически подтягивает события из общего расписания уроков на ближайшую неделю.
- Имеет фильтр отображения всего доступного расписания или тренинга в котором установлен. При использовании фильтра потягивается расписание начиная от тренинга в котором стоит календарь и всех его подтренингов.
- Важно! Для корректной работы фильтра название тренинга в котором стоит календарь должно быть уникальным!
- В всплывающей подсказке отображается время, название тренинга где будет событие и кликабельное название урока.
- Возможность смены цветов и шрифтов на свои
- Работает в приложении.
Календарь с комбинированным внесением событий
- Календарь автоматически подтягивает события из общего расписания уроков на ближайшую неделю, а также вы можете внести свои события через гугл таблицу
- Имеет фильтр отображения всего доступного расписания или тренинга в котором установлен. При использовании фильтра потягивается расписание начиная от тренинга в котором стоит календарь и всех его подтренингов.
- Важно! Для корректной работы фильтра название тренинга в котором стоит календарь должно быть уникальным!
- Через список ближайших событий можно перейти по ссылке где будет событие
- Возможность смены цветов и шрифтов на свои
- Работает в приложении.
Зачётка / Цели тренинга
🎓 Удобный инструмент, который усиливает учебный процесс и повышает вовлечённость учеников!
- Выделите ключевые уроки — ученики видят, какие этапы особенно важны
- Сделайте навигацию удобной — переход к нужному уроку одним кликом прямо из зачётки
- Повысите мотивацию — визуальное подтверждение выполнения даёт ощущение прогресса и достижений
- Настраивайте оформление — кастомизируйте названия, цвета и шрифты под стиль вашей школы
- Работает на всех устройствах, включая приложение — ученику всегда удобно.
Диаграмма пройденных уроков или модулей в процентах
Код диаграммы добавляется на страницу тренинга и придаёт интерактива, при его прохождении.
- Возможность смены цветов и шрифтов на свои
- Работает в приложении.
Диаграмма пройденных модулей (подтренингов)
Код диаграммы добавляется на страницу тренинга и придаёт интерактива, при его прохождении.
- Возможность смены цветов и шрифтов на свои
- Работает в приложении.
Диаграмма пройденных уроков
Код диаграммы добавляется на страницу тренинга и придаёт интерактива, при его прохождении.
- Возможность смены цветов и шрифтов на свои
- Работает в приложении.
Горизонтальный прогресс-бар пройденных уроков или модулей в процентах
Код диаграммы добавляется на страницу тренинга и придаёт интерактива, при его прохождении.
- Возможность смены цветов и шрифтов на свои
- Работает в приложении.
Три «горячие» кнопки в ряд
Горячие кнопки это красивый элемент и неотъемлемый инструмент, который позволяет вашим ученикам быстро находить важную информацию. Вы можете легко удалять и добавлять кнопки и менять их название и ссылки.
- Возможность смены цветов и шрифтов на свои
- Работает в приложении.
Две «горячие» кнопки в столбик
Горячие кнопки это красивый элемент и неотъемлемый инструмент, который позволяет вашим ученикам быстро находить важную информацию. Вы можете легко удалять и добавлять кнопки и менять их название и ссылки.
- Возможность смены цветов и шрифтов на свои
- Работает в приложении.
Мы обновили цветовую палитру и иконки боковой панели, улучшив визуальное восприятие и выделив важные элементы интерфейса. Эти изменения сделают навигацию более интуитивной и помогут вашим ученикам легче ориентироваться в процессе обучения.
После оплаты вы получаете:
- Набор иконок
- GSS стили
- Инструкцию по установке
- Быстрая замена цветов на свои.
Шаблон страниц авторизации и обратной связи с фоновым изображением
Создайте первое впечатление о вашей школе, с помощью готового шаблона для оформления страниц авторизации и обратной связи. Установите свое изображение на фон и создайте эксклюзивное оформление.
- Быстрая установка
- Возможность смены цветов, шрифтов и фона на свои.
Важно! Первым делом установите в тему CSS код единого файла управления выбранной темы (первая карточка в личном кабинете). Именно в ней вы будете менять цвета и шрифты ваших элементов.
Зачётка — модуль для повышения доходимости
ВАЖНО! Прежде чем перейти к установке, посмотрите общую информацию в основной видео-инструкции и установите в тему CSS фоновые стили.
Обзор и установка
❗️ Для того, чтобы зачётка работала в приложении, перейдите в тренинге в раздел «В приложении» и поставьте галочку «Не приводить список к нативному виду». Важно! Вид списка тренингов и уроков в этом случае станет отображаться как на ПК.
Календарь ручным добавлением событий
Наглядное и стильное расписания в виде календаря, поможет ученикам не пропускать важные события обучения и станет украшением вашего тренинга.
Важно! События в календарь добавляются вами в ручном режиме.
Установка календаря
Закройте на время просмотра текущее окно с этой инструкцией и установите CSS стили по инструкции в основном видео. После того как установите стили вернитесь в эту инструкцию и продолжите установку.
После установки CSS в тему перейдите к покупке и скопируйте код JS
Если вы приобрели только календарь, то вернитесь к теме с установленным CSS календаря и перейдите во вкладку JS. Вставьте в него скрипт с блокнота и сохраните изменения.
Если вы приобрели несколько элементов коллекции, то создайте новую тему для JS календаря и поместите туда скопированный код. Сохраните изменения.
Важно! Не теряйте скобки и не добавляйте в скрипт лишних элементов. Скрипт должен начинаться и заканчиваться фигурной скобкой {}
Перейдите к покупке и скопируйте код разметки
Поставьте курсор на тот объект куда планируете ставить календарь, в нашем примере это 2 колонка. Выделенная область на странице тренинга выделится красным
Нажмите на стрелку вниз и выберите пункт «Импортировать блок»
В открывшемся окне вставьте скопированную разметку и нажмите кнопку «Импортировать»
После успешного импорта вы увидите разметку (если успеют погрузиться стили, то вид вашей разметки будет отличаться от примера). Сохраните изменения
Вернитесь в созданную тему ВАШ ДОМЕН/pl/cms/layout/index, в раздел настройки. Поставьте курсор на JS, нажмите правую кнопку мыши и выберите пункт «Копировать адрес ссылки»
Вернитесь в тренинг и нажмите дважды левой кнопкой мыши на JS скрипт в разметке. Замените ссылку в скрипте на ту, что только что скопировали. Важно! Ссылку нужно вставить между кавычек "ВАША ССЫЛКА".
Удалите из ссылки свой домен сразу после " и заканчивая /. После, нажмите мышью на пустое поле чтобы закрылся редактор JS и сохраните результат.
Нажмите на кнопку «Содержание» чтобы посмотреть результат.
Подключаем оформление календаря
если вы приобрели несколько элементов коллекции, то пропустите этот шаг
Перейдите в тренинг где устанавливаете кадендарь и нажмите кнопку Действие / Настроить вид
В открывшемся окне вставьте подготовленную ниже конструкцию и не закрывайте окно.
@import url(ваша ссылка)
Перейдите в тему где разместили CSS стили, перейдите во вкладку настройки, наведите мышь на ссылку CSS, нажмите правую кнопку мыши и выберите пункт «копировать адрес ссылки».
Вставьте ссылку в конструкцию между двух скобок и удалите домен до слеша.
Сохраните изменения.
ВАЖНО! Изменения из темы применяются в течение 15 минут. Если календарь еще не принял нужный вид, возможно вам нужно просто немного подождать и обновить страницу.
Меняем цвета календаря на свои
Для замены цветов и шрифтов календаря на ваши, предусмотрены переменные. Вернитесь в созданную тему ВАШ ДОМЕН/pl/cms/layout/index, в раздел CSS, и поменяйте коды цветов в переменных на свои. Например, если вам нужно поменять цвет фона календаря на красный, то в переменной фона календаря замените код цвета #222 на #ff0010. По такому же принципу меняются все значения. После сохранения изменения вступят в силу в течение 15 минут.
Прописываем событие в календарь
Вернитесь в созданную тему ВАШ ДОМЕН/pl/cms/layout/index, в раздел JS.
ВАЖНО! Изменения из темы применяются в течение 15 минут.
❗️ Для того, чтобы календарь работал в приложении, перейдите в тренинге в раздел «В приложении» и поставьте галочку «Не приводить список к нативному виду». Важно! Вид списка тренингов и уроков в этом случае станет отображаться как на ПК.
Оформление списка тренингов в аккордеоне
ВАЖНО! Прежде чем перейти к установке, посмотрите общую информацию в основной видео-инструкции и установите в тему CSS стили.
Обзор и установка
Как отключить новое оформление GetCourse
Новые темы и элементы коллекции «Радуга»
Новые темы и элементы коллекции «Радуга»
ВАЖНО! Прежде чем перейти к установке, посмотрите общую информацию в основной видео-инструкции и установите в тему JS и CSS.
Календарь с комбинированным внесением событий
ВАЖНО! Прежде чем перейти к этой инструкции, посмотрите общую информацию в основной видео-инструкции и установите в тему CSS стили для фона и календаря.
Установка разметки календаря
Настраиваем календарь
- Для настройки календаря перейдите в «настроить вид»
- Найдите разметку которую мы установили и щелкните на нее дважды левой кнопкой мыши
В настройках разметки вам доступны следующие действия:
1. Управление автоматическим отображением расписания из уроков
В строчке window.OneWaySchedule = true; измените параметр true на false, чтобы календарь не брал уроки с общего расписания
2. Управление фильтром отображения автоматического расписания уроков
Календарь умеет показывать все события общего расписания на ближайшую неделю которые доступны пользователю в аккаунте, или только те, которые относятся к тренингу в котором стоит календарь. По умолчанию показываются все события. Если вы хотите включить фильтр, то в строчке window.OneWayThisTraining = false измените параметр false на true
3. Внесение своих событий через Гугл таблицу.
Найдите строчку window.OneWayExcel = 'Ссылка'
Этот параметр отвечает за интеграцию с таблицами. Для того, чтобы подключить таблицу, вам понадобится доступ к специальной таблице и особая ссылка на нее.
ВАЖНО! Если у вас несколько тренингов для которых нужно вносить разное расписание в ручном режиме, то для каждого курса нужно будет сделать свою таблицу и прописывать ссылку на нее в настройках разметки календаря.
Настраиваем таблицу событий
1. Скопируйте таблицу: https://docs.google.com/spreadsheets/d/1IW0zfmYvonoAPjj2RccS-NZQL8b8jAIjGBCSw5Lnuqc/edit#gid=0
2. После копирования перейдите в AppScript
3. В AppScript начните развертывание, нажав на «новое развертывание»
4. Не меняйте предлагаемые настройки. Доступ должен быть от вашего имени и доступен всем
5. Согласитесь на запуск. Веб-приложение запрашивает доступ к вашей учетной записи google. Это безопасно, но вы можете использовать новый аккаунт google для использования таблиц
6. На этом этапе нажмите «show Advanced => go to json»
7. Затем нажмите allow и вам выдаст вашу специальную ссылку на таблицу
ВАЖНО! По этой ссылке никто не сможет перейти в вашу таблицу, но при переходе по ней сервер таблиц будет отдавать нам события. При необходимости, ссылку вы сможете найти в AppScript в разделе «управление развертываниями».
8. Скопируйте ссылку на веб-приложение и вставьте ее в в код календаря в строке window.OneWayExcel = ’Ссылка’ вместо слова ссылка.
Важно! Не удалите кавычки, в которых должна быть ссылка.
В самой таблице заполняйте события как было в таблице-примере.
Иконки событий
В событиях внесенных через файл доступно 3 вида иконок:
- group — иконка с человечком
- black - иконка плей (по умолчанию)
- closed — закрытый замок
Для установки иконки с человечком или закрытый замок, в столбце description пропишите group или closed
Важно! Если вы меняете иконку, то никакого текста кроме названия иконки в поле description быть не должно
ОТЗЫВЫ НАШИХ ПОКУПАТЕЛЕЙ
частые вопросы
© 2023-2026 «Гетшоп»
Все права защищены.
Зарегистрировать аккаунт GetCourse
*Социальные сети Facebook и Instagram являются продуктами компании Meta, которая признана экстремистской организацией в России.
Согласие на обработку персональных данных
Согласие на получение рассылок
© 2023-2026 «Гетшоп»
Все права защищены.
*Социальные сети Facebook и Instagram являются продуктами компании Meta, которая признана экстремистской организацией в России.