Заказчик: Я же дал вам понятное техническое задание!

Техническое задание:

P.S. С днём защитника Отечества! 😉

Пропала боковая панель! 😳

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

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

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

Второе, не менее важное, это обращение JavaScript к несуществующим элементам страниц. Представим ситуацию, что вы, как Администратор, видите все блоки на своей странице, и соответственно JS их видит тоже от вашего лица, и выполняет какую-то операцию с ними. Но у ученика данного блока на странице может не быть по множествам причин (сегмент, не админ, не в той группе и тд.). JS пытается обработать этот блок, и не находит его на странице, что тоже в свою очередь приводит к ошибке, и остановке обработки всех последующих скриптов.

Лайфхак по предотвращению данной ситуации следующий: лучше в таких случаях добавлять в JS условие по проверке НАЛИЧИЯ этого блока на странице, и только потом выполнять с ним определенный сценарий.

Третья причина проявляется реже всего, но тоже иногда на это влияет. Это синтаксические ошибки в CSS-кодах и HTML-тегах. Например не был закрыт тег <script></script>, или же стилевые правила не обёрнуты в теги <style></style> в блоке, где интерпретируется HTML. В CSS это всё те же не закрытые скобки, пропуски точек с запятыми, и прочие синтаксические моменты.

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

#полезный_материал

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

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

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

Берегите себя, пожалуйста. Об этом невозможно молчать. Я желаю чтобы все беды обошли вас стороной.

Нажать, или не нажать? 🧐

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

Кажется, что это очередной взрыв мозга с кучей кода 😵‍💫

Но на самом деле всё не совсем так, и такую схему можно легко провернуть, обойдясь несколькими строчками кода, и задействовав немного логики показа блоков 😉

Разберём пример:
1) Для начала поставим стандартные блоки с карточками и кнопками (см. скриншот №1). Я присвою всему блоку класс my-cards в Стилях блока.
2) Для каждой карточки с кнопкой, соответственно, нам нужно поставить столько же JS-блоков, которые будут блочить нажатие кнопки каждый для своей карточки (см. скриншот №2)
3) В каждом таком JS-блоке пишем код, который блочит кнопку в определённой карточке. В моём примере код в блоках выглядит так:

В первом JS-блоке:

$(function() {
    $('.my-cards .lt-tsr-block:nth-child(1) button').attr('disabled', true);
})

Во втором JS-блоке:

$(function() {
    $('.my-cards .lt-tsr-block:nth-child(2) button').attr('disabled', true);
})

В третьем JS-блоке:

$(function() {
    $('.my-cards .lt-tsr-block:nth-child(3) button').attr('disabled', true);
})

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

Вот и весь секрет лайфхака 😁

#лайфхак #полезная_фишка

Коллеги, друзья, всем привет 👋

Когда-то давно, мы посмотрели на стандартные страницы оплаты на ГК, и решили, что так больше продолжаться не может 😅

С этого момента я задал эру новых и красивых страниц оплаты, с которых потом пошли куча модификаций до самых невероятных по своей механике!

А началось всё с моего простого мини-курса «Чекаут. Страницы оплаты», где я рассказывал и показывал как можно создавать красивую страницу, и не бояться старого редактора Геткурса.

🔥В Школе Магии Геткурса стартовала весенняя распродажа 🔥
👉 https://gcwithme.ru/springsale 👈

Вы сможете приобрести этот мини-курс и много чего интересного и полезного от моих коллег 😉

На основе таких мощных инструментов и базы под рукой, смешивая их с вашим полётом фантазии, можно создавать по истине удивительные вещи😎

Возьму-ка пожалуй NaN штук 😂

Всем хорошей рабочей недели 👋👍

Накинем эффектов 😎

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

А что, если чуть-чуть разнообразить простую смену стилей? Например, добавить даже анимацию?

Это вполне легко сделать с помощью свойства animation. В качестве примера я сделал тряску кнопки при наведении на неё.

Самой кнопке я назначил класс btn-effect чтобы выделить её из всех прочих кнопок, для того, чтобы повесить анимацию. В стилях блока с кнопкой я написал следующее:

