Магия CSS/HTML/JS на GetCourse, Prodamus.XL и вообще
1.38K subscribers
24 photos
5 videos
1 file
13 links
Канал клуба Магии CSS/HTML/JS. Подписка по ссылке https://gcwithme.ru/getmagic. Промокод спрашивайте в @getmagic_chat
Download Telegram
СКРЫВАЕМ НЕДОСТУПНЫЕ ТРЕНИНГИ

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

Урок от @DmitrySpace решает эту проблему.

Однако, у этого «костыльного» решения есть несколько "но":

1. Поскольку скрипт срабатывает после полной загрузки страницы, на несколько мгновений этот тренинг-призрак все-таки становится видимым.

2. Скрипт не срабатывает в мобильном приложении.

🔎 Где искать урок?
Тренинги → Практика

🕘 Сколько требуется времени на установку?
10 минут

🔥Что принесет проекту?
Вы перестанете мучиться проблемой учеников "А вот я вижу тренинг, а уроки в нем недоступны!" и сможете более гибко настраивать визуальное оформление тренингов.

#тренинги
This media is not supported in your browser
VIEW IN TELEGRAM
ЧАСТИЧНАЯ ОПЛАТА (ПРЕДОПЛАТА, БРОНЬ) НА ЛЕНДИНГЕ

Как организовать для клиентов бронь цены или внесение предоплаты с ленда, когда еще и есть основное предложение с 100% оплатой, да еще и в один клик? А потом и учитывать этот аванс для расчета финального платежа за курс?

Легкого варианта в ГК нет - или ограничить предложение суммой предоплаты в настройках (что решает вопрос лишь частично) или сделать отдельное предложение на такие платежи.

Теперь такой проблемы не будет - потому что есть в Клубе решение от @araviw.

С помощью данного урока вы сможете выдавать для пользователей произвольные суммы к предоплате, которые будут формироваться на основе одного (основного) предложения. Иными словами - для одного предложения можно сразу формировать несколько ссылок с ленда на внесение разных сумм.

🔎 Где искать урок?
Тренинги → Практика

🕘 Сколько требуется времени на установку?
10 минут

🔥Что принесет проекту?
Вы организуете гибкую систему приема авансов без сложностей

#оплата #рассрочка #продажи
БАННЕР КАК У ГК

Если вам прилетела такая задача, то данный урок от @araviw идеально подойдет для ее решения!

И не смогли обойтись без "улучшайзинга"😉 Наш баннер настраивается в одном месте - на странице, с которой дальше он системно распространяется на все страницы аккаунта.

Для него доступны все настройки видимости - показ по группе, сегменту, времени, меткам и тд. Так же есть встроенный тайм-аут до следующего показа, если пользователь закрыл баннер.

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


🔎 Где искать урок?
Тренинги → Практика

🕘 Сколько требуется времени на установку?
20 минут (с учетом стилизации под проект)

🔥Что принесет проекту?
Сможете повышать конверсию продаж и мероприятий

#баннеры #стилизация #продажи
КНОПКИ В УРОКАХ «СЛЕДУЮЩИЙ» и «ПРЕДЫДУЩИЙ»

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

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

Копируйте код и вставляйте в настройки аккаунта как есть.

<style>
.lesson-navigation td .hidden-xs {
display:none;
}

.lesson-navigation td a {
background:#3192d6;
color:white;
padding:5px 10px;
border-radius:20px;
transition:all 0.3s;
}

.lesson-navigation td:first-child a:before {
content:"←"
}

.lesson-navigation td:last-child a:after {
content:"→"
}

.lesson-navigation td a {
text-decoration:none;
}

@media (max-width:400px) {
.lesson-navigation td a {
font-size:12px;
}
}

.lesson-navigation td a:hover {
box-shadow:0 0 4px #3192d6;
}

.text-center.hidden-xs span {
display:none;
}
</style>


#уроки #стилизация
This media is not supported in your browser
VIEW IN TELEGRAM
ПОКАЗ МЕТОДОВ ОПЛАТЫ В ЗАВИСИМОСТИ ОТ ID ПРЕДЛОЖЕНИЙ

Часто бывает так, что на одном аккаунте Геткурса возникает необходимость принимать оплаты на разные юрлица или ИП. Одни предложения — на одну платежную систему, другие — на другую.

В Геткурсе есть встроенное решение, но доступно оно только при покупке модуля "Бухгалтерия".

Для всех остальных пользователей можно воспользоваться универсальным скриптом от @DmitrySpace, который на оплатной странице позволяет скрывать методы оплаты по ID предложений внутри системы.


🔎 Где искать урок?
Тренинги → Практика

🕘 Сколько требуется времени на установку?
30 минут (с учетом подстановки в скрипт своих параметров)

🔥Что принесет проекту?
Упростит финансовые взаимоотношения с авторами и партнерами проекта.

#страницаоплаты #оплата #продажи
СТИЛИЗАЦИЯ БЛОКА «ПОСЛЕДОВАТЕЛЬНАЯ АНКЕТА»

Данное решение позволяет оформить блок "Последовательная анкета" с применением css-приемов (анимация подсветки кнопки вперед/назад, вариантов ответов пользователя, степени прогресса заполнения анкеты). Стили универсальные, подходят и для обычной анкеты.

