Как работать с Tilda — инструкция по созданию сайта в конструкторе

Почему выбирают Tilda

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

Преимущества Тильды:

• Нулевой блок. Одна из важнейших функций, которая только выделяет Тильду среди конкурентов. Благодаря ему вы можете создавать собственные блоки, включающие 9 типов элементов (тексты, фигуры, изображения, кнопки и так далее), слои и направляющие, формы для получения данных и многое другое.
• Удивительная коллекция блоков. Из готовых решений можно найти такие блоки, как обложки, изображения, меню, формы и кнопки, плитки и ссылки, преимущества, этапы и многое другое. Подобные блоки — отличный способ создать веб-сайт, даже если вы не очень разбираетесь в дизайне.
• Интернет-магазин. Тильда позволяет создавать не только страницы-визитки или лендинги, но и целые интернет-магазины. Виджеты корзины покупок, настройка формы заказа, платежные системы, каталог товаров, промокоды и акции… Вы можете найти весь арсенал для создания отличного магазина.
• Блоги. Раньше для создания сайта для блога нам приходилось нанимать специалиста по WordPress или другой подобной CMS. Теперь все можно сделать самому: Тильда полностью оборудована для таких задач.
• Форма сбора данных и управление базой данных клиентов. Практически ни один сайт сейчас не обходится без сбора заявок. Создать такой функционал на Тильде можно всего в несколько кликов.

Что умеет Тильда

Чтобы понять, на что способна Тильда, рекомендую посмотреть готовые сайты, созданные с помощью этого конструктора.

Вот как может выглядеть сайт-портфолио:

Лендинг по продаже интерактивных роботов:

Посадка для арендованного автомобиля:

Целевая страница продажи элитной недвижимости:

Если вы хотите научиться создавать мощные и продающие страницы на Тильде, рекомендую изучить такие страницы. Постепенно будет прокачиваться зоркость — способность распознавать стильное и гармоничное решение.

Читайте также: Пошаговое построение выкройки женских брюк

Тарифные планы Tilda

Владельцам аккаунтов доступно 3 тарифных плана — бесплатный, персональный и бизнес.

Free

Free — бесплатно, активируется автоматически после регистрации аккаунта. Создать веб-сайт может быть хорошо, но очень просто. Такой тариф позволяет использовать Zero-Block, но не имеет возможности подключить собственное доменное имя, SSL-сертификат, аналитику сайта и многое другое. Бесплатный курс — отличный способ разобраться в работе конструктора.

Ограничения по тарифу: максимальное количество проектов — 1, количество страниц для каждого проекта — 50, объем загружаемых файлов — 50 МБ.

Personal

Персональный — стандартный тариф, дающий доступ ко всем возможностям Тильды: полная коллекция блоков, подключение вашего домена, коллекция бесплатных иконок и многое другое. Вы можете ознакомиться с полным набором функций здесь.

Ограничения по тарифу: максимальное количество проектов — 1, количество страниц для каждого проекта — 500, объем загружаемых файлов — 1 Гб.

Стоимость тарифа: 750 руб/мес + домен в подарок.

Business

Бизнес — профессиональный тариф, предназначенный для размещения нескольких сайтов. Он позволяет создать на один аккаунт 5 и более сайтов — каждый с определенным количеством страниц, собственным доменом и так далее.

Тарифный план также имеет варианты – это Бизнес 10, 15, 20 и 30. Цифра обозначает количество мест. Например, в тарифе Бизнес 15 разрешено создавать до 15 сайтов.

Еще одним отличием от предыдущих тарифов является возможность экспорта исходного кода. Благодаря этому вы можете создать страницу на Тильде и перенести ее на свой хостинг. Подходит для тех, кто хочет отредактировать HTML-код и разместить его на другом хостинге.

Ограничения по тарифу: максимальное количество проектов от 5 до 30, количество страниц для каждого проекта 500, объем загружаемых файлов 1 Гб.

Как убрать надпись «Made on Tilda»

Стоит отметить, что при ежемесячной оплате любого тарифа остается одна неприятная особенность – надпись «Сделано на Тильде» в футере сайта.

Подписка исчезает, если вы оплачиваете персональный или бизнес-план на год. Вы также можете подключиться к тарифному плану Бизнес, а затем экспортировать весь код и удалить в нем блок HTML-кода с надписью — этот вариант подходит только для тех, кто будет размещать сайт на другом хостинге.

Если годовой платеж вас не устраивает, рассмотрите других дизайнеров. Например, в Craftum такой функции нет, но точно так же можно строить страницы как по шаблонам, так и с нуля. Есть 10-дневный пробный период, в течение которого доступны все возможности конструктора.

Создаем сайт на Tilda

Перейдем к практическим навыкам — в этом разделе мы научимся создавать полноценный сайт, используя как обычные блоки, так и Zero-Block. Для примера возьмем небольшую страницу-визитку, которая включает такие блоки, как «Главный экран», «Информация о компании» и «Контакты». Но перед этим мы зарегистрируемся на сервисе.

