Создание сайтов на Тильде

Блоки Тильды

Интерфейс Тильды состоит из двух частей:


  1. Редактирование контента.
  2. Настройки блоков.

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


Блок настроек позволяет контролировать внешний вид всего информационного блока.

Основные настройки блока - это цвет его фона, размер отступов, все, что связано со шрифтом (размер, цвет, насыщенность), анимации, также небольшие возможности по SEO, например, Вы можете выбрать тег заголовка для того, чтобы поисковые системы лучше определяли Ваш сайт.

Также важной настройкой является возможность контроля кнопок. Для кнопки Вы можете не только указать ссылку, но еще и настроить ее внешний вид, в том числе и эффекты при наведении.


Для большинства блоков доступен выбор ширины этого блока. Вы можете выбрать ширину как 12 колонок, так и меньше, кроме того, можно использовать всю ширину экрана, 100%.

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


Также Тильда позволяет настроить анимацию появления информации в блоках. К сожалению, это функция недоступна на мобильных устройствах.

В Тильде доступны порядка 500 готовых блоков, которые разбиты на различные категории.

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


Некоторые обложки обладают функционалом, например, формой записи, слайдером или таймером.

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


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


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


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


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


Блок типа "Цитата" поможет выделить Вам цитату, также заголовок или любую важную мысль Вашего сайта.


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


Блок колонок позволит Вам структурировать информацию по вертикальным колонкам. Это могут быть две колонки, две колонки с заголовком, три, четыре, а также блоки с изображением и колонкой текста. Некоторые блоки являются полноэкранными. Также доступен слайдер с текстом и изображением. Кроме того, Вы найдете здесь таблицу.


Для визуального структурирования информации Вы может применять также блоки категории "Разделители". Это могут быть линии, черточки, различные иконки, цифры. Также есть интересные блоки, которые меняют цвет текста и фона по мере скроллинга сайта. И блоки, которые разделяют сайт фигурными границами.


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


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


Блок "Плитка и ссылки" помогает Вам структурировать информацию на одной странице, а также показывать ее при наведении на какую-нибудь картинку. Доступны различные варианты. Здесь Вы можете анонсировать какие-то свои продукты, делать переходы на другие страницы, разбивать информацию на колонки.


Блок "Подвал" используется для того, чтобы сделать нижнюю часть сайта, которая присутствует на всех страницах. В ней Вы можете указать контакты, ссылки на социальные сети, добавить кнопки для связи с Вами, указать адрес.

Блок "Видео" позволяет Вам вставлять на сайт видео с Youtube и Vimeo. Это может быть одно видео, либо кнопка, которая откроет видео во всплывающем окне. Также Вы можете вставлять любое HTML5 видео путем указания ссылки на него. При этом видео Вам придется заливать на отдельный хостинг. Некоторые видео могут располагаться в две колонки. Также Вам доступна возможность расположения теста и видео рядом, видео во всплывающем окне и видео на обложке сайта. Недавно в Тильде появилась возможность размещения на сайте Youtube-трансляции с комментариями.


Одним из часто используемых элементов на сайте являются кнопки. В Тильде доступен большой выбор кнопок и различных форм. Это могут быть просто кнопки, блок из двух или трех кнопок, формы подписки, формы приема данных как горизонтальные так и вертикальные, блок с анонсом и кнопкой. Также в Тильде имеется выбор из нескольких всплывающих форм. Это может быть форма подписки, форма с большим количеством полей, например, анкета или форма регистрации, или просто всплывающая информация с изображениями, текстом и кнопками "Поделиться" в социальные сети. Кроме того, есть возможность интегрировать формы с сервиса Typeform и зафиксировать ссылку на форму в верхнем углу. Также есть интересный блок, который позволяет скрывать часть контента на сайте до нажатия кнопки. После нажатия на кнопку текст не изменится и блок раскроется. Если Вы на сайте размещаете ссылки на мобильные приложения, в Тильде есть для этого специальный блок с ссылками. Если Вам требуется сделать ссылку на скачиваемый файл, Вы можете также использовать специальные кнопки, в том числе с указанием формата файла. В Тильде также доступны кнопки для быстрой связи пользователей сайта с Вами. На компьютере эти кнопки вызывают специальные формы, например, форму для заказа обратного звонка или форму сообщения, а на мобильном телефоне они автоматически запускают звонок на Ваш номер. В Тильде есть возможность также реализовать различные голосования. Это могут быть пошаговые формы или простой тест.


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


