• совет тем, кто планирует всерьёз заниматься кастомизацией платформы Геткурс (и других платформ)
рассказываю о том:
рассказываю о том:
1. Вступительная информация
2. Страх работы с кодом. Можно ли сломать страницу на GetCourse?
  • актуальна ли услуга по оформлению платформы GetCourse
  • можно ли случайно сломать страницу на GetCourse кодом
  • как этого избежать
  • совет от разработчиков платформы GetCourse перед написанием скриптов на платформе
  • какие вопросы поможет решить закрытый телеграм-канал со скриптами для GetCourse
  • что нужно знать, чтобы уметь изменять страницы на Геткурс (и других платформах) до неузнаваемости
  • что нужно знать, чтобы уметь добавлять дополнительный функционал
рассказываю о том:
3. Как сделать боковое меню в GetCourse красивым. Стандартные настройки + готовые иконки
  • как при помощи стандартных настроек платформы GetCourse сделать красивое боковое меню, а также поделюсь готовыми иконками, которые вы можете использовать на ваше усмотрение, в том числе и в своём проекте
В этом уроке:
4. Как добавить эффекты при наведении в боковом меню в GetCourse
  • добавим код, который позволит оживить боковое меню в Геткурсе
рассказываю о том:
5. Как добавить дополнительную кнопку в боковое меню в GetCourse
  • как можно добавить дополнительную кнопку в боковое меню на платформе GetCourse. Функционалом платформы такая возможность не предусмотрена, для этого есть специальный скрипт
Список уроков
из закрытого телеграм-канала
рассказываю о том:
8. КАК СДЕЛАТЬ ТАК, ЧТОБЫ GETCOURSE БЫЛ КРАСИВЫМ НЕ ТОЛЬКО В ДЕСКТОПЕ, НО И В МОБИЛЬНОЙ ВЕРСИИ И В ПРИЛОЖЕНИИ. СТАНДАРТНЫЕ НАСТРОЙКИ ПЛАТФОРМЫ GETCOURSE И ОСОБЕННОСТИ
  • какие настройки необходимо знать, если планируете кастомизировать GetCourse, а также об особенностях приложения GetCourse (ранее «Чатиум»)
В этом уроке:
6. Как изменить кнопку в боковом меню в мобильной версии, которая не меняется стандартными настройками GetCourse
  • есть в боковом меню в мобильной версии одна проблемка... Дело в том, что вид одной из кнопок не меняется стандартными способами. Применим готовые стили и сделаем её красивой
рассказываю о том:
7. АЛЬТЕРНАТИВНЫЙ СПОСОБ ИЗМЕНЕНИЯ БОКОВОГО МЕНЮ (СТОРОННИЙ КОД)
  • как при помощи стороннего кода изменить главное (боковое) меню в GetCourse
  • в стороннем коде присутствует интересный эффект при появлении в мобильной версии
В этом уроке:
9. ТРИ ВИДА ОФОРМЛЕНИЯ ПЛАТФОРМЫ ГЕТКУРС: ПОПРОЩЕ И ПОДЕШЕВЛЕ, СРЕДНИЙ И ДОРОГОЙ СПОСОБ. ОСОБЕННОСТИ
  • каким образом сегодня оформляют платформу GetCourse, особенности каждого способа + примеры
рассказываю о том:
10. ОФОРМЛЕНИЕ ТРЕНИНГОВ ПРИ ПОМОЩИ CSS. ГОТОВЫЙ КОД-ШАБЛОН ДЛЯ УСТАНОВКИ В ВАШ АККАУНТ
  • даю готовый код-шаблон для оформления списка тренингов. За пару минут список тренингов в Геткурсе преобразится, а вам нужно будет только поменять цвета, фон и т.п. (на ваше усмотрение)
рассказываю о том:
13. КРОССБРАУЗЕРНОСТЬ. ЧТО ЭТО ТАКОЕ, НУЖНО ЛИ МУДРИТЬ С КРОССБРАУЗЕРНОСТЬЮ И СТОИТ ЛИ БОЯТЬСЯ ВИДОИЗМЕНЯТЬ ЭЛЕМЕНТЫ В ГЕТКУРСЕ ПРИ ПОМОЩИ CSS (В ТРЕНИНГАХ)
  • что это такое и почему об этом важно знать?
В этом уроке:
11. Способы добавления кода на платформе GetCourse, о которых знают не все
  • об основах работы кода, как работают HTML, CSS и JavaScript + примеры
