Как настроить оформление аккаунта на GetCourse

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

На GetCourse есть два вида основного дизайна аккаунта. Старый дизайн доступен во всех аккаунтах, новый дизайн в процессе внедрения и выпускается постепенно по разделам.

Рассмотрим:

• Как включить или отключить новый дизайн
• Какие страницы доступны в новом дизайне
• Как добавить счетчики на страницы с новым дизайном

Переключить дизайн могут:

• владелец аккаунта,
• администратор с правом «Может настраивать аккаунт».

Для этого:

1. Перейдите в раздел «Сайт» — «Страницы» — «Новый дизайн».

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

3. Нажмите «Сохранить» в конце страницы.

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

Превью-картинку для тренинга/подтренинга можно задать при создании или на вкладке «В приложении».

При необходимости можно добавить:

• группу, в которую попадет пользователь после входа или отправки обратной связи;
• адрес страницы, на которую попадет пользователь после входа или отправки обратной связи.

При использовании счетчиков (Я.Метрика, Google Tag Manager, Пиксель ВКонтакте) необходимо дополнительно добавить их на страницы в новом дизайне, чтобы данные продолжили собираться.

Для этого:

1. Перейдите в раздел «Сайт» — «Страницы» — «Новый дизайн».
2. Спуститесь в конец страницы и добавьте ID счетчиков и пикселей в соответствующие поля:
   • Яндекс Метрика — формат числовой (пример: 49564775);
   • Google Tag Manager — формат строки (пример: GTM-HR3WN1M, где GTM есть всегда);
   • Пиксель ВКонтакте — формат строки (пример: VK-RTRG-867223-8lKE, где VK-RTRG есть всегда).
3. Сохраните настройки.

Изменить основные цвета аккаунта могут:

• владелец аккаунта
• администратор с правом «Может настраивать аккаунт».

Для этого:

1. Перейдите в раздел «Сайт» — «Страницы» — «Оформление аккаунта».

2. Переключитесь на дизайн, который используете в аккаунте: старый или новый.
3. Выберите нужную палитру. Изменится только оформление текущей страницы, сам аккаунт останется прежним.
4. Если дизайн вас устраивает, сохраните настройки.

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

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

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

Рассмотрим:

• Как настроить внешний вид меню
• Как сбросить настройки меню

Настроить меню может:

• владелец аккаунта;
• сотрудник с набором прав:
  • «Может управлять CMS»,
  • «Может управлять настройками сайта»;
• администратор с правом «Может управлять настройками сайта».

Для этого:

1. Перейдите в раздел «Сайт» — «Страницы» — «Настройки меню».

2. Выберите желаемые цвета для меню и текста из готовой палитры либо укажите в одном из форматов:
   • RGBA/RGB с поддержкой настройки непрозрачности, где 0.0 — полностью прозрачный, а 1.0 — полностью непрозрачный.
   • HEX — шестнадцатеричный формат.

Изменения отображаются в демонстрационном меню справа. Оно обновляется автоматически, поэтому сохранять настройки для их просмотра не требуется.

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

4. Добавьте свои иконки для разделов меню. Требования и рекомендации для иконок:
   • Формат: png на прозрачном фоне или jpg/jpeg на любом фоне (он будет перекрывать цвет меню).
   • Размер: не более 50 мб.
   • Ширина × высота: 48 x 48 px.

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

Чтобы выборочно сбросить настройки:

1. Некоторых полей — удалите значение из этого поля и сохраните изменения.
2. Шрифта — выберите пункт «По умолчанию» и сохраните изменения.
3. Иконки — нажмите крестик рядом с названием картинки и сохраните изменения.

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

Если для раздела тренингов в аккаунте используется старый дизайн, вы можете изменить оформление курсов через настройки вида. Подробнее об этом читайте в статье «Как настроить вид тренинга или списка тренингов на GetCourse».

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

Для брендирования аккаунта вы можете:

• указать свое название или логотип, который будет отображаться на страницах школы в левом углу;

• добавить иконку для мобильного приложения;

• настроить фавикон для страниц сайта - он будет отображаться на вкладках браузера и в поисковых системах;

• настроить вид видеоплеера, чтобы кнопки управления отображались в ваших цветах;

• изменить шрифт на страницах. Есть возможность выбрать один из системных шрифтов или настроить собственный. Подробнее в статьях:
  • Как использовать системные шрифты на сайте и в блоге
  • Как изменить шрифт с помощью темы
  • Как применить собственный шрифт

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

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

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

В зависимости от задачи код можно добавить:

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

  
  

  Как добавить код в блок из урока:

Как добавить код в блок на странице:

• Отдельным блоком из раздела «Вставка». Так код будет влиять на все элементы урока или страницы, на которой расположен.

• На странице старого конструктора. Такой конструктор используется для старого дизайна в настройках вида тренинга и на системных страницах, например, на странице входа.

  
  

  Чтобы добавить CSS-код в стили такой страницы, нажмите на </>.

Чтобы добавить JS-код:

1. Нажмите на нужный элемент страницы, чтобы у него появилась красная обводка.
2. Нажмите «Добавить блок» в правой панели.

3. Перейдите в раздел «Элементы» и кликните 2 раза на блок «Javascript».

• В настройках аккаунта. Код, вставленный в поля head или body будет распространяться на все страницы аккаунта (кроме страниц-исключений).

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