Цветовая схема настраивается гибко — вы найдете в коде указания как поменять используемый в примере цвет.

🔎 Где искать урок?
Тренинги → Практика

🕘 Сколько требуется времени на установку?
10 минут

🔥Что принесет проекту?
Создаст у пользователей приятное впечатление при заполнении анкеты.

#анкета #стилизация
СБРОС ВЫПОЛНЕННЫХ УРОКОВ В ТРЕЙ

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

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

В качестве бонуса к данному решению @araviw сделала новую визуализацию статусов урока - теперь иконки располагаются справа, и их, включая цветовые подложки, вы можете настраивать как душе угодно :)

🔎 Где искать урок?
Тренинги → Практика

🕘 Сколько требуется времени на установку?
20 минут

🔥Что принесет проекту?
Идеальное решение, если вы хотите "освежить" внешний вид тренинга

#стилизация #уроки #тренинги
аккардеон.gif
10.9 MB
АККОРДЕОН В СПИСКЕ УРОКОВ

Если вы сторонник аккуратных списков вместо "простыней", то это клубное решение для вас.

Урок рассказывает о том, как большие (да и не очень) списки уроков можно собрать в аккуратные плашки аккордеона, при этом задав им стилизацию под проект по цветам. При этом количество конечных аккордеонов на странице не ограничено. И конечно, как и полагается приличному аккордеону 😆 - в момент сворачивания и разворачивания меняется иконка, символизирующая текущий статус (открыт или закрыт).

Данное решение от @araviw может быть так же использовано и для создания FAQ (блок "вопрос-ответ/частые вопросы") на сайте, как альтернатива стандартному блоку от самого Геткурса.

🔎 Где искать урок?
Тренинги → Практика

🕘 Сколько требуется времени на установку?
10 минут

🔥Что принесет проекту?
Вы сможете с легкостью стилизовать большой список текста (или уроков), разбив его на заголовок и внутреннюю область.

#стилизация #уроки #тренинги
🔴 «Можно ли купить доступ к одному уроку?» — часто спрашиваете вы.

Нет, но можно взять полный доступ ко всем урокам на 7 дней. Стоимость: 1500 руб.

Для получения доступа напишите Декану @gcwithmebot кодовую фразу «7 дней» и оплатите доступ.
ЗАПУСКАЕМ СОБЫТИЯ ПО КНОПКЕ «ОТПРАВИТЬ КОММЕНТАРИЙ»

Простой скрипт от @DmitrySpace, позволяющий запускать обработчик формы с любыми действиями для авторизованных пользователей, отправляющих комментарий через блок «Лента комментариев».

Как можно использовать это решение? Приведу пару примеров.

1. Автоматизация сбора отзывов на лендинге и выдача мгновенного вознаграждения (запуск процесса, отправка рассылки).

2. Геймификация на марафонах. Если использовать «ленту комментариев» вместо формы ответа на задание, можно начислять бонусы и/или отправлять рассылку в Телеграм со ссылкой на следующее (или бонусное) видео.

🔎 Где искать урок?
Тренинги → Практика

🕘 Сколько требуется времени на установку?
10 минут (если механика придумана заранее)

🔥Что принесет проекту?
Новые механики позволят увеличить вовлеченность пользователей. Больше вовлеченнности → больше покупок → больше денег в кассе

#лендинг #геймификация
Магия CSS/HTML/JS на GetCourse, Prodamus.XL и вообще pinned «🔴 «Можно ли купить доступ к одному уроку?» — часто спрашиваете вы. Нет, но можно взять полный доступ ко всем урокам на 7 дней. Стоимость: 1500 руб. Для получения доступа напишите Декану @gcwithmebot кодовую фразу «7 дней» и оплатите доступ.»
СТАТУС ТРЕНИНГА "ПРОЙДЕН"

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

Версия номер раз
1. Имеет опцию, которая позволяет выбрать один урок, после прохождения которого тренинг считается пройденным.
2. Работает на основе данных чатиума, из-за чего загружается быстрее, но имеет ряд ограничений:
— По иронии судьбы не работает в чатиуме.
— Но при этом в чатиуме обязательно должен быть Включён нативный вид.

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

🔎 Где искать урок?
Тренинги → Практика

🕘 Сколько требуется времени на установку?
5 минут

#тренинги
ТЕСТИРОВАНИЕ С ВЫБОРОМ ОТ 1 ДО 10

Набор стилей от Dmitry Space, который переворачивает варианты ответов в тестировании горизонтально, что идеально подходит для тестов, в которых предлагается оценить что-то по шкале, например, от 1 до 10.

Это решение подойдёт как для урока, так и для обычной страницы.

Ограничения:
1. Во всех вопросах должны быть одинаковые варианты ответа.
2. Не поддерживается выбор нескольких вариантов ответа.

🔎 Где искать урок?
Тренинги → Практика

🕘 Сколько требуется времени на установку?
5 минут (если само тестирование уже создано)

🔥Что принесет проекту?
Создаст у пользователей приятное впечатление при прохождении тестирования.

#тестирование