рассказываю о том:
12. КОД ДЛЯ ЗАЩИТЫ ОТ НЕДОБРОСОВЕСТНЫХ ЗАКАЗЧИКОВ. ПОЗВОЛЯЕТ ПОВЛИЯТЬ НА ЗАКАЗЧИКА, ДАЖЕ ЕСЛИ ВАС УДАЛИЛИ ИЗ АДМИНИСТРАТОРОВ
  • даю код + инструкцию по установке. Код позволяет управлять отображением списка тренингов в онлайн-школе даже не являясь администратором этой онлайн-школы. Зная этот код, вы на 90% защищены от того, что вас кинут
В этом уроке:
14. КАКИЕ НАСТРОЙКИ ЗАПРОСИТЬ У ОНЛАЙН-ШКОЛЫ, ЧТОБЫ ПРИСТУПИТЬ К РАБОТЕ ПО ОФОРМЛЕНИЮ GETCOURSE?
  • Бонусный урок. В уроке инструкция для вас и ваших клиентов
В этом уроке:
15. ГЛАВНАЯ СТРАНИЦА СО СПИСКОМ ТРЕНИНГОВ. КАК ОНА УСТРОЕНА. КАК УБРАТЬ ЛИШНИЕ И ВИДОИЗМЕНИТЬ УЖЕ ИМЕЮЩИЕСЯ ЭЛЕМЕНТЫ
  • в этом уроке разберем главную страницу со списком тренингов
  • о трёх способах добавить стили в HTML-разметку
  • о способах добавить код на платформу GetCourse для оформления тренинга
  • также затронем тему импорта дополнительных CSS-файлов и подключение их к странице на GetCourse
  • в каких случаях стоит заморочиться о правильном отображении элементов во всех браузерах, а когда заморачиваться не стоит?
  • как можно добиться кроссбраузерности и насколько это важно при оформлении платформы GetCourse?
Урок призван избавить вас от страха перед неработающим кодом
  • узнаем, из чего она состоит, как видоизменить её при помощи CSS, научимся скрывать ненужные элементы, узнаем, что такое составные селекторы, научимся подбираться к конкретному элементу на странице и видоизменять его
Рассказываю о том:
16. КАК ПРАВИЛЬНО РАБОТАТЬ С ФОНОМ В СПИСКЕ ТРЕНИНГОВ
  • как поменять фон в списке тренингов и почему именно такой код применяем
Рассказываю о том:
17. КАК ОФОРМИТЬ СПИСОК ТРЕНИНГОВ БАННЕРАМИ. ОСОБЕННОСТИ И ПРОЦЕСС ОФОРМЛЕНИЯ
  • как при помощи картинок и кода сделать оформление списка тренингов
  • какие есть цветовые модели и как их использовать
  • как установить на фон однотонный цвет, градиент, картинку и даже несколько картинок
  • как изменить расположение картинки на фоне, растянуть её на весь экран
  • как для различных разрешений экрана устанавливать различный фон
  • о CSS-свойствах для фиксации фона при прокручивании и о других CSS-свойствах
  • как загружать картинки, работать с отступами, работать со старым конструктором
  • как показывать различные баннеры на различных разрешениях
  • как добавлять эффекты при наведении
  • каких размеров баннеры использовать при оформлении
  • особенности оформления таким способом и советы
+ Макет для того, чтобы попробовать оформить самостоятельно и код из урока
рассказываю о том:
18. КАК ДОБАВИТЬ БЛОК С ДАННЫМИ ПОЛЬЗОВАТЕЛЯ И ФОТОГРАФИЕЙ НА ГЛАВНУЮ СТРАНИЦУ + ГОТОВЫЙ КОД. РАЗБИРАЕМСЯ, КАК ВЫВОДИТЬ НУЖНУЮ ИНФОРМАЦИЮ НА СТРАНИЦЕ СО СПИСКОМ ТРЕНИНГОВ
  • как вставить блок с данными пользователя на главной странице со списком тренингов
Рассказываю о том:
19. КАК КАСТОМИЗИРОВАТЬ СТАНДАРТНОЕ РАСПИСАНИЕ + ГОТОВЫЙ КОД CSS
  • как при помощи готового кода кастомизировать стандартное расписание на платформе GetCourse, а также подогнать его под стиль онлайн-школы
  • что это за код, как его понимать и что можно с ним сделать
  • какие есть способы вытащить на страницу нужную информацию (основные способы и продвинутый способ)
Важно не только уметь вставить код на страницу, но и знать, каким образом и откуда берется информация.
  • какие настройки выставить, чтобы всё работало корректно
  • как вытащить фотографию из профиля на страницу со списком тренингов
  • как вытащить любую другую информацию
  • рассказываю о классных фишках, которые есть в CSS-коде
