Свои красивые границы блоков 🥳
С каждым разом обычные границы блоков перестают удивлять заказчиков своим видом, и всегда хочется большего. Ровно так же и для собственных дизайнов. Освежить дизайн вам точно поможет генератор границ блоков на SVG — Get Waves
Пользоваться им достаточно просто:
1) Выбираете настройки
2) Генерируете волнообразные/прямоугольные границы блоков кубиком справа
3) Получаете SVG разметку нажав на облачко со стрелкой 😉
В самом Геткурсе вставляете в отдельный HTML-блок там, где вы хотите видеть эту границу. Удаляете внутри HTML всё, что вам предлагает Геткурс, и просто вставляете скопированный SVG внутрь. Вы так же можете задать нужный вам цвет под цвет вашего проекта найдя внутри тега
С таким маленьким и очень полезным инструментом можно делать абсолютно разнообразные и не скучные границы блоков 😎
#лайфхак
С каждым разом обычные границы блоков перестают удивлять заказчиков своим видом, и всегда хочется большего. Ровно так же и для собственных дизайнов. Освежить дизайн вам точно поможет генератор границ блоков на SVG — Get Waves
Пользоваться им достаточно просто:
1) Выбираете настройки
2) Генерируете волнообразные/прямоугольные границы блоков кубиком справа
3) Получаете SVG разметку нажав на облачко со стрелкой 😉
В самом Геткурсе вставляете в отдельный HTML-блок там, где вы хотите видеть эту границу. Удаляете внутри HTML всё, что вам предлагает Геткурс, и просто вставляете скопированный SVG внутрь. Вы так же можете задать нужный вам цвет под цвет вашего проекта найдя внутри тега
<path> атрибут fill и задав свой цвет каким-нибудь хеш-номером 😊С таким маленьким и очень полезным инструментом можно делать абсолютно разнообразные и не скучные границы блоков 😎
#лайфхак
Механики всплывающих блоков ✔️
Большинство из нас пользуются всплывающими блоками методами Геткурса, где можно настроить "Показ всплывающего блока", и соответственно вставить в окошко номер этого всплывающего блока, который обычно имеет номер формата
Но не многие знают, что за это отвечает один из уже встроенных в Геткурс функций
Например, мы можем использовать эту функцию в тексте в любом месте, обернув её в тег ссылки
#лайфхак #полезная_фишка
Большинство из нас пользуются всплывающими блоками методами Геткурса, где можно настроить "Показ всплывающего блока", и соответственно вставить в окошко номер этого всплывающего блока, который обычно имеет номер формата
b-27f1 (для примера).Но не многие знают, что за это отвечает один из уже встроенных в Геткурс функций
ltShowModalBlock(). И с помощью этой функции мы сами можем манипулировать тем, из какого места нам нужно открыть тот, или иной всплывающий блок 😉Например, мы можем использовать эту функцию в тексте в любом месте, обернув её в тег ссылки
<a></a> и использовав атрибут onclick чтобы вызвать данную функцию. Внутри скобок пишется номер блока в кавычках, который мы хотим вызвать. Пример использования в любом месте в тексте:<a onclick="ltShowModalBlock('b-27f1')">Запишись здесь!</a>
А чтобы применить в вашем собственном JS-коде, вы можете просто поставить вызов функции ltShowModalBlock('b-27f1') с номером вашего блока 👍#лайфхак #полезная_фишка
Отправляем форму без формы! 😁
Все уже давно привыкли пользоваться формами в Геткурсе. Они являются неотъемлемой частью идентификации пользователя при создании заказа или регистрации. Но мало кто знает, что можно отправить форму не из самой формы 😋
И отсюда рождается много крутых механик, которые можно реализовать по нашим собственным правилам. Например, пользователь кликает на ссылку "Заказать в один клик!" и его сразу же перекидывает на страницу оплаты заказа без заполнения формы.
❗️Учтите: такой подход можно применять к тем, кто уже зарегистрирован в вашем проекте. В противном случае форма, конечно же, не отправится.
В моём примере (скриншот №1) мы создаем простой текст, который оборачиваем ссылкой, и в ссылке в атрибуте
Вуаля! Теперь если мы кликнем по нашей ссылке, нас автоматически перебросит в наш сформированный заказ. И таким образом можно придумать разнообразнейшие механики для ваших проектов, просто применив чуть больше фантазии.
P.S.: Если у вас будет 2 и более подобных ссылок, соответственно, вам нужно сделать столько же скрытых форм с предложениями и с разными классами.
P.P.S. Опять же, развивая фантазию, можно применить в собственных механиках на JS, т.к. заказ скриптами создать довольно проблематично 😜
#лайфхак #полезная_фишка
Все уже давно привыкли пользоваться формами в Геткурсе. Они являются неотъемлемой частью идентификации пользователя при создании заказа или регистрации. Но мало кто знает, что можно отправить форму не из самой формы 😋
И отсюда рождается много крутых механик, которые можно реализовать по нашим собственным правилам. Например, пользователь кликает на ссылку "Заказать в один клик!" и его сразу же перекидывает на страницу оплаты заказа без заполнения формы.
❗️Учтите: такой подход можно применять к тем, кто уже зарегистрирован в вашем проекте. В противном случае форма, конечно же, не отправится.
В моём примере (скриншот №1) мы создаем простой текст, который оборачиваем ссылкой, и в ссылке в атрибуте
onclick пишем такой код:$('.reg-form form').submit();
Целиковая конструкция выглядит так:<a onclick="$('.reg-form form').submit();">Заказать в один клик!</a>
Далее, нам нужно поставить класс reg-form нашей форме, а так же скрыть её со страницы, как показано на скриншоте №2. Не забудьте также поставить туда предложение, которое будет "Выделено по умолчанию" в нашей форме, именно оно и будет передаваться в сформированный заказ.Вуаля! Теперь если мы кликнем по нашей ссылке, нас автоматически перебросит в наш сформированный заказ. И таким образом можно придумать разнообразнейшие механики для ваших проектов, просто применив чуть больше фантазии.
P.S.: Если у вас будет 2 и более подобных ссылок, соответственно, вам нужно сделать столько же скрытых форм с предложениями и с разными классами.
P.P.S. Опять же, развивая фантазию, можно применить в собственных механиках на JS, т.к. заказ скриптами создать довольно проблематично 😜
#лайфхак #полезная_фишка
Всем привет друзья, и отличного пятничного дня!
Головной боли пост 😄
Я тут размышлял, что любой технический специалист/верстальщик и даже уже достаточно матёрый фронтендер всегда сталкивается с какими либо проблемами при вёрстке, и проблемы у всех могут быть совершенно разные. Мне интересно узнать, что именно за проблемы у вас возникают, когда вы приступаете верстать очередной макет, или отдельный блок. Может быть, из раза в раз, вы сталкиваетесь с ситуацией, когда в очередной раз говорите себе «Опять двадцать пять» ))
Поделитесь своей болью в комментариях 😉
#размышления_пост
Головной боли пост 😄
Я тут размышлял, что любой технический специалист/верстальщик и даже уже достаточно матёрый фронтендер всегда сталкивается с какими либо проблемами при вёрстке, и проблемы у всех могут быть совершенно разные. Мне интересно узнать, что именно за проблемы у вас возникают, когда вы приступаете верстать очередной макет, или отдельный блок. Может быть, из раза в раз, вы сталкиваетесь с ситуацией, когда в очередной раз говорите себе «Опять двадцать пять» ))
Поделитесь своей болью в комментариях 😉
#размышления_пост
UPD log: Занимаюсь дизайном значков ранговой системы для испытаний.
Тренажер кода уже готов. В данный момент занимаюсь дизайном ранговой системы в своём клубе. На скриншотах некоторые наработки для двух первых рангов в испытаниях по JavaScript 😊
Существенное отличие от подобных обучающих систем, которыми могут похвастаться нынешние IT-гиганты, в том, что мои испытания сильно приближены к реальным проблемам и рабочим задачам.
Не особо вижу смысл в том, чтобы двигать какие-то цветные кубики, или "скопируйте и вставьте, и посмотрите как это красиво". И такая вакханалия у большинства нынешних обучающих проектов. Это даже не назвать обучением, хотя они думают по-другому. Что же, пускай и дальше двигают кубики, пока мы будем решать реальные задачи 😁
#TrainIT
Тренажер кода уже готов. В данный момент занимаюсь дизайном ранговой системы в своём клубе. На скриншотах некоторые наработки для двух первых рангов в испытаниях по JavaScript 😊
Существенное отличие от подобных обучающих систем, которыми могут похвастаться нынешние IT-гиганты, в том, что мои испытания сильно приближены к реальным проблемам и рабочим задачам.
Не особо вижу смысл в том, чтобы двигать какие-то цветные кубики, или "скопируйте и вставьте, и посмотрите как это красиво". И такая вакханалия у большинства нынешних обучающих проектов. Это даже не назвать обучением, хотя они думают по-другому. Что же, пускай и дальше двигают кубики, пока мы будем решать реальные задачи 😁
#TrainIT
Друзья, буду с вами откровенен
Хотел выпустить тренажер кода вместе с испытаниями к новогодней распродаже, которая, к слову, стартует 26 декабря (о чём ещё дополнительно напишу 26 числа), но физически и умственно не успеваю справиться с некоторыми багами, которые я нашел. Мозг хочет отдыхать, чует праздники, видимо 😁 Поэтому доделывание испытаний и выпуск тренажера планируется в середине января.
Распродажи в моём клубе Train IT довольно редкое событие, последняя из общедоступных распродаж была аж в мае этого года. И распродажа приурочена так же к поднятию цен на клуб с января 2023 года. На распродаже будут продаваться все стримы, которые были за всё время в клубе, и абонементы в клуб на 3 и 6 месяцев по старым ценам, ещё и с большими скидками.
Материала становится всё больше (уроки, тренажер, испытания, стримы) и ценность знаний, которые можно тренировать ещё и на практике за счёт испытаний, резко возрастает. Количество уроков в клубе перевалило уже за 150, и в каждом из этих уроков я рассказываю про HTML/CSS/JS простыми словами с нуля.
Эти знания можно использовать абсолютно везде и не быть привязанным к конкретной платформе, а в новом году я планирую запустить уроки по современным препроцессорам (Pug, LESS, SCSS) и по некоторым JS фреймворкам (jQuery, VUE, React), которые привносят кучу разнообразных гибких механик, чего не может сделать обычный CSS, и реактивность (изменения в реальном времени без перезагрузки страницы), которую достаточно сложно и проблематично сделать на чистом JS.
Так что ждём понедельника 🎄
Всем отличного дня и суперских выходных 😉
Хотел выпустить тренажер кода вместе с испытаниями к новогодней распродаже, которая, к слову, стартует 26 декабря (о чём ещё дополнительно напишу 26 числа), но физически и умственно не успеваю справиться с некоторыми багами, которые я нашел. Мозг хочет отдыхать, чует праздники, видимо 😁 Поэтому доделывание испытаний и выпуск тренажера планируется в середине января.
Распродажи в моём клубе Train IT довольно редкое событие, последняя из общедоступных распродаж была аж в мае этого года. И распродажа приурочена так же к поднятию цен на клуб с января 2023 года. На распродаже будут продаваться все стримы, которые были за всё время в клубе, и абонементы в клуб на 3 и 6 месяцев по старым ценам, ещё и с большими скидками.
Материала становится всё больше (уроки, тренажер, испытания, стримы) и ценность знаний, которые можно тренировать ещё и на практике за счёт испытаний, резко возрастает. Количество уроков в клубе перевалило уже за 150, и в каждом из этих уроков я рассказываю про HTML/CSS/JS простыми словами с нуля.
Эти знания можно использовать абсолютно везде и не быть привязанным к конкретной платформе, а в новом году я планирую запустить уроки по современным препроцессорам (Pug, LESS, SCSS) и по некоторым JS фреймворкам (jQuery, VUE, React), которые привносят кучу разнообразных гибких механик, чего не может сделать обычный CSS, и реактивность (изменения в реальном времени без перезагрузки страницы), которую достаточно сложно и проблематично сделать на чистом JS.
Так что ждём понедельника 🎄
Всем отличного дня и суперских выходных 😉
Друзья, скоро Новый Год 🎄
А в Train IT началась Новогодняя распродажа!
➡️ Распродажа продлится с 26 декабря по 30 декабря 23:59.
Вас уже ждут:
1️⃣ Абонементы в клуб Train IT на 3 и 6 месяцев.
2️⃣ Стримы, которые проходили в рамках клуба, теперь можно купить!
3️⃣ Специальные условия для партнёров клуба, которые позволяют приобретать все предложения из распродажи ещё дешевле до 30%!
▶️ https://train-it.ru/newyearsale ◀️
Успевайте забрать абонементы по скидкам и стримы на распродаже по старым ценам! После распродажи цены на абонементы в клуб поднимутся (начиная с января 2023 г).
В клубе я простыми словами объясняю HTML/CSS/JS. Если вы всегда мечтали не просто конструировать сайты из статичных блоков, а писать их самим, или же переделывать их так, как вам хочется, то лучшего повода чем сейчас вам не найти 😏
Так же, уже во второй половине января 2023 года, в свет выйдет практический тренажер с испытаниями, где вы можете применять изученный материал на практике и зарабатывать ранги 🔥
Ранговая система тоже будет влиять на некоторые факторы в клубе, но это уже совсем другая история 😉
▶️ https://train-it.ru/newyearsale ◀️
А в Train IT началась Новогодняя распродажа!
Вас уже ждут:
Успевайте забрать абонементы по скидкам и стримы на распродаже по старым ценам! После распродажи цены на абонементы в клуб поднимутся (начиная с января 2023 г).
В клубе я простыми словами объясняю HTML/CSS/JS. Если вы всегда мечтали не просто конструировать сайты из статичных блоков, а писать их самим, или же переделывать их так, как вам хочется, то лучшего повода чем сейчас вам не найти 😏
Так же, уже во второй половине января 2023 года, в свет выйдет практический тренажер с испытаниями, где вы можете применять изученный материал на практике и зарабатывать ранги 🔥
Ранговая система тоже будет влиять на некоторые факторы в клубе, но это уже совсем другая история 😉
Please open Telegram to view this post
VIEW IN TELEGRAM
Давайте я вам расскажу про свой путь становления разработчиком 😊
Когда-то в 2014 году я захотел сменить свой род деятельности и войти в суровый мир IT. Во-первых, это прибыльно. Во-вторых, здесь спокойно реализовывается творческий потенциал. Это меня и привлекло. Но, к сожалению, всё оказалось не так радужно, когда я начал изучать материалы по вёрстке. Я собирал эти знания и материалы из разных мест, у меня многое не получалось, либо я этого не понимал, и часто ловил себя на мысли: "Блин, у меня ничего не получается, может, это не моё...?"
Закрепление знаний мне давалось очень непросто. Выучив одно, я практически сразу же забывал другое 😁 И думал, что "Вот было бы здорово, если бы был такой человек, который бы объяснил и показал, как нужно делать правильно и в чём ошибки". Но такого человека, к сожалению, рядом со мной не было и мне пришлось прокладывать себе путь самому сквозь эти "дебри".
В свои уроки в клубе Train IT я вложил душу и ставил себя на место себя же, кем я был раньше — ничего не знающим парнем. И объясняю материал так, как хотел бы, чтобы объяснили мне тогда. Вам повезло больше, теперь я сам стал таким человеком 😉
Начните свой путь становления из специалиста в разработчика, тем более есть прекрасный шанс ухватить с большими скидками абонементы на Новогодней распродаже⬇️
🎄▶️ https://train-it.ru/newyearsale ◀️ 🎄
Зная вёрстку и скрипты, вы не только будете получать удовольствие от того, что написанный код работает, как надо! Ваши знания ещё и высоко оценят в валютном формате✅
Когда-то в 2014 году я захотел сменить свой род деятельности и войти в суровый мир IT. Во-первых, это прибыльно. Во-вторых, здесь спокойно реализовывается творческий потенциал. Это меня и привлекло. Но, к сожалению, всё оказалось не так радужно, когда я начал изучать материалы по вёрстке. Я собирал эти знания и материалы из разных мест, у меня многое не получалось, либо я этого не понимал, и часто ловил себя на мысли: "Блин, у меня ничего не получается, может, это не моё...?"
Закрепление знаний мне давалось очень непросто. Выучив одно, я практически сразу же забывал другое 😁 И думал, что "Вот было бы здорово, если бы был такой человек, который бы объяснил и показал, как нужно делать правильно и в чём ошибки". Но такого человека, к сожалению, рядом со мной не было и мне пришлось прокладывать себе путь самому сквозь эти "дебри".
В свои уроки в клубе Train IT я вложил душу и ставил себя на место себя же, кем я был раньше — ничего не знающим парнем. И объясняю материал так, как хотел бы, чтобы объяснили мне тогда. Вам повезло больше, теперь я сам стал таким человеком 😉
Начните свой путь становления из специалиста в разработчика, тем более есть прекрасный шанс ухватить с большими скидками абонементы на Новогодней распродаже
🎄
Зная вёрстку и скрипты, вы не только будете получать удовольствие от того, что написанный код работает, как надо! Ваши знания ещё и высоко оценят в валютном формате
Please open Telegram to view this post
VIEW IN TELEGRAM
⏰ Осталось всего полтора дня распродажи и больше таких цен не будет.
Как я уже говорил ранее, с января 2023 года в клубе Train IT произойдет повышение цен. Количество уроков постоянно растёт, появляются новые возможности для прокачки навыков, а именно тренажер, который выйдет уже во второй половине января со своими испытаниями и системой рангов. Ценность знаний повышается. Повышается и качество приобретаемых знаний из урока в урок. Рассказ сложного материала простым языком, чем не могут похвастаться крупнейшие гиганты IT обучения.
Вперёд к распродаже!
🎄▶️ https://train-it.ru/newyearsale ◀️ 🎄
Вы всё ещё успеваете запрыгнуть в новогодний поезд, который увезёт вас вХогвартс Train IT, где вы будете обучаться премудростям магии фронтенд-разработки и становиться супер-экспертом, который сможет сотворить красивый и функциональный проект не просто на какой-либо платформе, но и с нуля🔥
Как я уже говорил ранее, с января 2023 года в клубе Train IT произойдет повышение цен. Количество уроков постоянно растёт, появляются новые возможности для прокачки навыков, а именно тренажер, который выйдет уже во второй половине января со своими испытаниями и системой рангов. Ценность знаний повышается. Повышается и качество приобретаемых знаний из урока в урок. Рассказ сложного материала простым языком, чем не могут похвастаться крупнейшие гиганты IT обучения.
Вперёд к распродаже!
🎄
Вы всё ещё успеваете запрыгнуть в новогодний поезд, который увезёт вас в
Please open Telegram to view this post
VIEW IN TELEGRAM
Каморка Геткурсовода 💻 | Канал Максима Елисеева
Друзья, скоро Новый Год 🎄 А в Train IT началась Новогодняя распродажа! ➡️ Распродажа продлится с 26 декабря по 30 декабря 23:59. Вас уже ждут: 1️⃣ Абонементы в клуб Train IT на 3 и 6 месяцев. 2️⃣ Стримы, которые проходили в рамках клуба, теперь можно купить!…
❗️Осталось всего 6 часов до конца распродажи и это последнее напоминание❗️
🎄▶️ https://train-it.ru/newyearsale ◀️ 🎄
1 января в 0:00 старые цены останутся в старом году и на смену им придут новые. У вас ещё есть шанс успеть приобрести абонементы и стримы по очень выгодным ценам✅
Сделайте подарок, удивите заказчиков своей новой квалификацией и скилом, а себя гарантированным ростом доходов соответственно 😉
🎄
1 января в 0:00 старые цены останутся в старом году и на смену им придут новые. У вас ещё есть шанс успеть приобрести абонементы и стримы по очень выгодным ценам
Сделайте подарок, удивите заказчиков своей новой квалификацией и скилом, а себя гарантированным ростом доходов соответственно 😉
Please open Telegram to view this post
VIEW IN TELEGRAM
This media is not supported in your browser
VIEW IN TELEGRAM
This media is not supported in your browser
VIEW IN TELEGRAM
Праздники пролетели почти незаметно, время возвращаться к делам насущным, хоть и хочется ещё отдохнуть 🙃
Поделюсь с вами лёгкой кастомизацией, которую вы сможете без проблем повторить и приукрасить стандартную форму Геткурса. А именно добавлением значков полям форм 😉
P.S. Телега немного перепутала порядок скриншотов, но я думаю вы поймете 😁
UPD: Поправил в тексте нумерацию скриншотов
Для начала нам нужен сам блок формы (куда же без него), и сделать пару небольших манипуляций с каждым полем. Я буду делать это на стандартных трёх полях, но вы можете сделать по такой же аналогии и с другими полями. Заходим в настройку первого поля, кликнув по шестерёнке (скриншот №1) и в самом низу присваиваем полю класс
Ровно так же поступаем и с остальными полями, добавляя по смыслу классы полям. У меня три поля, соответственно я обозначил их как
Вы без труда сможете найти там свою иконку, если захотите поменять или добавить, и так же поставить Юникодом в правило content (где найти Юникод смотрите скриншот №3). Номер Юникода обязательно должен идти после
#лёгкая_кастомизация #полезная_фишка
P.S. Телега немного перепутала порядок скриншотов, но я думаю вы поймете 😁
UPD: Поправил в тексте нумерацию скриншотов
Для начала нам нужен сам блок формы (куда же без него), и сделать пару небольших манипуляций с каждым полем. Я буду делать это на стандартных трёх полях, но вы можете сделать по такой же аналогии и с другими полями. Заходим в настройку первого поля, кликнув по шестерёнке (скриншот №1) и в самом низу присваиваем полю класс
field-email, поскольку первое поле в форме просит нас заполнить email (скриншот №4) 😎Ровно так же поступаем и с остальными полями, добавляя по смыслу классы полям. У меня три поля, соответственно я обозначил их как
field-email, field-name, field-phone. После этого в Стилях блока данной формы в "Подробных настройках" вставляем следующий CSS:.field-content {
position: relative;
}
.field-content:after {
content: '';
font-family: fontAwesome;
position: absolute;
right: 20px;
top: 50%;
transform: translateY(-50%);
}
.field-email .field-content:after {
content: '\f0e0';
}
.field-name .field-content:after {
content: '\f007';
}
.field-phone .field-content:after {
content: '\f095';
}
В последних 3-х селекторах, где идут только правила content я вставлял иконки Юникодом с сайта fontawesome v.4.7, так как эта версия интегрирована в Геткурс 😉Вы без труда сможете найти там свою иконку, если захотите поменять или добавить, и так же поставить Юникодом в правило content (где найти Юникод смотрите скриншот №3). Номер Юникода обязательно должен идти после
\ обратного слэша, как это сделано у меня.#лёгкая_кастомизация #полезная_фишка