Знакомлю с текстовыми виджетами в обзоре конструктора креатиум (Creatium). Работайте с текстом по разному для этого много возможностей
здравствуйте друзья ним приветствую вас на очередном уроке по конструктору креативом сегодня мы разбираем стандартные блоки и виджеты и так от прошлого урока у нас остались остались у нас уже созданные секции созданной странице будем продолжать работу с ней добавим дополнительную пустую секцию для того чтобы в нее перетаскивать и разбирать отдельные блоки с виджетами и так первый блок это работа с текстом соответственно что мы здесь видим мы здесь видим простой полупрозрачные текст заголовки они в принципе это все один и тот же условно говоря текст который по разному настроен для быстрой работы хочу акцентировать на том что на одной странице может быть один заголовок h1 это правильно с точки зрения правильно оформления страниц вот она каждое последующее секции уже надо делать заголовок h2 то есть на первое мы можем делать h1 она всех последующих h2 для каких-то отдельных блоков можно использовать h3 такого формата либо h3 большими буквами ну h4 вообще для каких-то уже более точечных маленьких вещей так идем дальше оформление то есть оформление у нас здесь всякие цитаты бэйджики зачеркнутые тексты ну то есть вот этими двумя штуками я рекомендую пользоваться текст оформления вот списке допустим эти лучше не использовать почему лучше их не использовать потому что это атавизм от старой системы которые гораздо проще легче решается напрямую в тексте без вот отдельных списков и второй момент это то что список это отдельный но это отдельные блоки и каждый блок он за ним это ресурсы памяти и от этого страница дольше загружается потом в каком-то отдельном уроке я обязательно покажу фишку как смотреть нагрузку странице то есть по каждому блоку в процентном соотношении возможно смотреть и видеть каждый блок насколько нагружает страницу так дальше код с подсветкой syntax но это вообще редко используемая штука в принципе она вот прям очень мега специфичное и круга ее нужно использовать если вы хотите поделиться какими-то кодом для внедрения в другой сайт чтобы человек скопировал и вставил и у него заработал тот кот вот и все так markdown да это разметка текста это прям новая фишка 2021 года она нужна у нас соответственно для работы с текстами которые загружены из внешней базы данных там как из google таблица рты болтам и других систем и которые сейчас умеет взаимодействовать с креативом либо креатив уметь с ними взаимодействовать то есть как бы а этот это нужно для того чтобы красиво оформлять тексты на внешних данных ну чтож в общем обзоре все давайте разберем конкретно какой то блок например заголовок и его настройки ну понятно когда мы перетащили кликнув в это поле у нас открывается редактор вот здесь вверху говорит о том что этот тэг h1 дальше мы можем его выровнять право-лево центр ширина дальше мы говорим о том какой ему шрифт задать то есть если мы выбираем шрифт для текста или шрифт для заголовка это глобальная из мнение то есть если вы поменяете на всей страницы в настройках страниц шрифт для заголовков он поменяется везде если вы выберете какой-то отдельный заголовок отдельный шрифт вот здесь он уже автоматически не поменяется и надо будет заходить и ручками каждый раз в его менять поэтому я рекомендую просто определиться если это заголовок то оставлять по умолчанию шрифт для заголовков если текста по умолчанию шериф для текста а далее идет у нас размер ну 64 моем понимании это избыточная штука да нормальный большой заголовок уже не впишешь оптимально на мой взгляд 48 пиксел это прям хороший вариант для заголовка сюда много букв вылезает далее текст соответственно что мы можем настроить тексту цвет сейчас стоит автоматический он смотрит как iphone и автоматически подставляет цвет текста как называется ну короче так так же можно использовать глобальные цвета то есть у нас а глобальный цвет сайта это вообще настройка для всего сайта либо глобальный цвет для страниц то есть видите у нас сразу здесь открылась три наших предустановленных цвета и мы можем их выбирать а также здесь настраивается и прозрачность то есть вот если мы говорим о например тексте полупрозрачный текста это как раз вот просто эта настройка по прозрачности настроена и не более этого а также можно выбрать какой-то собственный специфичный текст цвет текста и в общем-то он будет зафиксирован именно для этого заголовка рекомендую оставлять автоматически либо использовать глобальные цвета сайта либо странице опять же по той же самой причине что когда вы используете использую эти глобальные цвет страниц это изменив настройки вы измените сразу все заголовки там но если вы например выбрали так сейчас мы продемонстрируем выбираем глобальный цвет страницы и выбираем третий цвет теперь заходим страницу и здесь мы например выберем его более selenium видите он меняется то есть как бы сам цвет можно глобально менять через настройки страницы это очень удобно когда вам нужно быстро везде изменить цвет если вы на втыкаете в каждом заголовки свой цвет вы будете долго и нудно его их потом менять я за автоматизацию zara быструю работу с контентом созданием контента так что ещё у нас здесь и есть еще есть у нас когда интервалы да когда у вас допустим строк текст в две строки да там а между первой строкой 2 есть определенные интервалы и этот интервал можно регулировать увеличивать уменьшать то есть делать как бы более читаемый формат также есть интервала разрядка текста это расстояние между буквами то есть мы можем прям увеличивать раздвигать иногда бывает шрифт такой что плохо читаемые да то есть но как бы вообще вроде шрифт красивый ноутбук вы настолько близко что вот всего-то но все слилось и невозможно прочитать тогда можно сделать разряда шкуры сдвинуть и это становится более читабельным колонки текст возможно разбить на колонки то есть мы можем составить две колонки вот строки разбежались в разные колонки это очень удобно когда вам нужно сделать некое подобие там лишь табличной верстки или что-то подобное сразу говорю что есть готовый блок виджет с таблицей его можно загрузить panamera ну обязательно вы исследуете библиотеку виджетов по номерам и найдете как это делается видео отступ и можно тоже регулировать 3 колоночки 45 видите как она все можно разбивать вот такая история с текстом что мы еще не рассказали о но соответственно у нас есть исходный код который также можно редактировать да мы можем в исходном коде отредактировать [музыка] так не незаменимость enter интересненько ну это видемо глюк какой-то и на данный момент стройка не работает но по-крайней мере исходный код она показывает корректно редактировать в прямую не дает так все в управлении и строки я рассказал теперь мы можем поговорить по настройкам по настройкам это у у всех компонентов всегда все одинаково то есть у нас есть капелька а о каких-то других компонентов еще есть дополнительно ключик то есть вот видите у нас появился ключик но мы про это поговорим отдельно сейчас мы пока поговорим с текстом и так нажимаем капельку и у нас здесь есть некие предустановленные оформления которые мы в принципе можем использовать то есть появляется тень а водка вот если мы убираем фокус то мы уже видим как это все дело работает соответственно здесь можно использовать какие-то заранее предустановленные стиле и ускорить свою работу по разработке сайт так фон можно задать фон этому текстовому полю задать либо цвет выбрав до какой-то там у нас был заранее определён то есть либо какие то другие ингредиенты за брожения даже видео можно добавить с разными фишками дальше границ и соответственно но в данном случае да у нас стоит рамка отключена скругление границ 0 если мы выберем какой то стиль то у нас здесь сразу появится предназ тройки толщина рамки цвет рамки рамка уже включена мы также можем управлять ими для настройки также управлять скругление вот видите вот здесь очень хорошо стало заметно как она скруглила так но есть какой-то предел когда скругление больше не увеличивается здесь до на 50 ну то есть в принципе мы сделали пунктир или скруглений текст обводки текста [музыка] так дальше у нас есть управление тенью да то есть мы можем этому блоку добавить тень там сверху снизу справа слева тут прям целая куча подробных настроек в принципе если вам необходимо поработать с тенью то вы всегда можете здесь поиграться и найти для себя решение и отступ и про отступая уже рассказывал чуть-чуть в настройках секции тут принцип ровно тот же самый то есть у нас есть задаются отступ и которые мы можем задавать для конкретного устройства нов широкого экрана либо для телефонов и ноутбуков планшетов [музыка] если вы условно говоря включить это в данном случае ничего вы не увидите изменения да но когда у вас допустим переключить на мобильный вид то есть и зайти сюда то здесь мы вот уже видим как регулируется для телефонов отступ то есть это персональная настройка для телефонов и это надо учитывать при разработке далее далее эффекты но про эффекты тоже уже немножко разговаривали то есть можно включить некую анимацию да то есть ведь он как бы моргает тут очень много разных анимаций вот всплывания задержка анимации ну то есть в принципе тоже самое что в настройках секции анимации можно добавлять а также можно включить анимацию по наведению курса курсора простите на то есть когда находится курсор текст увеличиваются или там бизнес искривляется например вот мы можем его раз искривился другой какой-то вид вот такие настройки так дальше у нас есть параметры здесь примерно и ну не примерно точнее здесь ровно та же самая история которой я рассказывал уже в секциях здесь якорь можно прописать чтобы поэтому якорю можно было сделать кнопку и уже скролить к этому именно непосредственно прямо к этому блоку текста когда вам нужно ссылку сделать например на конкретный заголовок чтобы и расположенную под ним информацию человек увидел по нажатию на кнопку то это соответственно делается через якорь ну и класса компонента также тут есть несколько предустановленных таких как хидан да и других которые можно спросить у поддержки например вообще в принципе если у вас что-то не получается или вы не знаете как это сделать велкам в поддержку и обязательно вам помогут и видимость про видимости а также уже рассказывал в настройках секции тут все одинаковые ну чтож разобрали первый блок виджетов по работе с текстом жду вас следующих уроках пока пока
Пройди регистрацию
Смотри обучающие видео
Выполняй домашние задания для закрепления материала
Создавай впечатляющие сайты
Для тех кто ищет новую профессию
Начинающим фрилансерам
Маркетологам
Предпринимателям
Получите необходимый запас знаний и навыков для уверенного старта в разработке сайтов с возможностью трудоустройства
Получите стартовые знания как делать сайты и веб сервисы
с возможностью консультироваться у практика и получения заказов
Расширите свои знания в области цифровых технологий и откройте для себя новые возможности роста
и развития Вашего бизнеса
Инвестируйте в команду. Обучите сотрудника делать сайты для бизнеса
В нашем курсе он узнает все тонкости создания и управления It ресурсов
14 лет опыта в создании сайтов
Эксперт по созданию продающих сайтов и веб сервисов
Главный преподаватель школы, web мастер, предприниматель
Спикер и ведущий мастер-классов
по бизнесу на разных мероприятиях
Получите подтверждение того, что профессия веб-мастера для Вас!
Зарегистрируйтесь на бесплатный курс что-бы понять, подходит она Вам или нет
Выберите нужный вариант
Ответьте на 6 вопросов и мы вышлем Вам предварительную стоимость и сроки работы
Какой тип услуг Вас интересует?
Выберите тип сайта
Что уже готово для сайта?
Укажите ссылки на сайты (если есть), которые хотелось бы использовать в качестве примера?
В какие сроки планируете выполнение работ?
Как с Вами связаться?