даю готовый код, который нужно просто скопировать, вставить и подогнать под проект, а также макет в фигме и готовые иконки для блока с информацией о пользователе.
  • на примере расписания показываю, как Геткурс меняет стилизацию некоторых элементов в зависимости от статуса
+ даю готовый код, который нужно просто скопировать, вставить и подогнать под проект
В этом уроке:
20. КАК УСТАНОВИТЬ ИНДИКАТОР ЗАГРУЗКИ СТРАНИЦЫ (ПРЕЛОАДЕР) НА СТРАНИЦУ СО СПИСКОМ ТРЕНИНГОВ В GETCOURSE
  • научимся устанавливать прелоадер на страницу со списком тренингов/подтренингов в GetCourse и разберемся, как он работает
  • решим проблему подгружения старых стилей от GetCourse при загрузке кастомизированной страницы
  • решим проблему дергающейся страницы при загрузке
  • дам готовый код, который можно скопировать и вставить в вашем проекте
  • расскажу, как подогнать цвет прелоадера под любой проект
Рассказываю о том:
21. КАК ИСКАТЬ ОШИБКИ В КОДЕ, ЕСЛИ ГЕТКУРС ЭТИ ОШИБКИ НЕ ПОДСВЕЧИВАЕТ, А КОД РАБОТАЕТ НЕПРАВИЛЬНО?
Иногда в коде может быть допущена одна маленькая ошибочка, и из-за этого едет вся вёрстка. Геткурс не всегда подсвечивает ошибки и их приходится искать самостоятельно. В этом уроке рассказываю, как это сделать быстро.
  • + с 12 минуты (если точно, то с 12:23) рассказываю о том, каким образом браузер отрисовывает нам страницу сайта/платформы/сервиса (для лучшего понимания, как всё работает)
Рассказываю о том:
22. КАК ПЕРЕКРАСИТЬ ВИДЖЕТ ДЛЯ СВЯЗИ С ПОДДЕРЖКОЙ
  • как правильно перекрасить виджет для связи с поддержкой на главной (да и в принципе, на любой) странице в Геткурсе + даю готовый CSS-код
Рассказываю о том:
23. ЦЕНООБРАЗОВАНИЕ. КАК ОЦЕНИТЬ РАБОТУ ПРИ КАСТОМИЗАЦИИ ПЛАТФОРМЫ GETCOURSE
  • какую стоимость установить за свои услуги
  • от чего зависит стоимость работы по кастомизации платформы Геткурс
В этом уроке:
24. КАК СТИЛИЗОВАТЬ СТАНДАРТНУЮ НАВИГАЦИЮ В ГЕТКУРС
  • как при помощи готового кода стилизовать стандартную навигацию от GetCourse
  • как добавить дополнительный элемент в навигационный блок при помощи JS
  • как работает код из урока
  • о своём личном опыте по установлению цен на такие услуги на фрилансе
  • где можно подсмотреть актуальные цены на такие услуги
Также делюсь лайфхаком, как можно продать готовый код клиенту (сделать доппродажу)
Рассказываю о том:
25. НЕСТАНДАРТНЫЕ ШРИФТЫ НА GETCOURSE. КАК ПОДКЛЮЧИТЬ И ИСПОЛЬЗОВАТЬ ЛЮБОЙ СТОРОННИЙ ШРИФТ ИЗ ИНТЕРНЕТА
  • для чего подключать сторонние шрифты и почему вообще они требуют подключения
  • что такое веб-безопасные шрифты и для чего они нужны
рассказываю о том:
26. НАХОДИМ НУЖНЫЕ НАМ СТАНДАРТНЫЕ ЭЛЕМЕНТЫ В GETCOURSE В ПОДТРЕНИНГЕ И ПОДГОНЯЕМ ПОД СТИЛЬ ОНЛАЙН-ШКОЛЫ
  • как найти нужные элементы в подтренинге и их стилизовать при помощи CSS
  • как убрать ненужные элементы в подтренинге на GetCourse
  • как стилизовать стандартное меню для админов и подогнать под цвет любого проекта
  • какие форматы файлов со шрифтами существуют и какие лучше всего подключать к GetCourse
  • какие есть способы подключения шрифтов к платформе GetCourse
Подключим сторонние шрифты к Геткурсу из макета и применим их к любым элементам на GetCourse
  • что нужно сделать обязательно, когда подключаете сторонние шрифты к GetCourse
  • затронем тему приоритетов стилей в CSS
+ весь код из урока
Рассказываю о том:
27. УСТАНАВЛИВАЕМ АНИМИРОВАННЫЙ ЛИНЕЙНЫЙ ПРОГРЕСС-БАР ПРОХОЖДЕНИЯ ТРЕНИНГА
  • как при помощи набора готовых кодов установить линейный прогресс-бар
  • как поменять цвета прогресс-бара под стиль любой онлайн-школы
  • как настроить Геткурс, чтобы прогресс-бар работал
  • принципы работы любого прогресс-бара на GetCourse
+ готовый код HTML, CSS и JavaScript для быстрой установки прогресс-бара
  • о нескольких интересных свойствах в CSS-коде для прогресс-бара
В этом уроке:
28. УСТАНАВЛИВАЕМ БЛОК-ПРИВЕТСТВИЕ И ПОДТЯГИВАЕМ ИМЯ ИЗ ПРОФИЛЯ
  • рассказываю, как за пару минут установить блок с приветствием и подтянуть туда имя пользователя
  • делюсь готовым кодом
  • объясняю, как всё работает
  • подробно разбираю HTML и CSS-код
+ весь код из урока
  • рассказываю, как браузер может подпортить вашу верстку и как это исправить
  • рассказываю об одной из технологий гибкой верстки и как она работает
  • рассказываю о наследуемых и ненаследуемых свойствах CSS
  • рассказываю об относительных и абсолютных величинах в CSS и для чего они нам нужны
В этом уроке:
29. УСТАНАВЛИВАЕМ БЛОК-ПРИВЕТСТВИЕ С АВАТАРКОЙ ПОЛЬЗОВАТЕЛЯ И ИМЕНЕМ
  • рассказываю, как за пару минут установить блок с приветствием и подтянуть туда имя и аватарку пользователя
  • делюсь готовым кодом
  • объясняю, как всё работает
+ весь код из урока
  • подробно разбираю HTML и CSS-код и рассказываю об интересных свойствах CSS
  • рассказываю об особенностях работы с отступами
  • рассказываю об особенностях работы с шириной и высотой элементов
В этом уроке:
30. УСТАНАВЛИВАЕМ ШАБЛОН ОФОРМЛЕНИЯ СПИСКА МОДУЛЕЙ №1
  • рассказываю, как за пару минут установить шаблон оформления списка модулей
  • делюсь готовым кодом CSS
  • объясняю, как изменить цвета под стиль любой онлайн-школы
+ весь код из урока
В этом уроке:
31. УСТАНАВЛИВАЕМ АНИМИРОВАННЫЙ ЛИНЕЙНЫЙ ПРОГРЕСС-БАР ПРОХОЖДЕНИЯ ТРЕНИНГА №2
  • как при помощи набора готовых кодов установить линейный прогресс-бар
  • как поменять цвета прогресс-бара под стиль любой онлайн-школы
  • как настроить Геткурс, чтобы прогресс-бар работал
+ готовый код HTML, CSS и JavaScript для быстрой установки прогресс-бара
  • как изменить окончание в слове (или всё слово сразу) в зависимости от пола пользователя
  • принципы работы любого прогресс-бара на GetCourse
В этом уроке:
32. УСТАНАВЛИВАЕМ БЛОК С АВАТАРКОЙ, ИМЕНЕМ И ФАМИЛИЕЙ ПОЛЬЗОВАТЕЛЯ
  • рассказываю и показываю, как установить блок с аватаркой пользователя, именем и фамилией
  • рассказываю, как перекрасить блок под цвет любого проекта
+ готовый код HTML и CSS для быстрой установки блока
  • рассказываю принцип работы данного кода
  • разбираем импортируемый код HTML
  • разбираем установленный код CSS
  • рассказываю об интересных и полезных свойствах CSS
В этом уроке:
33. КАК ПОДОГНАТЬ РАЗМЕРЫ ЭЛЕМЕНТОВ В ТОЧНОСТИ ПО МАКЕТУ
  • об очень удобном инструменте, которым пользуются все, кто кастомизирует Геткурс по макету
  • как пользоваться этим инструментом и как с его помощью подогнать размеры элементов в точности как в макете в Figma
+ HTML и CSS-код подгоняемого блока
В этом уроке:
34. УСТАНАВЛИВАЕМ БЛОК С КОЛИЧЕСТВОМ ПОЛУЧЕННЫХ БАЛЛОВ/ПРОЙДЕННЫХ УРОКОВ
  • рассказываю и показываю, как установить блок с количеством полученных баллов (можно использовать также для демонстрации количества пройденных уроков)
  • рассказываю, как перекрасить блок под цвет любого проекта
