❗️ Текстовые элементы редактора — это инструмент безграничного полёта фантазии❗️
Каждый из вас конечно пользовался текстовыми блоками, но знаете ли вы их главный секрет? Они могут использоваться так же, как и обычный блок с HTML, а следовательно, вы можете добавлять свои собственные элементы в блок и позиционировать их так, как вам нужно.
В своих уроках я давно пользуюсь этим приёмом и он отлично работает, когда в блоке нету нужных мне элементов, а красивый дизайн всё же хочется сделать :)
Такой подход помогает делать абстрактные элементы, сверстать нужные украшения для блока и даже сконструировать свои фоны из фигур (как это сделано на моих скриншотах), или же сделать свой кастомный блок. Конечно для этого придётся применить свои знания в CSS 😉
Вот такими возможностями нас радуют, казалось бы, обычные текстовые блоки. Кстати, такие возможности применимы почти во всех текстовых блоках на Геткурсе.
*Кастомный — отличающийся от стандартного набора, не типовой.
#полезная_фишка
Каждый из вас конечно пользовался текстовыми блоками, но знаете ли вы их главный секрет? Они могут использоваться так же, как и обычный блок с HTML, а следовательно, вы можете добавлять свои собственные элементы в блок и позиционировать их так, как вам нужно.
В своих уроках я давно пользуюсь этим приёмом и он отлично работает, когда в блоке нету нужных мне элементов, а красивый дизайн всё же хочется сделать :)
Такой подход помогает делать абстрактные элементы, сверстать нужные украшения для блока и даже сконструировать свои фоны из фигур (как это сделано на моих скриншотах), или же сделать свой кастомный блок. Конечно для этого придётся применить свои знания в CSS 😉
Вот такими возможностями нас радуют, казалось бы, обычные текстовые блоки. Кстати, такие возможности применимы почти во всех текстовых блоках на Геткурсе.
*Кастомный — отличающийся от стандартного набора, не типовой.
#полезная_фишка
Включи их все! 😱
Я получал довольно много вопросов про то, как застилизовать методы оплаты на странице "Оплата заказа", ведь их сначала надо подключить по ключам интеграций.
Вовсе нет!
Лайфхак заключается в том, что вы совершенно спокойно можете включить хоть все методы оплаты разом :) Главное чтобы в полях ключей было написано хоть что-то. Желательно английские буквы и цифры без спецсимволов.
Таким образом, Геткурс будет считать этот метод оплаты действующим и выведет его на странице "Оплата заказа", где вы спокойно можете делать с ним чудесные преображения.
#лайфхак
Я получал довольно много вопросов про то, как застилизовать методы оплаты на странице "Оплата заказа", ведь их сначала надо подключить по ключам интеграций.
Вовсе нет!
Лайфхак заключается в том, что вы совершенно спокойно можете включить хоть все методы оплаты разом :) Главное чтобы в полях ключей было написано хоть что-то. Желательно английские буквы и цифры без спецсимволов.
Таким образом, Геткурс будет считать этот метод оплаты действующим и выведет его на странице "Оплата заказа", где вы спокойно можете делать с ним чудесные преображения.
#лайфхак
Собираю отзывы 😁
Друзья, вот и подходят к концу мои два дня ведения Недели Магии 5. Дальше Дима вам покажет ещё больше магии кода и вы доделаете этот чудесный макет.
В связи с этим я собираю отзывы о том, насколько были креативны для вас эти два дня проведённых со мной. Понравилась ли вам геймификация процесса обучения? Было ли вам сложно, исходя из вашего опыта, выполнять такие домашние задания от меня? Как вам подача материала и объяснения в уроке?
Всё, что я делал, я делал с душой для вас. И хотел бы понять, насколько это для вас имело место быть 😉
Друзья, вот и подходят к концу мои два дня ведения Недели Магии 5. Дальше Дима вам покажет ещё больше магии кода и вы доделаете этот чудесный макет.
В связи с этим я собираю отзывы о том, насколько были креативны для вас эти два дня проведённых со мной. Понравилась ли вам геймификация процесса обучения? Было ли вам сложно, исходя из вашего опыта, выполнять такие домашние задания от меня? Как вам подача материала и объяснения в уроке?
Всё, что я делал, я делал с душой для вас. И хотел бы понять, насколько это для вас имело место быть 😉
Отсутствие класса — тоже стиль 😉
Думаю, многие сталкивались с такой проблемой, когда вам нужно прописать CSS стили именно целиковому блоку, который мы вставляем в редакторе. Да, это можно спокойно сделать, добавив этому блоку свой класс и воздействовать на этот класс из отдельного CSS-блока, который ставится вверху страницы... Слишком много действий. Отсюда вопрос:
Оно вам надо?
Есть очень крутой и органичный способ воздействия на целый родительный блок из внутренних стилей. Для этого достаточно всего лишь поставить фигурные скобки
(пример на скриншоте)
#лайфхак
Думаю, многие сталкивались с такой проблемой, когда вам нужно прописать CSS стили именно целиковому блоку, который мы вставляем в редакторе. Да, это можно спокойно сделать, добавив этому блоку свой класс и воздействовать на этот класс из отдельного CSS-блока, который ставится вверху страницы... Слишком много действий. Отсюда вопрос:
Оно вам надо?
Есть очень крутой и органичный способ воздействия на целый родительный блок из внутренних стилей. Для этого достаточно всего лишь поставить фигурные скобки
{ } и написать в них ваши CSS-свойства :) (пример на скриншоте)
#лайфхак
Друзья, коллеги, хороших вам выходных 👍🥳
Кто как отдыхает? А может, работает?
И если вы работаете, то я вас прекрасно понимаю, потому что я тоже. Хочу продолжить тему своего знакомства с вами :)
Многие наверняка работают в нескольких направлениях или на несколько проектов, и это совершенно нормальная ситуация в современном мире. Помимо того, что я куратор в Клубе Магии Геткурса, я ещё и имею причастность к игровой индустрии. Я разрабатываю игровые механики, персонажей, их характер, сценарий, сюжет, нарратив. Помимо JavaScript так же знаю Ruby on rails, и разрабатываю свою собственную игру, которая уже поучаствовала в паре игровых выставках мирового уровня :)
(спойлер: награды, конечно, было трудно завоевать, но зато я познакомился с очень интересными людьми)
Сейчас это является моим хобби, так как не приносит мне дохода, а лишь некоторые траты. Но это естественно :) На этой почве мне интересно геймифицировать процессы протекающие на Геткурсе, и я об этом глубоко задумываюсь.
Делитесь тем, как отдыхаете)
Кто как отдыхает? А может, работает?
И если вы работаете, то я вас прекрасно понимаю, потому что я тоже. Хочу продолжить тему своего знакомства с вами :)
Многие наверняка работают в нескольких направлениях или на несколько проектов, и это совершенно нормальная ситуация в современном мире. Помимо того, что я куратор в Клубе Магии Геткурса, я ещё и имею причастность к игровой индустрии. Я разрабатываю игровые механики, персонажей, их характер, сценарий, сюжет, нарратив. Помимо JavaScript так же знаю Ruby on rails, и разрабатываю свою собственную игру, которая уже поучаствовала в паре игровых выставках мирового уровня :)
(спойлер: награды, конечно, было трудно завоевать, но зато я познакомился с очень интересными людьми)
Сейчас это является моим хобби, так как не приносит мне дохода, а лишь некоторые траты. Но это естественно :) На этой почве мне интересно геймифицировать процессы протекающие на Геткурсе, и я об этом глубоко задумываюсь.
Делитесь тем, как отдыхаете)
This media is not supported in your browser
VIEW IN TELEGRAM
Мне очень близка и интересна идея 3D-лендингов и сайтов. Я всецело разделяю креатив от @DmitrySpace по созданию таковых.
Благодаря CSS-правилам, совместно с JS можно творить невообразимые вещи :) В данном случае мне безумно нравится, как вышел этот креативный блок с соц-сетями, который можно поставить, к примеру, внизу лендинга, и ваши соцсети уж точно не потеряются в потоке информации страницы.
К тому же вызывает большое желание кликнуть по ним 😉
#наработки
Благодаря CSS-правилам, совместно с JS можно творить невообразимые вещи :) В данном случае мне безумно нравится, как вышел этот креативный блок с соц-сетями, который можно поставить, к примеру, внизу лендинга, и ваши соцсети уж точно не потеряются в потоке информации страницы.
К тому же вызывает большое желание кликнуть по ним 😉
#наработки
Часто ли вы используете подпись к картинкам? 🧐
А что, если я скажу вам, что подпись воспринимает ещё и манипулирования над собой? Круто, правда?
Она имеет класс:
#полезная_фишка
А что, если я скажу вам, что подпись воспринимает ещё и манипулирования над собой? Круто, правда?
Она имеет класс:
lt-image-caption
Благодаря такой полезной функции, опять же, можно делать поистине классные вещи с блоком, содержащим картинку, без использования псевдоэлементов :before и :after ;)#полезная_фишка
Люблю издеваться над блоком с карточками 😅
Речь пойдет о наболевшей проблеме правильной стилизации отступов между ними при наличии бекграунда. Ведь чтобы настроить верные отступы и расстояния, да ещё так, чтобы не поломалась адаптация, нужно помудрить с flex-правилами.
Если просто закрасить наши карточки, которые имеют класс
Я давно пользуюсь одним трюком и всё делаю на уровне класса
#лайфхак
Речь пойдет о наболевшей проблеме правильной стилизации отступов между ними при наличии бекграунда. Ведь чтобы настроить верные отступы и расстояния, да ещё так, чтобы не поломалась адаптация, нужно помудрить с flex-правилами.
Если просто закрасить наши карточки, которые имеют класс
lt-tsr-block, то мы увидим, что расстояний на самом деле между ними нет. Как быть?Я давно пользуюсь одним трюком и всё делаю на уровне класса
lt-tsr-content. Настроив небольшие паддинги в самом классе и применив к нему бекграунд, мы без лишних действий получим вполне нормальные отступы между элементами :)#лайфхак
❗️ У Apple своё видение вёрстки ❗️
Адаптация страниц никогда не бывает лёгкой. И многие уже в этом убедились :) Но есть более глобальная проблема адаптации — это устройства Apple, которые зачастую кривят своим видом страницы на горизонтальных и вертикальных видах. Появляются какие-то полосы между блоками, а адаптированный блок, который нормально смотрится на остальных устройствах и при сжатии браузера, вдруг начинает странно себя вести на iPad...
Как это исправить так, чтобы ваша драгоценная адаптация не слетела на остальных клиентах?
Ответ: прописать стили только для устройств Apple!
И такое возможно благодаря некоторым директивам в @media правилах. Если мы пропишем
Таким образом, можно локализовать проблему в стилях на определенных разрешениях. Представим, что наша проблема со стилями наблюдается только на iPad'ах в горизонтальном и вертикальном виде. Можно локализовать обращение таким образом:
#полезная_фишка
Адаптация страниц никогда не бывает лёгкой. И многие уже в этом убедились :) Но есть более глобальная проблема адаптации — это устройства Apple, которые зачастую кривят своим видом страницы на горизонтальных и вертикальных видах. Появляются какие-то полосы между блоками, а адаптированный блок, который нормально смотрится на остальных устройствах и при сжатии браузера, вдруг начинает странно себя вести на iPad...
Как это исправить так, чтобы ваша драгоценная адаптация не слетела на остальных клиентах?
Ответ: прописать стили только для устройств Apple!
И такое возможно благодаря некоторым директивам в @media правилах. Если мы пропишем
@media only screen and (max-device-width: 1024px), то такое правило будет означать, что оно применимо "только к устройствам Apple" на разрешении устройства ниже 1024 пикселя. С помощью такой фишки можно не бояться за адаптацию на всех остальных устройствах.Таким образом, можно локализовать проблему в стилях на определенных разрешениях. Представим, что наша проблема со стилями наблюдается только на iPad'ах в горизонтальном и вертикальном виде. Можно локализовать обращение таким образом:
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px) {
класс {
ваши стили...
}
}
Если не поставить директиву only перед screen, то все стили, которые вы примените внутри этого медиаправила, будут распространяться на все устройства и браузеры, включая Apple. В свою очередь, сама директива screen как раз означает, что эти правила будут действовать для устройств Apple.#полезная_фишка
Всплыл? Или нет? 😳
Все знают как работают всплывающие блоки в Геткурсе. Кто не знает, прошу сюда.
Ну а для тех, кто в курсе, продолжим :) Это очень крутая возможность, чтобы не перегружать лендинг, да и любую страницу сайта излишней информацией, которую можно поместить во всплывающий блок. Но иногда нам требуются нетривиальные решения, среди которых данная инструкция от Геткурса перестаёт работать.
Что если заказчик хочет, чтобы при клике на какую-либо ссылку в тексте появился всплывающий блок? Или же у вас есть блок с тарифами, и вам надо выводить разные формы по клику на кнопку в тарифах?
Есть решение!
Маленький и полезный JS-код, который поможет вам вызвать нужный всплывающий блок:
Все знают как работают всплывающие блоки в Геткурсе. Кто не знает, прошу сюда.
Ну а для тех, кто в курсе, продолжим :) Это очень крутая возможность, чтобы не перегружать лендинг, да и любую страницу сайта излишней информацией, которую можно поместить во всплывающий блок. Но иногда нам требуются нетривиальные решения, среди которых данная инструкция от Геткурса перестаёт работать.
Что если заказчик хочет, чтобы при клике на какую-либо ссылку в тексте появился всплывающий блок? Или же у вас есть блок с тарифами, и вам надо выводить разные формы по клику на кнопку в тарифах?
Есть решение!
Маленький и полезный JS-код, который поможет вам вызвать нужный всплывающий блок:
ltShowModalBlock('номер_блока');
Этот кусочек кода можно вставлять в "Вызов JavaScript", если блок предусматривает такую возможность. А для вставки в собственную ссылку в тексте, следует прописывать в таком виде:<a onclick="ltShowModalBlock('номер_блока');">Ссылка</a>Друзья, коллеги, всем хороших выходных! 😉
Канал потихоньку растёт, и вместе с ним появляются вопросы мне в личку о том, "Как я всему этому научился", "Как понимать коды", "Как самому научиться их писать".
Как я уже говорил в первых постах, я готовлю один интересный обучающий проект. Не простое банальное пересказывание материала, а именно по моей собственной методике и разработанной концепции ;)
Сейчас я доделываю основные моменты в своём проекте и в ближайшее время вы узнаете о том, что я готовил для вас всё это время 😊
Канал потихоньку растёт, и вместе с ним появляются вопросы мне в личку о том, "Как я всему этому научился", "Как понимать коды", "Как самому научиться их писать".
Как я уже говорил в первых постах, я готовлю один интересный обучающий проект. Не простое банальное пересказывание материала, а именно по моей собственной методике и разработанной концепции ;)
Сейчас я доделываю основные моменты в своём проекте и в ближайшее время вы узнаете о том, что я готовил для вас всё это время 😊
День начинается с опросов 😉
Друзья, ни для кого не секрет, что многие заказчики совмещают Тильду с Геткурсом. Тильда имеет множество уже задизайненых блоков и настроенных под нужды современных лендингов, поэтому заказчики зачастую отдают своё предпочтение красивому дизайну на Тильде, не зная, что уже довольно многие умеют делать ровно то же самое на Геткурсе, и не распыляться на два сервиса.
❓Я бы хотел узнать, есть ли среди подписчиков моего канала такие люди, которые работают и с Геткурсом и с Тильдой.
(опрос создам ниже поста)
Друзья, ни для кого не секрет, что многие заказчики совмещают Тильду с Геткурсом. Тильда имеет множество уже задизайненых блоков и настроенных под нужды современных лендингов, поэтому заказчики зачастую отдают своё предпочтение красивому дизайну на Тильде, не зная, что уже довольно многие умеют делать ровно то же самое на Геткурсе, и не распыляться на два сервиса.
❓Я бы хотел узнать, есть ли среди подписчиков моего канала такие люди, которые работают и с Геткурсом и с Тильдой.
(опрос создам ниже поста)
Совмещаете ли вы Геткурс с Тильдой?
Anonymous Poll
72%
Да, совмещаю Тильду и Геткурс
26%
Нет, делаю всё только на Геткурсе
2%
Работаю только с Тильдой... Что такое Геткурс?
Табличный ад 😈
Многие рано или поздно прибегали к стандартному инструменту разработки таблиц от Геткурса. Но не многие знают, как делать сложные таблицы. Например, совмещать несколько ячеек в одну, или же несколько строк в одну ячейку.
И действительно, табличная вёрстка вызывает дичайшую боль даже у бывалых верстальщиков и front-end разработчиков :)
Я поделюсь неочевидными атрибутами для табличных ячеек, с помощью которых можно совмещать ячейки в ряду или же в несколько строк.
(Все примеры смотрите на скриншотах)
#полезная_фишка
Многие рано или поздно прибегали к стандартному инструменту разработки таблиц от Геткурса. Но не многие знают, как делать сложные таблицы. Например, совмещать несколько ячеек в одну, или же несколько строк в одну ячейку.
И действительно, табличная вёрстка вызывает дичайшую боль даже у бывалых верстальщиков и front-end разработчиков :)
Я поделюсь неочевидными атрибутами для табличных ячеек, с помощью которых можно совмещать ячейки в ряду или же в несколько строк.
(Все примеры смотрите на скриншотах)
colspan — проще говоря, этот атрибут "склеивает" ячейки в одном ряду. К примеру, если мы пропишем colspan="2", это будет означать, что эта ячейка добавит себе справа ещё одну такую же и будет занимать ширину в 2 ячейки.rowspan — аналогия colspan, только действует уже на нижнюю строку, добавляя себе вторую такую же, становясь с ней единым целым.#полезная_фишка