Каморка Геткурсовода 💻 | Канал Максима Елисеева
2.38K subscribers
194 photos
18 videos
10 files
107 links
Остались вопросы? Пишите — @Isagaya

Этот уютный канал посвещён фишкам и нестандартным решениям по дизайнам, интерфейсам и функционалам платформы от Куратора школы Магии Геткурса — Максима Елисеева.

Мой второй канал обо всём - https://t.me/closetmax ;)
Download Telegram
Свои страницы на Геткурсе вместо системных 🧐

Не секрет, что на Геткурсе можно кастомизировать если не абсолютно, то почти всё. И системные страницы не являются исключением.

Вы можете сильно преобразить исходную страницу, а можете поступить более хитрым способом: создать свою собственную.

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

И таким образом можно заменить хоть все системные страницы на свои. Для некоторых, правда, понадобятся знания работы с объектами данных, выводимыми Геткурсом на каждую страницу проекта :)

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

#лайфхак
Бросайте якорь! 😳

Практически все лендинги или страницы, как таковые, имеют якоря для удобной навигации по ним. И чаще всего, если блоки имеют бекграунд, появляется такая проблема с пустым местом (смотрите скриншот).

Встаёт вопрос, что делать в таком случае?

Есть пара вариантов решения. Но для начала хочу поделиться с вами классом якоря. Он имеет класс lt-anchor. Первый вариант - мы можем уменьшить его высоту до 0px, ведь по умолчанию он имеет высоту в 1px. Второй вариант заключается в том, чтобы покрасить наш якорь в цвет блоков :) Для этого просто примените свойство background нужного цвета.

#лайфхак
Больше блоков в виджете 👍

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

А что, если вы хотите поставить сторонний JS или же просто написать объяснительный текст?

Всё очень просто! Вы можете добавить любой блок в виджет путём обычного импорта/экспорта блоков из редактора страниц в Геткурсе. И наконец-то ваши виджеты приобретут вашу собственную индивидуальность :)

#лайфхак
This media is not supported in your browser
VIEW IN TELEGRAM
Форматировать или редактировать

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

Чтобы такого не произошло, держите лайфхак — забудьте про кнопку Backspace и Del напрочь! Следует выделить участок текста, который вы хотите отредактировать, и просто начать дописывать нужные исправления :)

#лайфхак
Интересная особенность 😳

Хочу поделиться с вами интересной особенностью, которую я заметил совершенно случайно. Когда я делал урок для Клуба Магии Геткурса, я ошибся в написании тега, и открыл для себя тег <j>, документации на который я не смог найти нигде в интернете.

Самое забавное, что Геткурс не воспринимает его как ошибку и не редактирует в коде как что-то постороннее. По умолчанию он находится в состоянии inline как у всех строчных элементов, но в отличии от тега <i> не придаёт тексту никакого форматирования. Удивительно, что его ещё и можно стилизовать :)

Если вам кажется, что вам не хватает элементов, или же просто хочется поэкспериментировать, то ловите этот замечательный тег 😂

#полезная_фишка #тёмная_магия
Поставить картинку в Геткурсе — задача не из лёгких 😅

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

Всё дело в том, что у Геткурса по умолчанию на блоке с классом image стоит правило background-size: cover. И действительно, это правило помогает занимать всё доступное пространство картинкой, масштабируя её по отведенному месту. Но у Геткурса есть проблема с этим блоком, так как её основная оболочка содержит огромные внутренние отступы, из-за чего это свойство работает не правильно.

Чтобы правильно разместить вашу картинку в блоке без урезки, в классе image используйте background-size: contain вместо cover. Тогда ваша иконка или картинка полностью уместится в этот блок. И не забудьте, чтобы перебить правило Геткурса, вам понадобится директива !important к значению свойства.

#полезная_фишка
Замылим всё! 😁

Многие после Недели Магии 5 открыли для себя чудесное свойство блюра изображений и блоков с помощью свойства filter со значением blur(). Так же многих заинтересовало значение grayscale().

Этот пост будет не столько практическим, сколько информационным :)

Благодаря даже двум значениям этого свойства, можно построить удивительные механики на ваших проектах. К примеру, если на ваших уроках есть цветные картинки, то недоступные уроки можно обесцветить :) Или навести интригу: размыть блюром следующее название урока, и тогда пользователю будет ещё интереснее узнать, что же ждёт его дальше.

#информативные_размышления
Добавим немного возможностей Геткурсу? 😉

Сегодня речь пойдет об инструменте скрытия блоков по параметру из URL. Кто-то уже знает, как работает эта штука, а кто-то нет :) Вкратце, идёт проверка параметра из урла страницы, проверяется её значение и блок либо скрывается, либо показывается.