+ готовый код HTML и CSS для быстрой установки и настройки блока
В этом уроке:
35. КАК РАЗДЕЛИТЬ СПИСОК МОДУЛЕЙ (ТРЕНИНГОВ/ПОДТРЕНИНГОВ) НА РАЗДЕЛЫ/КАТЕГОРИИ
  • рассказываю и показываю, как разделить список тренингов на разделы/категории
  • показываю весь процесс с нуля
  • разбираем установленный код CSS
+ готовый код CSS из урока
  • рассказываю, как всё работает
  • затрагиваем очень нужную тему - псевдоклассы для определения элемента по его порядковому номеру
  • рассказываю принцип работы данного кода
  • разбираем импортируемый код HTML
  • разбираем установленный код CSS
  • разбираем импортируемый код JS
  • рассказываю о полезных свойствах CSS
Иногда нужно разбить подтренинги на различные разделы/категории. Есть способ сделать это при помощи специальных псевдоклассов, которые позволяют стилизовать любой элемент на странице согласно его порядковому номеру, что очень облегчает работу.
В этом уроке:
36. УСТАНАВЛИВАЕМ РЕЙТИНГОВУЮ ТАБЛИЦУ В ЛЮБОЙ ТРЕНИНГ/ПОДТРЕНИНГ
  • рассказываю и показываю, как быстро и просто установить блок с рейтинговой таблицей
  • рассказываю, как перекрасить блок под цвет любого проекта
  • рассказываю принцип работы данного кода
+ готовый код HTML, CSS и JS для быстрой установки и настройки блока
  • разбираем импортируемый код HTML
  • разбираем установленный код CSS
Блок с рейтинговой таблицей выводит на страницу список учеников согласно их достижениям, количество выводимых учеников можно настроить. В уроке два варианта кода для таблицы - с кнопкой и с кликабельной ссылкой.
  • разбираем импортируемый код JS
  • рассказываю, как произвести необходимые настройки скрипта
В этом уроке:
37. БЛОК ДЛЯ ОТСЛЕЖИВАНИЯ ПОСЛЕДНЕГО ПОСЕЩЕННОГО УРОКА
  • рассказываю и показываю, как быстро и просто установить блок для отслеживания последнего посещенного урока
  • рассказываю, как перекрасить блок под цвет любого проекта
  • рассказываю принцип работы данного кода
+ готовый код HTML, CSS и JS для быстрой установки и настройки блока
  • разбираем импортируемый код HTML
  • разбираем установленный код CSS
Блок позволяет вывести на страницу ученика информацию о последнем посещенном им уроке, а также кнопку для перехода в этот урок. Также при помощи этого скрипта можно вывести название последнего посещенного модуля и кнопку для перехода в модуль, скрипт заносит все нужные данные в переменные.
В этом уроке:
38. УСТАНАВЛИВАЕМ ПРЕЛОАДЕР (ИНДИКАТОР ЗАГРУЗКИ СТРАНИЦЫ) В ВИДЕ ШКАЛЫ СО СТРЕЛКОЙ
  • рассказываю и показываю, как быстро и просто установить прелоадер
  • рассказываю, как перекрасить его под цвет любого проекта
  • разбираем код CSS
+ готовый код CSS и JS для быстрой установки и настройки прелоадера
  • разбираем импортируемый код JS
Блок позволяет не показывать страницу до тех пор, пока все CSS-стили не подгрузятся. Вместо дергающейся загружающейся страницы пользователь видит красивый индикатор загрузки, который можно раскрасить по инструкции под стиль любой онлайн-школы.
  • разбираем импортируемый код JS
  • рассказываю, как произвести необходимые настройки скрипта
В этом уроке:
39. CSS-ШАБЛОН ДЛЯ СПИСКА УРОКОВ №1
  • рассказываю и показываю, как быстро и просто установить CSS-шаблон в вашем аккаунте GetCourse
  • рассказываю, как перекрасить элементы страницы под цвет любого проекта
  • разбираем установленный код CSS
+ готовый код CSS для быстрой установки
CSS-код позволяет буквально за минуту преобразить стандартное оформление списка уроков на Геткурсе. Можно поменять цвет любого элемента по инструкции и подогнать под фирменную цветовую гамму любой онлайн-школы.
В этом уроке:
40. С НУЛЯ ВЕРСТАЕМ БЛОК С РЕЖИМОМ РАБОТЫ ТЕХПОДДЕРЖКИ
  • рассказываю и показываю, как с нуля сверстать блок по макету в вашем аккаунте GetCourse
  • делюсь лайфхаками и своим опытом по работе с инструментом разработчика в браузере
  • изучаем некоторые свойства CSS и их особенности
