В этой статье вы узнаете секреты сервиса Tilda, которые непременно сделают ваш сайт лучше!
Если вы дизайнер, то, возможно, вы откроете для себя новую планету и скажите: «А что, можно было так?»
Если же вы заказчик сайта на Tilda, то после прочтения статьи ваш подрядчик не сможет вас обмануть и сказать: «В тильде так сделать нельзя, это невозможно и т. д.». Вы, в свою очередь, сможете дать ссылку на нашу статью, чтобы исполнитель тоже знал эти фишки и учёл ваши пожелания.
Также у нас есть другая классная ознакомительная статья про Tilda — изучите её по этой ссылке.
А теперь к сути:
1. 404 страница
Начнём с того, что не все дизайнеры знают о том, что 404 страница в принципе нужна, а о том, как её сделать в Tilda, знают единицы. А ведь она имеет очень важное значение для SEO-оптимизации.
Конечно, большинство сайтов на Tilda не заточены и не разрабатываются для продвижения в поиске. Тем не менее, даже если сайт предназначен для рекламы или в каких-либо других целях, 404 страница никогда не будет лишней, а её создание не займёт много времени (впрочем при желании можно заморочится и сделать «WOW-дизайн»).
Как сделать:
1) Создайте новую страницу сайта, назовите её «404» или другим именем на ваше усмотрение:
Обратите внимание, что URL (ссылка) 404 страницы не должна содержать число 404. Об этом вам сообщит сервис. Назовите страницу по-другому: «oshibka», «empty_page», «error» и т. д.
2) Создайте дизайн страницы:
Важно! Большинство дизайнеров и маркетологов делают 404 страницу с обычной надписью по типу: «Такой страницы не существует». Посетитель такой страницы с большой вероятностью покинет её. Чтобы этого не произошло, разместите на 404 странице кнопку (кнопки) на другую страницу (страницы) сайта и призыв нажать на них. Так хотя бы часть трафика вы «задержите» на вашем сайте.
3) Обозначьте созданную страницу как 404 в настройках сайта.
Перейдите на вкладку «Ещё» и найдите пункт «Страница: 404 ошибка» (он находится вверху списка, найти его не составит проблемы). Далее выберите из выпадающего списка созданную страницу.
Готово! осталось только сохранить изменения:
2. Метка «Made on Tilda» внизу страницы
Многих данная метка не смущает. Но, если вы не хотите лишний раз рекламировать сервис или вы, например, продвигаетесь в регионе, где не приветствуются российские сервисы, то метку можно убрать:
Как сделать:
Перейдите в настройки сайта в раздел «Ещё», вверху списка настроек найдите пункт «Platform Label», в выпадающем списке выберите «Не выводить»:
Важно! Метку можно убрать только, если у вас платная подписка на Tilda.
3. Наложение блоков
Вы могли видеть на на модных сайтах на Tilda приём, когда элементы одного блока налазят на элементы другого блока. Таким образом создаётся эффект многослойности:
Как сделать:
1. Создайте Zero-блок с выходящими за его холст (рамки) элементами:
2. Перейдите в настройки всего блока (кликните на свободное пространство или на фон холста), проскрольте до раздела настроек «Position and Overflow». В пункте «Overflow» выберите «Visible» из выпадающего списка:
Теперь блок будет выше других:
Если будет установлен параметр «Hidden» или «Auto», то блок будет выглядеть так:
4. Единые шапка и подвал (хеадер и футер) для всех страниц
Часто новички создают много страниц, у которых одинаковые шапка и футер. Т. е. блоки шапки и подвала есть на каждой из страниц. И когда нужно внести в них правки, то дизайнеру/разработчику нужно пройтись отдельно по каждой странице.
Как вариант, можно сделать правки в блоке (блоках) на одной странице, а дальше просто скопировать и вставить его (их) на остальные страницы.
Но этой лишней траты времени можно избежать!
Как сделать:
1. Создайте отдельные страницы с шапкой и с футером
2. Зайдите в настройки сайта в раздел «Шапка и подвал», выберите созданные страницы в качестве шапки и футера:
Не забудьте потом убрать блоки с шапкой и футером внутри страниц, чтобы они не дублировались.
Обратите внимание, что единые шапка и подвал отображаются отдельно в конце списка страниц сайта:
5. Блоки для мобайла и десктопа
Иногда бывает так, что получившийся блок хорошо выглядит на десктопе, но плохо отображается на мобайле. Обычно такая проблема возникает со стандартными готовыми блоками — например с шапками.
Решается данная проблема легко: нужно ограничить отображения блока.
Как сделать:
1. Создайте блок, настройте его дизайн для десктопа.
Например, с помощью стандартного готового блока можно создать такую шапку:
Шапка на десктопе выглядит хорошо, но её отображение на мобайле оставляет желать лучшего ввиду небольшого размера логотипа:
2. Ограничьте отображение шапки, чтобы она была видна только на экранах с разрешением от 980px.
Перейдите в настройки блока и проскролльте до пункта «Диапозон видимости на устройствах», воспользуйтесь ползунками:
3. Скопируйте блок, подкорректируйте дизайн под мобильную версию и поправьте диапазон видимости для мобильных устройств (в примере до 980px):
6. Конвертация в Zero-блок
Если в Tilda уже есть готовый блок, который вам нравится, но который нужно немного изменить (а стандартные настройки это не позволяют), то его можно сконвертировать в Zero и внести необходимые правки.
Но есть нюансы:
- Конвертировать можно не все блоки. Большинство интерактивных блоков (поп-апы, галереи карточек и т. д.) нельзя превратить в Zero. Проверяйте такую возможность у каждого конкретного блока!
- Если вы наполнили готовый блок контентом и внесли настройки дизайна, то при конвертации в Zero, он вернётся в свой первоначальный вид и загруженный контент «слетит».
Как сделать:
Выберите готовый блок, перейдите в его настройки, проскрольте до кнопки «Конвертировать в Zero Block» и нажмите на неё:
На этом на сегодня всё. Используйте перечисленные фишки, чтобы оптимизировать и ускорить разработку сайта на Tilda.
Не переживайте, если вы чего-то раньше не знали. По нашим наблюдениям даже самые опытные разработчики сайтов на Tilda не всегда знают все её возможности и делают ошибки при создании сайта.
Надеемся, что статья оказалась для вас полезной. А, если вам нужна помощь в разработке сайта на Tilda, то мы будем рады помочь. Оставьте ваши контакты — и мы свяжемся с вами :)
>> Хочу консультацию! <<