1. Открываем официальный сайт и на главной странице нажимаем «Создать сайт бесплатно».
2. Введите данные для регистрации и нажмите «Зарегистрироваться». Обратите внимание на почту — проверьте ее правильность, нужно будет верифицировать аккаунт.
3. В итоге мы попадаем в личный кабинет, где перед нами появляется модальное окно с предложением создать новый сайт. Введите для него название, например «Моя первая страница на Тильде», и нажмите «Создать».
4. Прежде чем продолжить редактирование нашей страницы, давайте подключим персональный тариф, который предлагается бесплатно на 2 недели. Благодаря ему у нас будет доступ ко всему функционалу Тильды, а значит, мы сможем создать практически любую страницу. Для этого перейдите в раздел «Тарифы и оплата».
5. Выберите «Активировать» внизу».
6. Потом нам говорят, что все прошло успешно — тут просто нажимаем «Продолжить».

Мы создали сайт и подключили Персональный Тариф. Теперь можно переходить к редактированию будущего веб-ресурса, подключению домена и т.д. Первым делом наполним наш сайт блоками, которые мы решили создать.

После того, как мы создали новый сайт, перед нами высветилось главное окно с доступными сайтами — в нашем случае это «Моя первая страница на Тильде». Приступим к ее редактированию — нажмите «Создать новую страницу».

• Здесь у нас есть доступ к широкому спектру различных шаблонов. По ходу статьи мы не будем на них останавливаться, вы можете увидеть их сами. С их помощью можно создать сайт на выбранную тематику всего за несколько шагов, но из этого выходят вполне типовые шаблонные решения. Поэтому будем создавать сайт с нуля через блок «Пустая страница».
• Сначала выберите «Все блоки».
• В появившемся меню нам доступны различные блоки. Каждый блок содержит необходимый для сайта контент, такой как изображение, описание проекта, преимущества и прочее. Нас интересует блок «Обложка», предназначенный для создания основного экрана. Когда вы его откроете, мы увидим много разных вариантов — например, возьмем блок под названием «CR19A».
• В результате перед нами предстанет выбранная главная страница. Давайте немного отредактируем его — в первую очередь изменим заголовок. Для этого щелкните по нему левой кнопкой мыши и измените текстовое описание. Обратите внимание на верхнее меню, появляющееся при выделении текста — в нем можно изменить стиль, цвет и размер шрифта, прикрепить ссылку и даже указать межстрочный интервал. Поиграйте с вариантами и найдите лучший вариант.
• Также изменим название кнопки — это происходит в разделе «Контент». Чтобы включить отображение этой кнопки, просто наведите указатель мыши на экран редактирования.
• Прокрутите вниз и введите название кнопки, например «Подробнее». Мы также добавляем ссылку, которая открывается при нажатии кнопки. Наконец, не забудьте нажать кнопку «Сохранить и закрыть».
• Также изменим цвет кнопки — это можно сделать в разделе «Настройки».
• Следующий шаг — нажать «Кнопки» и выбрать «Цвет фона». В результате появится цветная панель — она предназначена для изменения цвета. Например, возьмем бирюзовый, но можно указать любой другой.
• Вот так выглядит наша главная страница:
• Перейдем к следующему блоку – «Информация о компании». Создавать его мы будем уже с помощью окна редактора Null-Block, позволяющего расположить элементы блока как угодно. Чтобы добавить этот блок, внизу страницы воспользуйтесь опцией «Все блоки» и выберите «Нулевой блок».
• Блок создан, но пока он заполнен ненужной нам информацией. Отредактируем его — для этого воспользуемся опцией «Редактировать блок».
• Мы подошли к самому сердцу Тильды — окну редактирования с нулевыми блоками, где можно менять контент и настраивать его. Первым делом избавимся от старого контента — для этого выделите все объекты комбинацией клавиш «CTRL+A» и нажмите клавишу «Удалить». В результате блок будет пуст: 
• Так как мы решили рассказать о компании в этом блоке, нам необходимо создать соответствующий заголовок. Не будем долго думать и назовем его «О компании». Чтобы добавить заголовок, нажмите кнопку с плюсом в левом верхнем углу и выберите «Добавить текст».
• Введите заголовок («О компании») и нажмите кнопку «Настройки» в правом нижнем углу.
• Появившееся окно дает доступ к изменению текстового элемента. Установим верхнее положение по центру, укажем размер шрифта в строке «РАЗМЕР» и добавим толщину «ВЕС».
• Следующий шаг — написать что-нибудь о компании. Например, возьмем простой текст о рыбалке.
• Последний шаг — добавить фото, на котором виден дружный коллектив компании. Для этого нажмите на плюсик в правом верхнем углу и выберите «Добавить изображение».
• Размещаем блок справа от текста и увеличиваем его размер — просто нажимаем на него и перетаскиваем нижний левый ползунок. Таким же образом вы меняете ширину текстового блока. После этого переносим наше изображение в дополнительный блок:
• Наконец, нажмите «СОХРАНИТЬ», а затем «ЗАКРЫТЬ».
• Таким же образом добавим еще один блок, но не нулевой, а простой, из раздела «Контакты».
• Редактируем блок так же, как делали это в самом начале. Измените заголовок на «Наши контакты» и введите дополнительную информацию.
• Прозрачный! Наша страничка-визитка создана, осталось разместить ее в интернете. Для этого вверху нажмите «Опубликовать» и введите имя домена, например myfirstsiteki. Затем нажмите «Сохранить и продолжить».
• После этого нас попросят подтвердить электронную почту. Достаточно зайти на почту и найти письмо от Тильды. В случае с телефоном нажмите кнопку «Подтвердить телефон» и введите код из сообщения. Как только это будет сделано, страница будет опубликована и будет доступна по ссылке.