+ готовый код HTML и CSS для быстрой установки
Цель записи этого видеоурока - показать и рассказать, как с самого нуля ИЗ НИЧЕГО сверстать блок по макету в Figma. Поэтапно, постепенно, не торопясь.
В этом уроке:
41. УСТАНАВЛИВАЕМ КРУГОВОЙ ПРОГРЕСС-БАР ПРОХОЖДЕНИЯ ТРЕНИНГА
  • рассказываю и показываю, как установить прогресс-бар в вашем аккаунте GetCourse
  • рассказываю и показываю, как его перекрасить или видоизменить до неузнаваемости
+ готовый код HTML, CSS и JS для быстрой установки прогресс-бара
  • разбираем код HTML, CSS и JS
  • объясняю принцип работы этого блока
Этот блок специально разработан таким образом, чтобы его можно было легко перекрасить, видоизменить, установить и настроить за 5 - 10 минут в любой онлайн-школе на Геткурс.
В этом уроке:
42. JavaScript для техспецов. Урок № 1. Введение в программирование
  • даю информацию, что такое JS и почему крутые техспецы умеют им пользоваться
  • рассказываю о том, что следует знать, чтобы не запутаться в двух строчках кода
  • рассказываю, в каком объёме нужно знать JS техническому специалисту
+ код из урока
  • объясняю принцип работы JavaScript
Если умеете писать скрипты - вы уже на голову выше большинства техспецов, потому что, зная JS, можно делать невозможное возможным.
Этот урок - начало серии видеоуроков для технических специалистов, которые хотели бы научиться программировать, но не знают с чего начать. Начинаем поэтапно и подробно (на пальцах) разбираться с JS и учимся писать скрипты.
В этом уроке:
43. ВЫВОДИМ НА СТРАНИЦУ БОНУСНЫЙ БАЛАНС И КНОПКУ «ПОТРАТИТЬ»
  • рассказываю и показываю, как установить блок в вашем аккаунте GetCourse
  • рассказываю, как его перекрасить под цвет любого проекта
  • разбираем код HTML, CSS и JS
+ готовый код HTML, CSS и JS для быстрой установки
Блок выводит на страницу сумму бонусных рублей на балансе пользователя. Легко устанавливается, перекрашивается под цвет любого проекта. При нулевом бонусном балансе кнопка в блоке блокируется и перекрашивается.
В этом уроке:
44. УСТАНАВЛИВАЕМ КАЛЕНДАРЬ №1 ДЛЯ GETCOURSE
  • рассказываю и показываю, как установить календарь в вашем аккаунте GetCourse
  • рассказываю, как его перекрасить под цвет любого проекта
  • разбираем код HTML, CSS и JS
+ готовый код HTML, CSS и JS для быстрой установки
Календарь автоматически проходит по всем тренингам и подтренингам и собирает в одном месте все даты выхода уроков.
  • простым языком объясняю, для чего нам нужны инструменты разработчика
  • что такое JQuery и почему так много путаницы у тех, кто пытается научиться программировать самостоятельно
  • разберем 2 простейших скрипта, которые сделают то, что стандартными настройками GetCourse сделать невозможно
  • объясняю принцип работы этого блока
  • объясняю принцип работы этого блока
В этом уроке:
45. УСТАНАВЛИВАЕМ КРАСИВЫЙ БЛОК ПРОДЛЕНИЯ ДОСТУПА К ТРЕНИНГУ
  • рассказываю и показываю, как установить блок продления в вашем аккаунте GetCourse
  • рассказываю, как его стилизовать под цвет любого проекта
+ готовый код для быстрой установки
  • разбираем код CSS
  • рассказываю о том, как точечно применить стили именно к нужному блоку
Блок продления показывает ученикам период доступа к тренингу, а также позволяет продлить период доступа (платно или бесплатно).
В этом уроке:
Наверняка вы не раз видели рекламный баннер от GetCourse, который сообщает администраторам о каких-либо мероприятиях. А мы установим свой баннер, который покажем своим ученикам и сообщим им о каком-нибудь событии.
+ готовый код для установки рекламного баннера
  • рассказываю и показываю, как показать рекламный баннер конкретному сегменту в тренинге/подтренинге
  • показываю, как установить баннер на все страницы или в конкретном тренинге
  • рассказываю о том, что это за рекламный баннер, что он умеет и как работает
