Центр поддержки
Получите ценные советы и руководства от наших экспертов.
Популярные ключевые слова:

Как создать многостраничный сайт на Тильде

Avatar
Куратор раздела: Николай
Последнее обновление 13 сентября 2020 г.

Создать многостраничный сайт на Тильде легко, но обслуживать его без знания определенных тонкостей — сложно. Мы расскажем вам, как настроить систему так, чтобы потом не пришлось переделывать.

Мы работали с самыми разными ресурсами, выполненными на Tilda, но все их объединяло одно — клиенты жаловались на сложность обновления информации на десяти и более страницах. На вопрос «В чем возникает сложность?» они отвечали: «Ссылки приходится постоянно прописывать в меню», «блоки копировать, а потом менять в двадцати местах одну акцию». 

Откуда берется проблема? Клиенты не используют Header (Верх сайта с меню), Footer (Подвал со ссылками, контактами), Alias (Алиас-блок), Потоки и Списки страниц.

Шапка и подвал в Tilda

Все многостраничные веб-сайты объединяет наличие повторяющихся шапки-хедера, меню и подвала-футера (блока в нижней части страницы). При создании одностраничников на Тильде редко кто задумывается о дальнейшем расширении. Нужна страничка — скопировали. Пришёл контент-менеджер, увидел, как делают другие и тоже взялся копировать. А что делать, когда понадобится что-то удалить или заменить? Вы потратите уйму времени на ручные исправления. Вместо этого логичнее и проще с самого начала выстроить всю систему правильно.

Если блок повторяется (например, на всех веб-страницах есть одинаковый верх-header) — он должен быть вынесен на отдельную страницу.

Создаем Header в Tilda

Собрали блок — и на отдельную страницу. 

Копируем блок шапки в тильде

Так же и с футером. Называйте их как угодно, это не важно. Адреса им тоже указывать не надо.

Копируем блок подвала в тильде

Теперь переходите в настройки сайта и выбирайте «Шапка и подвал». У вас в пунктах «Назначить шапку» и «Назначить подвал» будет «Не выбрано». Исправьте этот пункт, выбрав имена созданных страничек.

Назначаем footer и header в тильде

В списке материалов появится следующая картина:

footer и header в списке страниц тильды

Теперь нет необходимости создавать меню, прописывать ссылки, менять логотип на каждой веб-странице. Система все сделает автоматически. Но бывает так, что на главной странице Header один, на внутренних — другой. В этом случае в настройках нужной странички вы выбираете пункт на вкладке «Дополнительно» — Не использовать шапку.

Не использовать шапку на этой странице тильды

С верхней и нижней частями разобрались, двигаемся дальше.

Alias, алиас-блок в Тильде

Алиас в Tilda используется в значении «ссылка на блок-оригинал с другой страницы». Обычно это требуется при повторении блоков на нескольких страницах. Часто это происходит с формами обратной связи, призывами купить, ссылками на каталог, акциями и разнообразными zero block.

алиас-блок в тильде

Если на одной страничке такой блок уже есть, то на второй его делать НЕ НУЖНО.

Вы просто вставляете Alias-блок:

Вставка alias-блока в тильде

И на вкладке контент вставляете ID блока-оригинала:

Настройка alias-блока в тильде

Идентификатор блока в Тильде можно найти в окне настроек:

Где найти ID блока в тильде

Теперь, когда появляется необходимость скопировать без изменений акцию или форму — вставляйте алиас-блок. А если нужно изменить содержимое, то меняете его на главном блоке-оригинале и все копии изменятся автоматически, хоть в ста местах. Не забудьте опубликовать изменения.

Потоки, списки страниц, интернет-магазин

С расширением одностраничника владельцу ресурса, контент-менеджеру или сеошнику сразу хочется перелинковки — чтобы в каком-то месте появились ссылки на «похожие услуги», «рекомендуемые статьи» и т.д.

Перелинковка в тильде

Это можно сделать вручную, но лучше использовать автоматический Список страниц.

Списки страниц в тильде

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

Настройка блока Список страниц в тильде

Картинка, отображающаяся в списке, меняется в настройках интернет-страницы, на вкладке Бейджик:

Загрузка бейджика в тильде

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

Если вы планируете вести блог или список новостей, то следует использовать Потоки. Это относительно новая функция, которая позволяет увеличить «многостраничность» и приблизить Tilda к полноценной CMS.

Потоки и товары в тильде

Главный экран потоков

Список элементов потока в тильде

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

Добавление потока на страницу в тильде

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

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

Список товаров в тильде

Скрипты и стили

Разработчики и контент-менеджеры балуются тем, что добавляют различные стили оформления CSS и JS-скрипты прямиком в HTML-блок внутри страницы. Это можно понять, когда интернет-страница одна. Потом пользователь привыкает к желтому окошечку.

HTML-код для стилей и скриптов в тильде

А потом кто-то решает копировать страницы и сделать многостраничник. Что происходит? Все забывают этот «костыль». Код HTML-блока кочует из одного места в другое, и обычно именно там пишется необходимый код для шапки, подвала или адаптивности в целом. Убрать его просто нельзя.

Его необходимо перенести в настройки веб-сайта, вкладка Еще.

HTML-КОД ДЛЯ ВСТАВКИ ВНУТРЬ HEAD и ПОЛЬЗОВАТЕЛЬСКИЕ CSS-СТИЛИ.

HTML-КОД ДЛЯ ВСТАВКИ ВНУТРЬ HEAD и ПОЛЬЗОВАТЕЛЬСКИЕ CSS-СТИЛИ

Подытожим все рекомендации по теме, как создать многостраничный сайт на Тильде:

  1. Создавать Header и Footer
  2. Использовать Alias-блок
  3. Где необходимо, вставлять Списки страниц
  4. Новости, статьи и портфолио публиковать через Потоки
  5. Товары заполнять через Интернет-магазин
  6. Скрипты и стили добавлять сразу в настройки сайта

Если вы что-то не поняли и вам сложно разобраться, то мы можем взять часть работы на себя или сделать вам полноценный сайт на Tilda.

  • Пишите нам
  • Звоните
    8 902 579 86 90
Написать в поддержку
Icon