Тильда как работать с конструктором
Обновлено: 02.05.2024
Для некоторых это становится источником постоянного дохода, если подойти к процессу с умом.
В прошлый раз мы сверстали страницу «О себе» на HTML и Бутстрапе. Давайте сделаем то же самое, но без программирования — на конструкторе сайтов «Тильда».
Какие такие конструкторы
Конструкторы сайтов — специальные программы и сервисы, которые помогают собрать сайт из готовых блоков. Одни блоки отвечают за текст, другие за картинки, третьи — за списки и так далее.
Блоки можно настроить по вкусу, но в целом они ограничены по возможностям. Зато их не нужно программировать: в большинстве конструкторов всё происходит в режиме drag’n’drop. Это значит, что достаточно выбрать блок, перетащить его на нужное место, вписать текст, вбросить картинку, и всё — блок работает. В итоге мы жертвуем гибкостью и возможностями настройки ради того, чтобы делать сайты было просто.
В этой статье мы будем использовать конструктор «Тильда». У него «этажная» архитектура: каждый блок — это этаж, поставить блок слева и справа нельзя. Но зато мы получаем полную адаптивность: каждый элемент хорошо выглядит на любом экране.
Регистрируемся и создаём проект
Прежде чем собирать страницу о себе, зарегистрируемся в сервисе. На странице создания аккаунта для этого вводим имя, почту и пароль:
Сразу после регистрации сервис предлагает придумать внутреннее название проекта. Оно ни на что не влияет, просто для того, чтобы было удобнее ориентироваться, когда проектов будет много. Пусть название будет «Сайт о себе»:
Обычно сайт состоит из многих страниц, но нам пока хватит одной. Нажимаем «Создать новую страницу»:
Настраиваем заголовок
В Тильде есть два пути — выбрать уже готовый шаблон или создать страницу с нуля. Шаблон подходит в тех случаях, когда надо быстро сделать типовой сайт и не хочется думать над дизайном. Это не наш случай, потому что у нас дизайн уже есть — мы повторяем то, что сделали в прошлой статье, поэтому выбираем вариант «Пустая страница»:
Чтобы увидеть все элементы, из которых можно собирать страницу, нажимаем на «Все блоки»:
У нашей страницы нет обложки, она сразу начинается с заголовка. Открываем раздел «Заголовок» и выбираем тот, который подходит больше всего. Неважно, что там написано больше, чем нам нужно — лишнее мы удалим или скроем. Допустим, мы решили, что самый первый заголовок (TL01) нам подходит, поэтому нажимаем на него, и он сразу попадает на страницу:
Смотрите, здесь много лишнего и не тот текст, который нам нужен. Сначала разберёмся с лишним — выделяем по очереди текст сверху и снизу заголовка и стираем его. Тильда поймёт, что нам эти элементы не нужны, уберёт их и подвинет заголовок повыше:
Но текст до сих пор не тот, что нам нужен. Чтобы его поменять, выделяем старый заголовок и пишем правильный:
Осталось настроить размер и положение текста как на уже готовой HTML-странице. Для этого сначала выделяем текст и с помощью инструментов, которые появляются на верхней панели, делаем заголовку нужный размер и выравниваем по левому краю:
Наполняем всю страницу
Точно таким же образом перетаскиваем, наполняем нужным текстом и настраиваем остальные блоки. Принцип работы в каждом блоке один и тот же, поэтому мы не будем останавливаться на каждом подробно, а просто покажем, что получилось.
Основной текст и картинка — блок IM10:
Мои научные работы — блоки TL03 для подзаголовка и CL04 для четырёх колонок текста. Ссылки ставятся тоже через верхнее меню:
Контакты для связи — блоки TL03 для подзаголовка и TX01 для текста:
Перед публикацией
Название страницы меняется по кнопке «Настройки» в верхнем меню. Пишем там то же самое, что и прошлый раз:
Там же можно перейти к настройкам всего сайта — это нам понадобится для настройки цветов и общих параметров. В первом разделе сразу пропишем общее название сайта и его описание, а также придумаем имя для субдомена:
Цвета, шрифты, аналитика и прочие глобальные вещи настраиваются через то же меню слева:
Когда все настройки сделаны, сохраняем изменения и нажимаем кнопку «Публиковать». В этот момент наш сайт станет доступен всему миру по адресу mihailmaximov.tilda.ws.
Что дальше
Можно сделать много страниц, настроить переходы между ними и получить полноценный сайт.
Если есть свой домен, можно повесить сайт на Тильде туда, но для этого нужен платный аккаунт в конструкторе.
А если хорошо освоить Тильду, то можно брать заказы на изготовление сайтов и зарабатывать на этом.
В «Яндекс Практикуме» можно стать разработчиком, тестировщиком, аналитиком и менеджером цифровых продуктов. Первая часть обучения всегда бесплатная, чтобы попробовать и найти то, что вам по душе. Дальше — программы трудоустройства.
Нажимая на кнопку, вы даете согласие на обработку персональных данных и соглашаетесь c политикой конфиденциальности
Пять шагов создания сайта, особенности платформы Tilda Publishing, ссылки на нужные ресурсы и полезные советы.
Создать хороший сайт — это проблема. Поэтому мы написали руководство, которое поможет сделать сайт без большой команды, в разумные сроки и за небольшие деньги. Все наработки, полученные за 15 лет работы в веб-дизайне, мы разложили по полочкам, сжали и рассказали как их применить, используя Tilda Publishing — платформу, которая помогает делать классные сайты. Читайте, следуйте, делайте и у вас обязательно все получится.
Подумайте, из каких разделов будет состоять ваш сайт, в чём основная идея и задача. Например, заказчику нужен сайт для архитектурного бюро. На поверхности понимание, что должны быть их работы и контакты. Но мы уточняем: а чем бюро отличается от других?
Оказывается, что бюро специализируется на крупных, сложных проектах и является экспертом в таких заказах. Делаем вывод, что недостаточно просто хороших картинок с подписями, нужен текст — довольно подробные описания исходных данных, процесса, объяснения и обоснования решений. Также мы понимаем, что проектов много, но показывать все необходимости нет. Концентрируемся на самых масштабных. И еще момент, нужно рассказать о людях, объяснить, почему они эксперты в своем деле.
Не уходите в сторону анимации, украшательств и спецэффектов, определите сверх идею, суть — что затронет посетителя эмоционально, что его впечатлит и вдохновит.
Проблема: Школьники хотят быть дизайнерами, но зачастую не понимают специфику профессии, какие есть направления в дизайне, чем они отличаются.
Задача: Помочь будущим студентам разобраться в специализациях и понять какая именно им подходит.
Идея: Что если выделить несколько основных направлений дизайна: интерактивный дизайн, графический, промышленный и взять интервью у трёх самых крутых представителей? Личные истории очень эмоциональны и хорошо работают. Рассказать чем они живут, как добились успеха, добавить классные фотографии. Людям будет интересно прочитать, они для себя увидят, что это за человек, близок он, вдохновляет ли его образ жизни.
Откройте текстовый редактор и запишите структуру в виде списка. Оцените объем и подумайте можно ли будет уместить всю информацию на одной странице. Если информации много, то сайт нужно сделать многостраничным. В этом случае подумайте какие разделы вынести в меню.
Нюанс: не пишите главную страницу как начало «дерева». Пусть страница «контакты» будет иметь тот же уровень, что и «главная». Это поможет, когда вы будете делать навигацию.
Вы можете создать до 5 сайтов (тарифный план Business) и каждый сайт подключить к отдельному домену. На бесплатном тарифе и тарифе Personal вы можете создать один сайт.
Сайт может состоять как из нескольких страниц (сайт-портфолио, журнал, блог), так и из одной страницы (лэндинг пейдж, лонгрид). Разница в настройках: стиль (шрифты, цвета) назначается всему сайту, к нему же подключается домен.
Вы можете начать проект с чистого листа, либо выбрать один из шаблонов. Шаблон — это образец хорошего дизайна и пример использования блоков. Выбор шаблона никак не ограничивает ваше творчество.
Блоки — это основа Тильды. Более 500 современных блоков, спроектированных профессионалами, покрывают большую часть необходимых комбинаций. Каждый из блоков гармоничен, поэтому вам не обязательно быть дизайнером. Все, что вам нужно — это хороший контент и хороший вкус.
Добавлять и редактировать контент можно либо прямо со страницы — кликните на текст для редактирования или перетащите изображения, чтобы добавить картинки. Либо через меню «Контент» (оранжевая кнопка).
Каждый блок, в зависимости от типа (изображение, текст, видео, кнопка) имеет собственные настройки. Блоки можно дублировать, менять местами, вырезать, копировать и вставлять в любое место на текущей странице, на другой странице и даже в другом сайте в рамках одного аккаунта.
Tilda (читается как «тильда») – это удобный и простой конструктор сайтов. Его используют, чтобы создавать небольшие ресурсы, состоящие из одной или нескольких страниц. Благодаря простоте и интуитивно понятному интерфейсу узнать, как сделать на «Тильде» собственный сайт, сможет кто угодно. И владелец малого бизнеса, и маркетолог, и блогер – навыки программирования для этого совершенно не нужны.
Add author snippet
Почему выбирают Tilda
в сайтах на «Тильде» акцент делается на внешней привлекательности. Обычно, чтобы сделать оформление красивым, приходится постараться: подключить знания по HTML и CSS, возможно, пригласить дизайнера. С Tilda все намного проще. Благодаря безупречной типографике и выверенным элементам можно получить красивую картинку даже без специальных знаний;
огромное количество подсказок, дружелюбный и интуитивно понятный интерфейс, пошаговые руководства – все это позволяет с легкостью создать сайт, не путаясь и не ошибаясь;
в Tilda множество шаблонов для ресурсов самой разной направленности: визиток, магазинов, лендингов.
Стоимость Tilda
«Тильда» предлагает пользователям три тарифных плана с разными возможностями. Кто-то называет ее стоимость минусом, кого-то устраивают тарифы, а кому-то достаточно бесплатной версии, в которой клиенту доступен только ограниченный набор шаблонов.
Тариф Free
Бесплатная версия предлагает пользователю до 50 страниц и 50 мегабайт дискового пространства. Это довольно мало, но для сайта-визитки или лендинга такого объема обычно достаточно. Набор модулей, которые можно использовать во Free-версии, ограничен, это влияет на функциональность, поэтому серьезный многофункциональный ресурс в бесплатном тарифном плане «Тильды» создать не получится. Есть и еще несколько нюансов:
тариф Free не предполагает собственного доменного имени. Сайт разместится на поддомене, его имя будет выглядеть так: .tilda.ws. С одной стороны, на пользовательский опыт это не влияет, потому что большинство все равно переходит на сайт из контекстной рекламы или из поиска. С другой стороны, собственное доменное имя людям проще запомнить, да и доверия такие названия вызывают больше;
Тариф Personal
Тарифный план Personal стоит 500 рублей в месяц, то есть 6000 в год, что называют главным минусом «Тильды»: это всего лишь конструктор, но его цена выше, чем у некоторых полноценных CMS. Движки вроде Drupal или WordPress обойдутся дешевле даже с учетом аренды места на хостинге, а возможностей у владельца сайта будет больше. Впрочем, это не повод отказаться от использования конструктора со всеми его возможностями: по сути, вы платите за простоту и скорость создания сайта.
Тариф Business
Самый дорогой тарифный план предоставляет еще более широкие возможности. Сохраняются все преимущества предыдущего тарифа, вдобавок клиент получает возможность:
создать до 5 сайтов;
экспортировать и скачать код на собственный сервер;
интегрировать сайт с WordPress.
Впрочем, в большинстве случаев такие возможности просто не нужны. Как минимум по цене, которую требует Tilda: 1000 рублей в месяц, 12 000 в год. За эти деньги проще воспользоваться CMS с открытым кодом.
Если бесплатный вариант подходит для фрилансеров, а тариф Personal – для авторов блогов, представителей e-commerce и малого бизнеса, то тарифный план Business не рекомендуется практически никому. Специалисты, которым может потребоваться такая функциональность, скорее воспользуются более дешевыми вариантами – движками и хостингами.
Планирование сайта
Для тех, кто не уверен в себе или не хочет тратить время, есть и другой вариант – использование шаблонов. Уже готовые страницы понадобится только заполнить собственным контентом. Но выделиться не получится: шаблоны используют сотни пользователей.
Что еще нужно учесть. Помимо структуры и наполнения, вы должны понимать, каким образом будете презентовать себя. «Тильда» позволяет сделать дизайн красивым без лишних сложностей, но при этом важно не потерять индивидуальность. Подумайте, как вы будете разговаривать с посетителем, что он должен подумать о вас и как воспринять ваш сайт. Значение имеет и цветовая гамма, и tone of voice – все, что так или иначе играет на впечатлении пользователя.
Результаты планирования. По итогам мозгового штурма у вас должны быть на руках сведения:
о цели и желаемой функциональности сайта;
внешнем виде и дизайне отдельных страниц.
Если вы решили собирать страницы с нуля, вам понадобятся инструменты прототипирования или лист бумаги, на котором вы примерно обрисуете, как будет выглядеть расположение блоков. В крайнем случае хотя бы список нужных элементов. Пригодятся здесь и примеры хороших, качественных сайтов: можно ориентироваться на них.
Если вы выбрали использование шаблона, такая подготовка тоже не помешает: шаблоны можно редактировать, изменяя элементы. Они довольно гибкие и одновременно защищают вас от ошибок в дизайне: тяжеловесности, неудобства, перегруженности.
Базовые настройки сайта на Tilda
После того как план будет готов, можно переходить к разработке. Для начала понадобится зарегистрироваться в «Тильде», перейти на вкладку «Тарифы и оплата» и выбрать тарифный план Personal.
Business неоправданно дорог, а Free для использования многих функций недостаточно, поэтому Personal – оптимальный вариант. Первые две недели – триал-версия, которая предоставляется бесплатно.
Дальше понадобится создать и настроить ресурс:
перейти в раздел «Мои сайты», выбрать вариант «Создать новый сайт»;
написать в соответствующих окнах название ресурса, его описание и имя субдомена. Он предоставляется по умолчанию, собственное доменное имя можно подключить в том же разделе;
настройте параметры в разделе «Настройки сайта». Если вам нужен свой домен, активируйте его сразу и вернитесь сюда позже. Как это делается, описано ниже.
1. Подключение счетчиков
Чтобы собирать статистику с сайта, понадобится добавить к нему аналитические системы поисковиков, перейти во вкладку «Аналитика & SEO», подключить там счетчики «Яндекс.Метрики» и Google Analytics, по желанию также Google Tag Manager.
Первый вариант – зарегистрировать доменное имя в этих системах, получить коды счетчиков и вписать их в соответствующее поле в настройках Tilda. В Яндексе это делается так.
В Google Analytics – так.
Второй – нажать в разделе «Аналитика & SEO» на кнопку «Подключить».
Примите запрос в аккаунте «Яндекса», выберите нужный счетчик и сохраните настройки. Код появится в соответствующей панели. Если на сайте уже были страницы, их понадобится опубликовать заново.
Аналогичным образом это делается для Google Analytics. Сначала зарегистрируйтесь в сервисе.
Затем нажмите на кнопку «Подключить».
Выберите подходящий счетчик.
2. Подключение вебмастерских панелей
Без этих инструментов отслеживать SEO-параметры и управлять продвижением намного сложнее, так что подключить их нужно.
Это делается в той же вкладке: достаточно нажать «Подключить» в соответствующих разделах, принять запрос в аккаунтах вебмастерских панелей и подождать автоматического подтверждения. Вам сразу же предложат поставить автоматически созданную карту сайта – сделайте это, потому что самостоятельно управлять sitemap в «Тильде» не получится.
Подключение платного домена к Tilda
Если вы выбрали вариант с собственным доменным именем, вам для начала понадобится его зарегистрировать, это делается на стороннем ресурсе, одном из многочисленных сайтов-регистраторов.
Как подключить домен к Tilda
перейдите в раздел «Управление доменом – DNS-серверы»;
в разделе «Управление зоной» удалите записи класса A и добавьте вместо них новые, с IP-адресом сервера Tilda;
в разделе «Добавить запись CNAME» впишите в соответствующие поля субдомен www и каноническое имя tilda.ws. Это нужно, чтобы сайт был доступен и по адресу с www, и без него.
Только после этого введите доменное имя в настройки самой «Тильды». Изменения вступят в силу через несколько часов.
Перед тем, как создавать сайт, задайте себе важный вопрос — зачем он вам? Что вы хотите сделать с его помощью? Представить свою компанию? Представить себя? Прорекламировать продукт? Для всех этих целей нужны разные страницы с разной структурой. Можно ли их самостоятельно собрать на сайте-конструкторе? Да! Мы полностью обновили материал 2016 года и открываем им цикл статей о современной Тильде — из 2020-го. Сегодня вместе с Ириной Ждановой вы погрузитесь в теорию и узнаете, как сделать сайт на Тильде самостоятельно. А позже мы расскажем и о том, как сделать лендинг, и о том, как собрать и запустить блог, и о том, из каких блоков создаётся сайт-визитка на Тильде. Не переключайтесь.
Тильда — это конструктор сайтов, на котором можно собрать хоть лендинг, хоть сайт-визитку, хоть портфолио. Попробовать Тильду можно бесплатно, тестового периода нет. Есть бесплатный тариф с усечёнными возможностями. Когда освоитесь на нём, то решите, хотите ли вы платить за полный функционал.
На экране регистрации введите имя, е-мейл и придумайте пароль.
Вы попадёте внутрь конструктора. С этого момента вы уже можете делать свой первый сайт. Нажмите «Создать» на всплывшем окне.
Если вы закрыли это окно, ничего страшного. Нажмите на кнопку «Создать новый сайт», которая всегда видна в правом верхнем углу.
После регистрации аккаунта на почту придёт письмо от Тильды с просьбой подтвердить свой е-мейл. Рекомендую сделать это. Новичкам предлагают записаться на бесплатный вебинар про работу с конструктором и про то, как создать сайт на Тильде. Воспользуйтесь предложением, чтобы познакомиться с платформой ближе.
Возможности бесплатного тарифа Тильды
В бесплатном аккаунте доступен один сайт с 50 страницами. Это означает, что вы можете сделать как один сайт, одно- или многостраничник, так и несколько лендингов, если, например, вы продаёте похожие продукты под одним доменным именем.
На технические страницы — меню и «подвал» (самый нижний блок) — отводится 2 отдельные страницы. Это значит, что у вас будет ещё 48 страниц для творчества.
Естественно, ненужные и потерявшие актуальность страницы можно удалять, а на их месте — создавать новые.
Лайфхак: если вам не нужно собирать платежи, если вы не собираетесь менять страницу, если вы думаете, как сделать сайт на Тильде типа визитки, то можно остаться на бесплатном тарифе. Всё будет работать и так. Платный тариф нужен, если вы планируете запускать большой блог, настраивать рассылку и принимать платежи.
Предположим, вы решили создать сайт-визитку, сделать лендинг с рекламой своих услуг или курса, а позже — прикрутить к сайту блог. Тогда бесплатного тарифа вам хватит на то, чтобы создать все нужные страницы сайта-визитки: обо мне, услуги, тарифы, отзывы, портфолио. На лендинг уйдёт ещё одна страница. И ещё страниц 40 останется на блог. Когда исчерпаете лимит, будете точно знать, нужен вам платный тариф или стоит сделать сайт на Вордпрессе.
Шаг 1. Создайте проект и дайте доменное имя сайту на Тильде
Первым делом придумайте название проекту.
Это нигде не будет отражаться, но позволит не запутаться в проектах. Ведь на бизнес-тарифе вы можете создавать до пяти сайтов на одном аккаунте.
Если вы вдруг заблудитесь на сайте, нажмите на «Мои сайты» в главном меню — первый пункт после логотипа. Вы окажетесь на основной странице, где сможете выбрать один из ваших проектов.
В первый заход вам подсветят самые главные кнопки: «Справочный центр», «Настройки сайта» и «Создать новую страницу».
Пройдёмся по каждой из них.
В справочном центре вы сможете получить ответ на любой свой вопрос. У Тильды очень дружелюбная техподдержка, всегда готовая до последнего решать вашу проблему. Они говорят на русском — это важно.
В настройках сайта нас интересует сейчас вкладка «Главная».
Здесь нужно поменять название проекта и в поле «описание сайта» обозначить суть проекта.
Домен на Тильде
По умолчанию доменное имя вашего сайта будет выглядеть как «projectXXXXXXXXXX.tilda.ws». Это домен (название сайта) третьего уровня. На бесплатном тарифе вы можете поменять только часть с «projectXXXXXXXXXX». Подключение своего домена, без приставки «tilda», возможно только на платных тарифах. Запишите, как будет называться ваш субдомен — что будет отражаться в адресной строке.
В левом меню вы пока заполняете только данные во вкладке «Главное». Всё остальное или рано, или доступно только на платных тарифах. После правок нажмите кнопку «Сохранить изменения», а затем — «Закрыть». Вы снова попадаете в окно редактирования сайта.
Шаг 2. Создайте новую страницу на Тильде
Кнопка «Создать новую страницу» приводит нас к целому морю возможностей.
В Тильде можно сделать красивый блог, функциональный магазин, большой многостраничный сайт, портфолио и всё что угодно.
Выберите шаблон
Первый лист во вкладке «Бизнес» — не шаблон. Это белый лист, вы можете добавить туда что угодно. Но я рекомендую вам пролистать все остальные шаблоны. Посмотрите, какие элементы на них вам нравятся визуально, а какие — вам есть чем наполнить. И выберите тот, который подходит больше всего.
Все шаблоны можно рассмотреть подробнее. Нажмите на выбранный, и он развернётся во весь экран.
- Создать страницу у себя кнопкой «Создать страницу»
- Листать шаблоны дальше стрелками и смотреть сразу большие
- Закрыть окно шаблона и вернуться на экран их выбора.
Шаблон выбран. Что же дальше?
Шаг 3. Отредактируйте настройки страницы на Тильде
Если навести курсор на название, станут видны три кнопки: «Настройки», «Публиковать» и «Удалить». Сейчас вам нужна первая — с настройками.
Это очень важно — корректно заполнить настройки страницы. То, что здесь написано, будет видеть пользователь, когда вы опубликуете где-нибудь ссылку. Согласитесь, неловко получится, если вы продаёте цветы, а в подписи шаблона останутся данные, ну например, парикмахерской.
Заголовок и описание страницы
Заголовок страницы — то, что увидит пользователь вверху браузера, наведя мышку на значок сайта. Отнеситесь к выбору заголовка ответственно.
Описание — то, что пользователь увидит, когда вы будете публиковать ссылку в соцсетях, описание должно соответствовать содержимому страницы.
Адрес страницы — то, как будет выглядеть ссылка на страницу. Если заголовок и описание нужно делать на русском, то ссылка должна быть латиницей.
Заполните эти поля по образцу:
Бейджик
В окне следующей вкладке можно задать изображение проекта.
Это картинка, которую увидят пользователи, когда вы опубликуете ссылку в соцсетях. По умолчанию после публикации берётся первая картинка на странице. Но вы можете поместить сюда любую свою. Логотип, фотографию директора, топовый продукт — всё что угодно.
Собственно, на этом настройка страницы закончена. Не забудьте нажать кнопку «Сохранить изменения». Она находится внизу любой из вкладок.
Другие вкладки
Быстро расскажу, что в остальных вкладках.
Фейсбук и СЕО — тут можно поменять заголовок, описание и картинку. По умолчанию они возьмутся из двух первых пунктов.
Экспорт — нужен, если вы хотите куда-то перенести свой сайт, например на Вордпресс. Доступен только на тарифе “Бизнес”.
Действия — здесь вы можете дублировать, перенести или удалить страницу. В первое время вам может пригодится дублирование и удаление, но последнее возможно и на странице редактирования сайта.
Дополнительно — тут вы можете снять страницу с публикации, поменять дату создания страницы, поставить пароль (только на платном тарифе).
Каждый раз, создавая новую страницу, первым делом редактируйте её настройки.
Шаг 4. Сконструируйте страницу сайта
Честно говоря, в бесплатной версии можно использовать едва ли 1/10 возможностей Тильды. Большинство блоков недоступны. Но можно в течении двух недель протестировать платную версию.
Этого времени вам хватит, чтобы собрать основные страницы сайта и оценить, стоят ли все возможности Тильды того, чтобы на них тратиться.
Если вы выбрали максимально подходящий под ваши задачи шаблон, другие блоки вам могут и не понадобиться. Но если нужно что-то поменять, добавить раздел с текстом или изображением, прикрутить цитату или блок отзывов, используйте блоки-конструкторы Тильды.
Где расположены блоки Тильды
Наведите курсор на любой блок, ниже него появится белый плюс в чёрном кружке. Надо на него нажать, и слева откроются все блоки.
Другой вариант — найти в конце страницы чёрный прямоугольник и нажать на него.
Для удобства пользователей они сгруппированы в подразделы.
Шаг 5. Отредактируйте и настройте нужные блоки
Когда вы выделяете любой блок, слева над ним появляются три пункта меню.
Настройка визуального образа блока
Первый прямоугольник — своеобразный адрес, помогает сориентироваться и понять, из какого раздела взят блок и какой у него номер. Буквы означают название раздела, а номер — каким по счёту он там находится.
Если вам понадобится в будущем такой же, по номеру его легко найти в списке. Также вы можете увидеть, как по-разному может выглядеть один и тот же блок, и заменить его в шаблоне на более подходящий.
Если меняете блок, установите ползунок на «Сохранять контент при переключении», иначе вам придётся вставлять свои тексты и картинки заново.
Настройки элементов блока
Внимание, содержимое настроек зависит от использованных элементов: картинок, кнопок, колонок, текста. Поэтому в разных блоках настройки разные. Это нормально.
Шаблоны Тильды разрабатывали профессиональные веб-дизайнеры: типографика, сочетания шрифтов, расстояния между строками и соседними блоками выверены. Поэтому в первых опытах я вам рекомендую как можно меньше изменять что-то в пункте настроек. Максимум — цвета и форму кнопок и цвет фона.
Если вы сделали что-то страшное и отредактировали блок не так, как нужно, можно отменить изменения. Кнопка отмены находится в верхнем меню страницы сайта.
Настройка контента
В третьем прямоугольнике меняются тексты, надписи кнопок, заголовки, картинки. Вместо шаблонного вставьте свой контент.
Загрузка картинок
Чтобы поменять картинку, нужно нажать кнопку «Загрузить файл».
Процедура привычная: появится всплывающее окно, в котором вы откроете нужный файл на компьютере.
Другой вариант: открыть папку с изображениями на компьютере и перетащить нужное в окно Тильды.
Создание кнопки на Тильде
Чтобы создать кнопку на сайте, надо выбрать отдельный блок «Кнопка» в подразделе «Кнопки и формы». Или использовать готовый блок из какого-нибудь шаблона. Обычно это указано в описании блока.
Чтобы кнопка работала, её тоже нужно настроить.
Во-первых, надо заполнить поле «Текст кнопки» — это то, как она будет называться. Название зависит от того, какое действие выполняет пользователь на странице. «Купить», «Перейти», «Смотреть», «Узнать больше», «Заказать» — лучше всего для названия кнопки подходит глагол, побуждающий к действию.
Во-вторых, надо настроить, куда кнопка будет вести. В поле «Ссылка кнопки», надо прописать URL — адрес нужной страницы.
Вариантов тут два:
- Вставить адрес любой страницы в интернете. Тогда нажатие на кнопку будет переносить пользователя на другой сайт. Рекомендую всегда ставить галочку «В новом окне», тогда пользователь откроет нужную страницу в браузере и не закроет при этом ваш сайт.
- Вы можете вставлять в кнопку другие страницы своего сайта или блоки текущей страницы.
- «Выбрать страницу» — Тильда предложит список ваших уже созданных страниц, и вы сможете указать нужную.
- «Выбрать блок» — вы окажетесь в редакторе страницы и сможете прокруткой вверх-вниз выбрать нужное место, не уходя с неё. У каждого блока есть свой уникальный номер, так что не волнуйтесь, кнопка будет вести, куда надо.
Редактирование текста в Тильде
Практически в каждом блоке есть какой-нибудь текст, то поверх картинки, то в виде цитаты или отзыва. Чисто текстовые блоки можно найти в подразделе «Текстовый блок».
Любой текст на странице можно редактировать, не заходя в настройки контента. Просто нажимайте на строку текста и меняйте его шрифт, размер или начертание на экране.
Но честно говоря, удобнее редактировать текст в редакторе контента.
Чтобы изменения сохранились, снова нажимайте «Сохранить и закрыть», если вы закончили редактировать этот блок, или «Сохранить», если вы хотите ещё с ним поработать. Редактировать блоки можно неограниченное количество раз.
Шаг 6. Перемещайте, дублируйте и удаляйте блоки
Что еще можно сделать с каждым блоком в Тильде? Посмотрите в верхний правый угол блока — там есть ещё шесть кнопок.
1 — дублировать блок.
2 — удалить.
3 — спрятать (не показывать на опубликованной странице, но сохранить в редакторе для своих нужд).
4 — в раскрывающемся треугольнике можно блок вырезать, копировать, вставить и выделить.
5, 6 — стрелками вверх и вниз можно менять положение блока на сайте. Вдруг вы поняли, что информацию о себе вы хотели бы поднять повыше, а фотографии — наоборот, опустить пониже.
На этом закончим с теорией. Во второй части материала мы перейдём к практике и пошагово покажем, как сделать сайт на Тильде на основе одного из её шаблонов. Вы увидите, можно ли адаптировать готовые шаблоны под свою тематику и свой бизнес и узнаете хитрости работы с блоками. Больше полезных материалов — в Клубе «Маркетинга с азов» и Телеграм-канале .
Ирина Жданова, специалист в Тильде, лоукостер сайтов, копирайтер и маркетолог.
Читайте также: