Как зафиксировать шапку в тильде
Как сделать меню для многостраничного сайта в Tilda
Настройка внутренних и внешних ссылок, переключение языков и мобильная версия.
Практически ни один сайт не обходится без главного меню, которое помогает пользователю искать нужную информацию. Поэтому верстальщику на Tilda важно уметь его правильно спроектировать и настроить, чтобы меню выполняло свою функцию.
Рассказываем, как с помощью инструментов Tilda сделать и настроить полноценное меню для вашего сайта.
Подготовка главной страницы
Чтобы правильно настроить меню, сначала создадим страницу и несколько стандартных блоков.
Как создать страницу с базовыми блоками
Страница готова. Теперь нужно её минимально настроить, чтобы будущее меню работало:
1. В правом верхнем углу нажмите на кнопку « Настройки».
2. Дайте название страницы и укажите её URL. Например, « Атриксис» и index.
Если на вашем сайте только одна страница, она по умолчанию будет главной — около неё появится иконка с 
. В таком случае достаточно указать только имя.
3. Нажмите кнопку « Сохранить».
Веб-дизайнер. Помогаю бизнесу создавать эффектные и удобные сайты на Tilda.
Как создать меню на главной странице
1. Нажмите на чёрную кнопку « Все блоки» и выберите подходящее меню в соответствующей вкладке. Например, МЕ201. Если меню появилось не вверху страницы, переместить его можно с помощью стрелки ↑.
Если вы знаете номер конкретного блока и не хотите долго искать его по категориям, его можно ввести в поиск в левом верхнем углу библиотеки блоков.
2. Наведите курсор на ваше меню и нажмите кнопку « Контент».
3. В появившемся окне откройте « Список пунктов меню» и укажите названия ваших блоков из главной страницы. Чтобы пунктов было больше трёх, нажмите на кнопку « Добавить пункты меню».
4. Если вам нужно поменять пункты меню местами, зажмите правой кнопкой мыши иконку 
и тяните её вверх или вниз.
5. Нажмите кнопку « Сохранить и закрыть».
Чтобы меню работало, нужно привязать каждый пункт к конкретному блоку:
Пункт « Блог» будет вести на отдельную страницу, поэтому пока ничего здесь не выбирайте.
Как сделать переход на другую страницу
Если на вашем сайте есть отдельная страница блога, важно добавить на неё ссылку в меню, иначе её никто не найдёт.
Чтобы научиться это делать, создайте ещё одну страницу на сайте:
Вернитесь на главную и откройте редактор меню. В строке « Блог» нажмите « Выбрать страницу», укажите свою страницу с блогом и сохраните её.
Обратите внимание на разный синтаксис. Если ссылка из меню ведёт на блок внутри той же страницы, она прописана через хештег — #rec. Если на другую страницу, то через слеш — /blog.
Ссылку на другую страницу можно указать самостоятельно — просто напишите её адрес в соответствующем поле. Но в таком случае не нужно указывать её полный путь, иначе при смене доменного имени этот пункт работать не будет. Например, вместо mywebsite.com/blog нужно указать просто /blog.
Как поставить одно меню на все страницы
Если у вас многостраничный сайт, то лучше сделать меню на отдельной странице и прикрепить его ко всем остальным. Тогда все изменения в меню будут автоматически применяться везде и вам не придётся постоянно всё корректировать.
Как привязать меню сразу ко всем страницам
Теперь в самом низу списка страниц сайта появился отдельный блок « Шапка и подвал», где лежит ваше меню. Его можно отредактировать в любой момент:
Если нужно сделать так, чтобы это меню не отображалось на какой-то конкретной странице, то можно её отключить.
Как настроить меню для многоязычного сайта
Если вы планируете делать сайт на двух языках, то нужно установить специальное меню, чтобы пользователи могли самостоятельно переключаться между разными версиями.
Меню, которые поддерживают смену языков: ME204, ME301, ME302, ME303, ME304, ME401, ME402, ME403.
Чтобы не перевёрстывать страницу под нужный язык, сделайте её дубликат и затем просто перепишите текст:
Такой метод подойдёт для одностраничного сайта, так как вы будете переключаться между разными страницами. Для многостраничного сайта лучше сделать разные версии на разных доменах:
Как настроить сокращённое мобильное меню
Если вам не нравится, как выглядит стандартная мобилизация вашего меню, то его можно заменить. Например, можно сделать, чтобы в десктопной версии стояло меню ME204, а на мобильных экранах — ME401.
В Tilda есть возможность показывать блоки на экранах определённой ширины, а на других скрывать. С помощью этой особенности и нужно настроить дополнительное мобильное меню.
Теперь на телефонах и планшетах будет отображаться меню ME401, а на больших мониторах — меню ME204.
Важно поставить одинаковые значения «от» и «до», чтобы на всех разрешениях экрана всегда отображалось нужное вам меню.
Работа с обложкой
Посмотрите видеоурок о том, как работать с обложкой страницы или прочитайте подробную инструкцию ниже.
Обложка — первое, что человек видит на странице. Обложка сообщает, о чем материал, и побуждает его прочесть или сообщает уникальную ценность продукта, емко объясняет, почему он интересен. Чаще всего обложка содержит фоновое изображение — это может быть стильная фотография, атмосферное видео, просто цвет, иллюстрация или градиент, текстура.
Существует несколько вещей, которые нужно знать, чтобы правильно работать с обложками и фоновыми изображениями и видео.
Видимая часть браузера
Оптимальный размер изображения для фона:
Формат: jpg
Размер по ширине: 1680 px
Кол-во точек на дюйм: 72 dpi
Цветовая модель: RGB
Степень сжатия: 10
Текст — это самая важная часть обложки, так как это первое сообщение, которое увидит посетитель сайта. Для донесения сообщения и расстановки акцентов в обложках есть заголовок, подзаголовок, описание и надзаголовок.
Наполнить обложки текстом можно двумя способами: с помощью панели «Контент» блока и при клике на текст на странице редактирования страницы.
Узкая обложка — это обложка по высоте не 100%, а около 60 или 70%. В этом случае у обложки скорее утилитарная, чем имиджевая функция, ведь акцент смещается на информацию, которая следует за ней.
Для создания таких обложек в настройках блока есть параметр «В ысота ». Задавать высоту можно либо в пикселях (например, 400px), либо в процентах от высоты экрана (vh, 1vh равен 1% области просмотра экрана). Задавать высоту в vh предпочтительнее.
 |  |
 |  |
Градиент и заливка цветом
 |  |
 |  |
С помощью онлайн-конвертеров вы можете создать видео в формате webm и mpeg4 и разместить его либо у себя на хостинге, либо на хостинге конвертера.
Заходите во Контент обложки и вставляете в нужные поля ссылку на ваш ролик в обоих форматах.
Видео в обложке не работает в мобильной версии
Следует помнить, что из-за особенностей операционных систем в мобильных браузерах, фоновое видео не будет воспроизводиться — это связано со стоящими в системах запретами на автоплейное видео. Если на вашем сайте есть фоновое видео в обложке, не забудьте загрузить картинку (вкладка Контент). Она будет отображаться, если видео воспроизвести невозможно, то есть при просмотре на телефонах или планшетах.
Как сделать боковое (вертикальное) меню на Tilda?
Если у Вас есть какие-то вопросы касательно конструктора Тильда – Вы можете задавать их в комментариях. Либо я на него отвечу, либо пришлю ссылку, если на эту тему уже есть видео.
Также очень рекомендую посмотреть другие ролики по конструктору Тильда, потому что у него очень обширный функционал и может быть, есть какие-то функции о которых Вы ранее не знали.
Еще раз напоминаю, что я веду курсы по маркетингу и интернет-маркетингу, есть курс по созданию сайта на Тильде с его последующим продвижением в интернете, то есть получение лидов, заявок, продаж и так далее. При условии, что у Вас есть какой-то проект, стартап, направление, которые Вы хотите запустить.
Недавно я прошла курс по digital marketing у Алексея Чеснокова. Если бы мне два месяца назад сказали, что я сделаю сайт или чат-бота, я бы посмеялась. На данный момент, появилась уверенность в своих силах, а самое главное интерес (даже жаль, что курс закончился) 🙂 Мне очень понравилось делать чат-бота, похоже изнутри на нейросоединения, а когда все работает, то чувство радости и удовлетворения от проделанной работы. Также тема E-mail рассылки, очень интересная и актуальная.
И конечно сделать полноценный сайт-визитку со всеми формами, ссылками, калькулятором, это вообще целая интересная история. Могу сказать, что было не легко с нуля все это делать и если бы не Алексей, то скорее всего оставила затею с интернет-маркетингом. Хочу поблагодарить Алексея прежде всего за полученные знания, которые однозначно пригодятся в дальнейшем, за его настойчивость, строгость, и чувство юмора:) Мой мозг начал работать в нестандартном для него режиме, удивляя самого себя.
Прошёл курс Алексея Чеснокова по обучению интернет-маркетингу. Получил много нужной и полезной информации, приобрёл необходимые навыки. А самое главное, сразу, в процессе обучения применил их на практике, в своём деле, создавая и оптимизируя сайт, подготавливая и осуществляя рассылки, контекстную рекламу. Было очень интересно. Занятия проходили динамично и за время обучения мы смогли не только в полном объёме получить и применить знания по Тильде, Сенд-пульсу, SEO и контекстной рекламе в Яндексе, но и дополнительно прослушать лекцию о продвижении на Ютуб. Если честно, очень хотелось бы ещё про продвижение в Инстаграм узнать (это очень модное и, как говорят, эффективное направление), но программа курса этого не предусматривала…
Безусловно, рекомендую курсы Алексея (как вэбинарные, так и в записях на Ютуб) прежде всего, тем, кто только осваивает интернет-маркетинг. Он делает это очень доходчиво и терпеливо. Но и искушённые маркетологи, думаю, почерпнут для себя много нового и актуального из его уроков, т.к. интернет-сфера меняется очень быстро, а Алексей стремиться идти в ногу со временем и все изменения и новшества сразу старается отразить в своих занятиях. Спасибо большое, Алексей, за полученные знания и навыки! Успехов Вам в таком нужном и благородном деле просветительства и обучения самостоятельной творческой деятельности в интернете!
Как закрепить шапку сайта в Tilda? | Header
Как настроить шапку и подвал для сайта на ТильдеПодробнее
Как сделать Шапку (header) сайта, сквозное меню (меню на все страницы)? | Тильда Конструктор СайтовПодробнее
Фиксированное меню в zero block tildaПодробнее
Как зафиксировать шапку сайта при скролле с помощью CSSПодробнее
Как сделать шапку и подвал для сайта на Тильде | Часть 1. Интернет-магазин обоевПодробнее
Как сделать сквозную Шапку (Header или Хедер) и Подвал (Footer или Футер) в ТильдеПодробнее
Tilda. МЕНЮ САЙТА НА ТИЛЬДЕ | мобильное меню тильдаПодробнее
Меню на все страницы сайта Tilda | создание header для всего сайта на ТильдеПодробнее
Как отключить шапку (header, хедер) на отдельной странице сайта? | Тильда Конструктор СайтовПодробнее
Кастомная шапка с мобильной версией в тильдеПодробнее
Как сделать фиксированное закрепленное меню при прокрутке страницы? | ТильдаПодробнее
КАК ДОБАВИТЬ КОРЗИНУ В МЕНЮ НА ТИЛЬДА? Иконка корзины в шапке сайта на Тильда через zero block.Подробнее
Новый способ резиновой верстки в TildaПодробнее
как зафиксировать меню в тильде zero blockПодробнее
Простая фиксированная шапка сайта при прокруткеПодробнее
Как зафиксировать шапку в тильде
Tilda Publishing запись закреплена
Отдельные шапка и подвал для страниц товаров
Для страниц товаров в интернет-магазине на Тильде можно настроить отдельные хедер и футер в Каталоге.
Шапка (header) и подвал (footer) для товаров — это блоки, которые показываются на всех страницах товаров до и после карточки. Иногда необходимо, чтобы хедер и футер страницы с товаром отличались от блоков на главной странице по дизайну и содержанию.
В хедер, например, можно добавить кнопку «Назад» или меню, которое будет отличаться от основного. В футере можно добавить условия доставки и оплаты, информацию по уходу за изделиями, призыв к действию или другую полезную для пользователя информацию.
Как это сделать?
1. Создайте отдельные страницы для шапки и подвала, добавьте в них нужные блоки и информацию
2. Перейдите в Каталог > Настройки > Шапка и подвал
3. Назначьте ранее созданные страницы в качестве хедера и футера
4. Установите галочку в поле «Открывать страницу вместо поп-апа»
Поделитесь идеями, какую информацию вы бы добавили в шапку и подвал на страницу с товаром? 
Шапка (header) и подвал (footer) для товаров — это блоки, которые показываются на всех страницах товаров до и после карточки. Иногда необходимо, чтобы хедер и футер страницы с товаром отличались от блоков на главной странице по дизайну и содержанию.
В хедер, например, можно добавить кнопку «Назад» или меню, которое будет отличаться от основного. В футере можно добавить условия доставки и оплаты, информацию по уходу за изделиями, призыв к действию или другую полезную для пользователя информацию.
🌸 Как это сделать?
1. Создайте отдельные страницы для шапки и подвала, добавьте в них нужные блоки и информацию
2. Перейдите в Каталог > Настройки > Шапка и подвал
3. Назначьте ранее созданные страницы в качестве хедера и футера
4. Установите галочку в поле «Открывать страницу вместо поп-апа»