На первый взгляд — просто, а на практике всё сложнее.

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

❗️Но есть способ проще — создать свою кнопку с помощью HTML и CSS, буквально за пару минут. Вот подробная инструкция для новичков.

1️⃣ Открываем редактор старого конструктора:

➖ Перейдите в список тренингов или список уроков, где хотите установить кнопку.
➖ Нажмите кнопку «Действие» → «Настроить вид».
➖ Откроется специальное меню редактора, где мы будем работать с HTML и CSS.

2️⃣ Добавьте HTML-блок:

➖В открывшемся редакторе выберите «добавить блок» → «вставка» → «HTML-блок».
➖Скопируйте и вставьте туда этот код:

<a href="ВАША_ССЫЛКА_ЗДЕСЬ" class="my-shiny-button" target="_blank">
Текст вашей кнопки
</a>

⚠️ Замените текст кнопки и вставьте свою ссылку вместо ВАША_ССЫЛКА_ЗДЕСЬ (оставьте кавычки!) — например, на MAX, запись на консультацию и т.д.

3️⃣ Добавьте CSS-код для стиля кнопки:

➖В правом меню редактора найдите значок </>
➖Кликните на него и вставьте следующий CSS-код:

.my-shiny-button {
display: inline-block;
background: #ffb01b; /* фон кнопки */
color: #fff; /* цвет текста */
padding: 12px 28px;
border-radius: 8px;
text-decoration: none;
font-weight: 600;
font-size: 18px;
box-shadow: 0 3px 9px rgba(0,0,0,0.07);
transition: background 0.2s, box-shadow 0.2s;
}
.my-shiny-button:hover {
background: #ffc94a; /* фон при наведении */
box-shadow: 0 5px 15px rgba(0,0,0,0.11);
color: #232323; /* цвет текста при наведении */
}

4️⃣ Меняйте внешний вид кнопки под себя:

➖ Цвет кнопки (background) и цвет текста (color) можно изменить на любые — при необходимости, замените код цветов на подходящие под ваш стиль.

➖ В блоке .my-shiny-button:hover указаны цвета кнопки и текста при наведении мышкой.

📌 После внесения изменений не забудьте сохранить результат в блоке CSS и в меню редактора. После сохранения можно перейти к просмотру результата нажав на глаз.

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

⭐ А если не хочется тратить время на самостоятельную стилизацию или нужно комплексное оформление курса, — в коллекциях магазина Гетшоп уже есть готовые решения.

У нас вы найдёте не только кнопки разного формата (вертикальные и горизонтальные), но и целый набор элементов, которые удобно настраивать под свой фирменный стиль: цвета, шрифты и многое другое меняются буквально в пару кликов.

👉 Заглянуть в Гетшоп

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

Остались вопросы? Смело пишите в комментариях, мы всегда рады вашей активности и готовы помочь!

#СоветыОтГетшоп #формыикнопки

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

Мы специально закладываем эту возможность, чтобы любой шаблон можно было адаптировать к вашему стилю и задачам — без долгих доработок и сложных настроек.

Чтобы быстро и наглядно менять оформление под себя, мы предлагаем использовать браузерные расширения для работы со стилями.

Сегодня расскажем, как это работает на примере расширения Magic CSS, но вы можете пользоваться и аналогами.

1️⃣ С чего начать:

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

2️⃣ Перейдите к элементам которые будете менять.

➖Например, если меняете оформление тренингов, то перейдите на страницу где видно оформление тренингов.

➖Находясь на нужной странице запустите расширение.

3️⃣ Вставляем код который будем менять:

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

➖Если вы меняете цвета в других шаблонах — скопируйте CSS шаблона и вставьте его в рабочую область расширения.

4️⃣ Меняем цвета:

➖Находите переменные того элемента, который хотите поменять — все они подписаны для удобства и подбираете цвет прямо в редакторе Magic CSS.

Например, хотите изменить цвет кнопки в тренингах — находите соответствующие переменные и задаёте свои цвета. Все изменения вносимые в расширение вы будете видеть сразу на странице.

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

5️⃣ Сохраняем результат:

➖Когда подобрали нужные цвета, просто перенесите обновленный код на GetCourse.

Если вы делали оформление с помощью коллекций и хотите использовать разные цвета для разных тренингов, посмотрите наш пост о том, как оптимизировать этот процесс.

💘 Было полезно? Ставьте лайк, пишите вопросы и делитесь впечатлениями в чате — ваши реакции помогают нам делать материалы ещё лучше!

#СоветыОтГетшоп #Коллекции

Друзья, всем привет! 🙌

Канал магазина Гетшоп — ваше место вдохновения и пользы.

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

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

Если появились вопросы, задайте их в комментариях под постом 💬

Наши преимущества:

📲 Адаптация - Все наши решения адаптированы под мобильную версию и приложение чатиум.

🎨 Индивидуальность - Цвета элементов шаблонов заданы с помощью переменных. Это позволяет менять цвета на свои в несколько кликов, что делает ваше оформление эксклюзивным!

⏳ Простота использования - Установка шаблона занимает не более 5 минут, и не требует специальных навыков или знание кода.

💸 Экономия - Разработка индивидуального оформления стоит от 50 000 руб. Используя наши шаблоны вы экономите не только время, но и деньги!

📍 На сайте вы найдете более 100 готовых решений для оформления #геткурс

Наши акции!

🎁 Для новых клиентов GetCourse (Геткурс) и Get Модуль (сервис приема платежей от геткурс) мы дарим до 10 000 руб. на оформление вашего аккуанта => Узнать больше

🔥 Берите больше, платите меньше! Просто кладите больше товаров в корзину и получайте скидку до 25%! Скидка активируется автоматически при добавлении товара в корзину на сумму от 10 000 руб. => Перейти на сайт

*****************

🔎 Быстро найти нужное оформление в канале помогут хештеги.
Просто вставьте в строку поиска на канале тот хештег, что вас интересует👇

Оформление страницы оплаты - #Упаковкаплатежей
Оформление аккаунта в едином стиле - #Коллекции
Оформление личного кабинета - #Личныйкабинет
Оформление тренингов и подтренингов - #Тренинги
Оформление списка уроков - #Списокуроков
Оформление уроков внутри - #Урокивнутри
Календарь и расписание - #Расписание
Прогресс-бары - #Прогресс
Левая панель (меню) - #Меню
Элементы для лендинга - #Лендинг
Формы, кнопки, корзина - #формыикнопки
Прочие решения - #Прочее
Отзывы покупателей - #Отзывы
Полезные советы - #СоветыОтГетшоп
Новости - #НовостиГетшоп
Подарки - #ПодаркиОтГетшоп

Спасибо, что вы с нами! ✨

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

Например, спрятать ролик внутри раскрывающегося списка («аккордеона»), поставить его в обычный текстовый блок или встроить в элемент старого конструктора.

Штатными настройками платформы это сделать не получится.

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

Мы в магазине Гетшоп любим, когда всё работает просто и без лишних ограничений.

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

И этот полезный инструмент мы дарим подписчикам нашего закрытого сообщества в Макс.

Спасибо, что вы с нами! 💕

Переходите в бота и получайте подарок 🙂

#ПодаркиОтГетшоп #Тренинги #ЛичныйКабинет #Лендинги