48. ДОБАВЛЯЕМ РЕКЛАМНЫЙ БАННЕР НА ВСЕ СТРАНИЦЫ GETCOURSE В ВАШЕМ АККАУНТЕ ИЛИ В КОНКРЕТНЫЙ ТРЕНИНГ
В этом уроке:
  • пробежимся по коду и расскажу, как он работает
Такой прогресс-бар - необычный способ показать количество пройденных уроков в тренинге на Геткурс. Новый кружок закрашивается автоматически после прохождения очередного урока.
+ готовый код HTML, CSS и JS для быстрой установки прогресс-бара
  • разбираем код
  • рассказываю и показываю, как его перекрасить, изменить и подогнать под любой проект
  • рассказываю и показываю, как установить такой прогресс-бар в вашем тренинге на GetCourse за 5 минут
49. УСТАНАВЛИВАЕМ ПРОГРЕСС-БАР ПРОХОЖДЕНИЯ УРОКОВ В ВИДЕ КРУЖОЧКОВ С ГАЛОЧКАМИ
В этом уроке:
  • рассказываю, как правильно всё настроить, чтобы прогресс-бар работал автоматически
  • делюсь лайфхаком, как сделать правку в коде в блоке HTML более комфортной и расширить границы поля ввода
  • затрагиваем тему гибкой вёрстки при помощи grid
  • подсвечиваю некоторые важные моменты в CSS
  • рассказываю, как можно спрятать не модули/уроки, а любую другую информацию
  • рассказываю, как правильно всё настроить, чтобы всё работало
  • разбираем код HTML, CSS, JS
В этом уроке:
50. МЕНЮ-АККОРДЕОН В СПИСКЕ ТРЕНИНГОВ, ПОДТРЕНИНГОВ И УРОКОВ В GETCOURSE. СКРЫВАЕМ МОДУЛИ, УРОКИ И ЛЮБУЮ ДРУГУЮ ИНФОРМАЦИЮ ПОД КОМПАКТНОЙ КНОПКОЙ
  • рассказываю и показываю, как установить код на GetCourse за 5 минут в список подтренингов и в список уроков
  • рассказываю и показываю, как заменить кнопку на любой другой кликабельный элемент (скрытая информация может открываться при нажатии на кнопку, текст, картинку и т.п.)
+ готовый код HTML, CSS и JS для быстрой установки
Решение позволяет компактно представить большой объём информации и упростить навигацию по списку уроков, модулей (подтренингов). Необязательно скрывать при помощи этого скрипта именно уроки и модули, можно спрятать любую информацию (расписание, картинку, текст и т.п.). Достаточно добавить кнопке и контейнеру специальные классы.
46. НОВОГОДНИЙ ШАБЛОН ОФОРМЛЕНИЯ МОДУЛЕЙ ДЛЯ GETCOURSE. УСТАНАВЛИВАЕМ ЗА 5 МИНУТ
  • рассказываю и показываю, как установить CSS-шаблон в вашем аккаунте GetCourse
  • рассказываю, как его перекрасить под цвет любого проекта
  • пробежимся по коду CSS, подсвечу основные моменты
+ готовый код для быстрой установки
  • рассказываю о хитром способе добавления кода HTML
При помощи специального CSS-шаблона можно преобразить список модулей/подтренингов до неузнаваемости за 5 - 10 минут. Нужно всего лишь иметь этот шаблон и знать основы CSS 😉
В этом уроке:
47. КАК ИСПОЛЬЗОВАТЬ НЕЙРОСЕТИ В РАБОТЕ И КАК ИСПОЛЬЗОВАТЬ CHATGPT без VPN
  • рассказываю, насколько важно научиться пользоваться нейросетью в наше время и в нашей сфере
  • на реальном примере показываю, как нейросеть решает поставленную перед нами задачу
  • делюсь сервисом, который связывает нас с ChatGPT без всяких VPN и на русском языке
+ готовый код
О нейросетях говорят из каждого утюга. Это не просто так - нейросети действительно очень экономят время и помогают в работе. Стоит только научиться ими пользоваться, именно этим мы и займёмся 😉
  • рассказываю о том, что нужно обязательно сказать заказчику
  • делюсь готовым кодом, который добавляет дополнительный функционал в GetCourse (добавляет в файловое хранилище возможность скопировать ссылку на файл прямо из списка в один клик). Код написан полностью нейросетью
В этом уроке:
51. ВЫВОДИМ В ПОДТРЕНИНГЕ КОЛИЧЕСТВО ПРОЙДЕННЫХ УРОКОВ
  • рассказываю и показываю, как установить код для вывода количества пройденных в тренинге уроков на GetCourse за 2 минуты
  • рассказываю, как всё работает и как стилизовать выведенную информацию под свой проект