.btn-effect:hover {
animation: shake .3s ease;
}

При наведении на кнопку я не просто меняю стиль, а вызываю стороннюю анимацию shake, которую сам же и создал в отдельном CSS-блоке вверху страницы:

@keyframes shake {
0% {
transform: rotate(0deg);
}

25% {
transform: rotate(5deg);
}

50% {
transform: rotate(0deg);
}

75% {
transform: rotate(-5deg);
}

100% {
transform: rotate(0deg);
}
}

За счёт вызова анимации при наведении, можно делать потрясающие эффекты, и намного сложнее и красивее, чем простая смена стилей на элементе. Всё зависит лишь от вашей фантазии 😉

#полезная_фишка

Кризис коснулся каждого человека, и это трудно отрицать. Но именно в наших силах с этим что-то сделать.

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

Мой клуб Train IT направлен на развитие общих знаний в IT, которые пригодятся абсолютно на любой платформе (Геткурс, Тильда, Wordpress, Joomla, Drupal и тд.). Уроки по 10-15 минут на конкретную тематику усваиваются гораздо лучше, чем длиннющие курсы по 3-5 часов. Плюс, многие знают мою манеру объяснения простым и понятным языком 😉

Сейчас в клубе стартовала распродажа, повод которой — приблизить вас к миру IT, и закрепить ваши знания, которые вы сможете использовать не только на Геткурсе, но и на любой другой платформе.

Распродажа по этой ссылке:
🔥 https://train-it.ru/simplesale 🔥

Стоит ли говорить, что такой багаж знаний откроет вам доступ к новым возможностям заработка? 😉 Думаю, и так всё понятно. Я очень хочу, чтобы высококвалифицированных специалистов, которые пишут код и разрабатывают цифровые решения стало больше. За таким крутым сообществом не страшно за будущее 🥳


Распродажа по этой ссылке:
🔥 https://train-it.ru/simplesale 🔥

Распродажа продлится до 6 апреля 23:59!

Жду вас на своих уроках 👋

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

Напоминаю, что сегодня последний день распродажи в моем клубе Train IT.

Распродажа по этой ссылке:
👉 https://train-it.ru/simplesale 👈

Сегодня ровно в 0:00 все созданные заказы в рамках распродажи уже будет невозможно оплатить! Не упустите возможность изучать IT с выгодой 🔥

✔️ Всегда мечтали не просто конструировать сайты из статичных блоков, а писать их самим?
✔️ Добавлять крутые фишки, а, может, даже придумывать свои самостоятельно?
✔️ Понимать весь код, с которым вы работаете?
✔️Быть уверенным в своих знаниях и иметь под рукой мощную опору в виде уроков клуба?

Тогда чего же вы ждёте? 😏

СЕО в вебе. Как много смысла в этих буквах 👈

Почему-то многие считают, что Геткурс в плане СЕО не гибкая платформа, и ищут альтернативы. У меня к таким людям всегда есть вопрос: а действительно ли вы знаете что такое СЕО именно в вебе? 😁

Начнём с того, что SEO (англ. Search Engine Optimization) – это комплекс мер по улучшению сайта для его ранжирования в поисковых системах. НЕ АНАЛИТИКА! Аналитика лишь позволяет выявить те самые необходимые меры, которые нужно сделать для оптимизации поисковой выдачи роботами.

Управлять этой оптимизацией довольно просто, гибко, и всегда на ваше усмотрение. По-мимо того, что Геткурс предлагает заполнить OG информацию о странице, есть ещё и раздел "Теги в разделе HEAD", где с помощью тегов <meta> можно настроить поисковую оптимизацию гибче некуда 🥳

К примеру, в моём случае (см. скриншот), у меня стоит вспомогательный мета-тег, который отвечает за ключевые слова, чтобы мою страницу быстрее нашли роботы поисковых систем. Таким образом я повышаю свои шансы найти свой проект и страницу в поисковике.

И таких <meta> тегов со специальными значениями достаточно много, и настроить СЕО можно очень гибко и быстро, помимо основного функционала Геткурса 😉

#лайфхак