Блоки категории "Команда" позволят Вам показать на сайте свою команду. Также они представлены в нескольких видах. Есть горизонтальные списки, вертикальные списки, блоки во всю ширину сайта.


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


Если Вы делаете сайт для какого-либо мероприятия или у Вас есть спортивный центр, Вы можете добавить на сайт расписание. Оно также доступно в нескольких видах.


Чтобы показать на сайте различные этапы производства или оказания услуги, Вы можете использовать блок "Этапы". Он позволяет добавлять Вам несколько шагов для достижения цели. Если Вы используете больше четырех этапов, то лучше использовать вертикальные блоки этапов, если до четырех - то горизонтальные. Также Вы можете использовать иконки, цифры или просто буллеты.


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


Блоки категории "Услуги" позволит рассказать Вам, чем занимается компания. Это могут быть тексты с заголовками и изображениями, тексты с иконками, доступные в различных видах, а также раскрывающиеся блоки, которые показывают информацию при наведении на них.


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


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


Чтобы показать список партнеров или клиентов компании, Вы можете использовать блоки категории "Партнеры". Это может быть список иконок, к каждой из которых Вы можете добавить ссылку на сайт партнера или ссылку на страницу своего сайта, а также Вы можете использовать слайдеры из нескольких блоков и вертикальные списки.

Также Вам доступны блоки категории "Другое", которые помогут Вам реализовать различные дополнительные возможности Тильды, которые позволяют сделать сайт более живым, интересным и более функциональным.
Например, блок "html" позволит Вам добавить на сайт любой внешний виджет. При этом Вы его можете использовать как непосредственно на странице, так и во всплывающем окне.
Блок "Якорная ссылка" позволит Вам сделать якорные ссылки внутри сайта.
Блок "Плавный скролл" позволяет применить красивый эффект плавного скролла до нужного места на сайте.
В любом месте Вы можете также вставить карту Google или Яндекс, добавить на ссылка всплывающие подсказки, например, когда Вам нужно пояснить какое-то слово. Популярным сейчас эффектом является ползунок, показывающий процесс скроллинга страницы, меняющий свои размеры в зависимости от скроллинга.
Также Вы можете показать эффект загрузки страницы.
Вы можете создавать эффект печатной машинки.
Также есть возможность установить фиксированный фон.
Также Вам доступны блоки с различными триггерами, например, поп-ап, появляющийся при закрытии вкладки сайта, или появляющийся через некоторое время после загрузки сайта.
Имеются различные блоки для уведомления пользователей сайта о сборе персональных данных и куки, предупреждений о возрастном ограничении, а также переадресовать страницу на другую ссылку.
Ближе к Новому году можно использовать блок, который добавит снег на Ваш сайт.
Alias блок является очень важным блоком, потому что он позволяет использовать один и тот же блок в разных места одной страницы или на разных страницах без необходимости дублировать этот блок вновь и вновь. В таком случае информацию этого блока можно менять лишь в одном месте, в остальных местах информация изменится автоматически. Также доступны различные виджеты. Можно добавить поиск по сайту, в том числе через виджет Google.


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


В этой статье:

  • мы познакомились с интерфейсом Тильды,
  • рассмотрели, какие блоки в ней можно использовать.

Таким образом, в Тильде содержится большое количество различных видов блоков, скомбинировав которые, Вы можете создать сайт любой сложности.
2021-04-18 09:51 Обзор Тильды