Но меня смущает одно... функционал придумали целиковому блоку, а элементам - нет...

Я решил это немного исправить :) Теперь можно по параметру из урл что-либо сотворить с элементом на странице. В своём примере я изначально дал класс hide картинке, чтобы скрыть её, а затем проверял параметр select. И если он равняется единице, то скрипт показывает картинку на странице :)

Сам код ставится в конце вашей страницы, а в квадратных скобках и кавычках пишется тот параметр, который вы хотите проверить (у меня этот параметр select).

Cам код будет в посте ниже :)

#полезная_фишка
Сам код:

$(function() {
var params = window
.location
.search
.replace('?','')
.split('&')
.reduce(
function(p,e){
var a = e.split('=');
p[decodeURIComponent(a[0])] = decodeURIComponent(a[1]);
return p;
},
{}
);

if(params['select'] === '1') {
$('.secret-image').removeClass('hide');
}
})
Любой блок в форме... и не только там 😱

Геткурс открывает удивительные возможности, если знать как их применить :) В данном случае, можно поставить любой блок куда угодно и как угодно с помощью HTML-блока в редакторе.

На скриншотах грубый пример того, как в блок формы уместился и блок "Две колонки с произвольным контентом", который я заранее подредактировал, так как после вставки подобным образом он перестаёт быть редактируемым :)

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

#лайфхак
У канала уже 1000 подписчиков! Ура! 😊

Я безумно рад что канал растёт и развивается, а так же помогает питать знаниями вас ;)

Спасибо вам друзья и коллеги за вашу поддержку! 🥳
Красота в Чатиуме 🥳

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

Всё очень просто!

Достаточно лишь поставить вот эту галочку (смотрите скриншот) в настройках списков тренингов или уроков во вкладке "В приложении", и тогда вся красота перенесётся ещё и в Чатиум ;)

#лайфхак
Друзья, наконец-то это случилось! 🥳

Как я говорил раньше, я готовил для вас один свой интересный проект по обучению всему тому, что знаю я сам, и хочу представить его — Train IT❗️

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

Я со своей командой задумывал этот проект для тех людей, которые хотят понять, как правильно обращаться с CSS, строить правильную структуру документа на HTML и не бояться JS, а понимать, как он работает. Всё это есть в одном из направлений клуба "Веб с нуля".

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

🔴 Если вас интересует комплексное обучение HTML/CSS/JS, хотите применять эти навыки вне зависимости от того, с какой платформой вы работаете, то направление "Веб с нуля" для вас!

🔴 Если вы хотите познать секреты Тильды, делать ошеломительные дизайны и применять секретные фишки и возможности, которые не может делать Тильда стандартными методами, то направление "Тильда" для вас!

Конечно же в клубе есть предложение с доступом ко всей базе на два периода (на месяц и на три месяца), если вас интересует и то, и другое ;)

❗️Ссылка на проект — https://train-it.ru ❗️

Мы с командой нацелены расти как вглубь, так и вширь, и соответственно расширять в будущем направления клуба! В наших грандиозных планах открыть такие направления как C#, Figma, Excel, Таргетинг и многое многое другое!

Так же я задумал для вас интересный конкурс, об этом будет в следующем посте через несколько минут 😉
Каморка Геткурсовода 💻 | Канал Максима Елисеева
Мне очень близка и интересна идея 3D-лендингов и сайтов. Я всецело разделяю креатив от @DmitrySpace по созданию таковых. Благодаря CSS-правилам, совместно с JS можно творить невообразимые вещи :) В данном случае мне безумно нравится, как вышел этот креативный…
Помните этот крутой блок? Я подарю его вам! 😉

Этот конкурс приурочен к открытию моего клуба Train IT.

Я подарю этот крутейший блок с 3д иконками соц-сетей для Геткурса 10 счастливчикам, которые выполнят условия конкурса, а именно:

❗️Самое простое: быть подписанным на мой канал "Каморка Геткурсовода" (https://t.me/closetgc) 😁

❗️Быть подписанным на мой канал проекта Train IT, где мои коллеги будут постить для вас познавательный контент мира IT и новости проекта, откуда вы почерпнёте для себя новые знания (https://t.me/train_it_official)

❗️Подтвердить своё участие в конкурсе, заполнив эту анкету — https://forms.gle/3d7TCCEEPwM7Cwx29.


Победителей я определю в Воскресенье 8 августа в 20:00 с помощью Рандомайзера.

Прокачивайте свой скилл вместе со мной, и удачи в конкурсе 😉