+ готовый код CSS и JS для быстрой установки
  • разбираем код JS и CSS
  • рассказываю, как правильно всё настроить, чтобы всё работало
  • рассказываю об особенностях работы скрипта
При помощи специального скрипта выведем информацию о количестве пройденных уроков в тренинге/подтренинге.
В этом уроке:
52. УСТАНАВЛИВАЕМ ШАБЛОН №2 ДЛЯ ОФОРМЛЕНИЯ СПИСКА УРОКОВ
  • рассказываю и показываю, как установить данный шаблон на GetCourse за 1 минуту в список уроков
  • рассказываю и показываю, как перекрасить шаблон в свои фирменные цвета
  • разбираем код CSS, JS
+ готовый код для быстрой установки
  • делюсь лайфхаком по разбору любого чужого кода
Решение позволяет за пару кликов сделать список уроков на Геткурс красивым. Шаблон адаптирован под все разрешения экрана, его можно перекрасить по инструкции в любые цвета.
  • делюсь кодом CSS для стилизации урока в мобильном приложении ГетКурс
+ готовый код для быстрой установки
  • делюсь лайфхаком, как открыть версию (вид) урока из мобильного приложения GetCourse на компьютере и как его стилизовать
  • каким образом работает данный скрипт, подробно разбираем его
  • как добавить баннер в уроке за пару минут
54. ДОБАВЛЯЕМ СВОЙ БАННЕР В УРОКЕ НА GETCOURSE
В этом уроке:
Начинаем оформлять урок внутри. Начнём с кастомизации верхней части страницы внутри урока, постепенно и подробно разбирая и кастомизируя блок за блоком в уроке.
В этом уроке:
55. ДОБАВЛЯЕМ ПРЕЛОАДЕР, КОТОРЫЙ СКРЫВАЕТ ДЕРГАНИЯ ПРИ ЗАГРУЗКЕ СТРАНИЦ НА GETCOURSE
  • как установить прелоадер за 1 минуту в любой аккаунт GetCourse
  • как подогнать его под стиль любой онлайн-школы (изменить цвет, размер, форму или вовсе изменить до неузнаваемости)
  • каким образом работает данный скрипт, разбираем код CSS и JS
+ готовый код CSS и JS для быстрой установки
  • какие можно выставить настройки в браузере, чтобы проверить работу скриптов при плохой скорости интернета
  • делюсь лайфхаком по безопасной работе с полем "прочие скрипты для body"
  • знакомимся с интересными CSS-свойствами обводки (border)
  • делюсь кодом для дополнения навигации недостающей информацией (дополнительными кликабельными пунктами)
  • разбираем готовый код CSS и JS
  • показываю, как расположить всё содержимое внутри урока по центру страницы
  • рассказываю и показываю, как можно кастомизировать навигацию: изменить цвет текста, сам текст и символ между пунктами навигации
+ готовый код CSS и JS для быстрой установки
  • рассказываю и показываю, как расположить логотип по центру, изменить отступы у логотипа или вовсе его скрыть
  • рассказываю и показываю, как изменить цвет фона внутри урока
53. ОФОРМЛЯЕМ УРОК НА GETCOURSE. РАБОТАЕМ С ЛОГОТИПОМ, КАСТОМИЗИРУЕМ НАВИГАЦИЮ И КНОПКИ УПРАВЛЕНИЯ, ДОПОЛНЯЕМ НАВИГАЦИЮ, МЕНЯЕМ ЦВЕТ ФОНА
В этом уроке:
Добавим баннер в уроке, который будет меняться в зависимости от разрешения экрана. В каждом уроке можно установить свой баннер для мобилки и десктопа. Также в уроке делюсь лайфхаком, как открыть версию урока из приложения GetCourse на десктопе.
Решение позволяет скрыть загрузку старых стилей и решает проблему дергания при загрузке страниц на платформе (особенно актуально, когда страницы кастомизированны при помощи CSS). После установки прелоадера контент на всех страницах аккаунта появляется плавно и без рывков.
Контакты
Шапенков Николай Помпиевич
ИНН 432602071108
Политика конфиденциальности
Перейти к уроку могут только участники закрытого канала «КАНАЛ СО СКРИПТАМИ ДЛЯ GETCOURSE».
Почему у меня нет доступа?
О том, как попасть в наш закрытый клуб, вам расскажет бот-помощник
Напишите в службу заботы, если у вас возникли вопросы
Приобрести видеоуроки и скрипты по отдельности можно прямо здесь. Просто закройте этот попап, нажав на крестик вверху, выберите нужный урок и нажмите кнопку