Как сделать карту сайта на тильде

Добавил пользователь Евгений Кузнецов
Обновлено: 04.10.2024

Сделал карту в Яндексе, как встроить на сайт Тильды? Либо, где можно сделать интерактивную карту и встроить в конструктор?

Доброго дня. на картах в яндексе нажать 3 точки -> поделиться -> скопировать виджет

в тильде выбираем zeroblock -> создать html -> вставить виджет яндекса.

Привет. Используйте фрейм html из раздела "Разное". Подгоните фрейм под размер карты (в настройках) и вуа-ля! Карта должна работать. Естественно, только в zero-блоке. Либо стандартным блоком с картами, вставьте ключ карты, которую создали. Он ее подтянет. Напомню, что Яндекс дает возможность использовать бесплатную карту только во внекоммерческое использование. Если. Читать далее

Не часто приходится замечать решения предложенные на платформе Tilda, а зря. Почему так? Что такое вообще Tilda и для кого она?

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

Если говорить коротко - это конструктор сайтов, который приобрел большую популярность в последние годы на территории России и стран СНГ в частности. Конечно, основной офер компании заключается в том, что любой новичок никогда до этого не имеющий опыта в web- разработке и в целом digital, сможет сделать для себя или своего небольшого начинания посадочную страницу. Казалось бы, причем тут вообще могут быть агентства или студии? Давайте разбираться.

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

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

Что чаще всего приходится слышать про Тильду?

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

Тогда скорее всего вы общаетесь с командой, которая работает только на этой платформе или же с непрофессионалом.

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

Рассмотрим параллельно 2 ситуации, которые могут показаться разными, но по факту объединены одним и тем же.
1. Заказчик не имеет серьезного бюджета, но ему срочно необходим небольшой сайт для мероприятия, которое стартует уже в конце недели.
2. Заказчик имеет серьезный бюджет, но у него отсутствуют амбициозные задачи и в целом планы на будущий сайт. Сроки не превышают 14 дней, но для простоты понимания давайте приведем также к 7 дням.

Задача

По факту перед нами стоит задача, как сделать симпатичный MVP-проект, в срок не превышающий 7 дней.

День 1. Подбор референсов и обсуждение проекта

Для экономии времени и ресурсов приступаем к аналитике, но акцентируем внимание только на самых важных моментах, а именно:

какова будет общая концепция продукта;

какие есть конкуренты и что они из себя представляют;

Что нравится целевой аудитории;

что из референсов может лучше всего подойти.

Конец дня ознаменовывается обсуждением выбранных решений с заказчиками. На каждый из этапов тратим примерно по 2 часа.

День 2. Прототипирование

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

День 3-4. Дизайн

На данном этапе делаем акцент, выделяя под него 2 суток. Так как он является самым основным в рамках работы на Тильде. Определяемся с 3 наиболее интересными и продуманными работами в данной нише, предварительно все это согласовав с заказчиками. Первый день занимает подбор и поиск будущих элементов сайта, а именно:

иные визуальные элементы, которые нельзя отнести к чему-то конкретному, но от этого они не становятся менее важными

Все должно быть объединено общей идей, сочетаться между собой, что также отсылает нас к проработке первичной логики по которой уже идет дальнейший отбор элементов. На чем первый день удачно заканчивается. Собрав бэкграунд элементов, вспоминаем о тех исходных работах, которые мы взяли, как ориентир. После чего объединяем удачные идеи этих сайтов с теми элементами, что мы нашли, находясь в свободном плавании на ресурсах для дизайнеров.

День 5. Верстка

Верстка на Тильде представляет из себя работу в zero-block’ах, что значительно упрощает нашу задачу. Другими словами, если вам когда-то приходилось сталкиваться с Powerpoint/Photoshop и т.д., то вы без труда сможете представить сложность при работе с данным инструментом. Как правило все завязано на интуитивно понятном интерфейсе и функционале. В целом вся верстка - это своеобразный конструктор где единственное, что остается делать это переносить элементы с прототипа и двигать их в соответствии с дизайном. Но не стоит забывать, что некоторый пулл-задач не получится решить при помощи zero-block’ов, что отсылает нас обратиться за помощью к верстальщику для добавления сложного элемента на сайт. Как правило такие задачи составляют менее 5% от общего числа.

День 6. Подключение домена

День 7. Видео инструкции и обучение заказчика

Не забываем, что каждый должен заниматься своим делом. Дизайнер - рисовать, предприниматель - развивать свое дело. Исходя из этой логики стараемся экономить время заказчиков и не заставляем самостоятельно разбираться в том, что им возможно даже не нужно.

Для этого записываем видеоинструкции:

как добавлять контент;

Как редактировать текст и менять изображения;

Как пользоваться панелью администратора

Где они уже самостоятельно сможет все настроить, повторяя шаги из видео.

Вывод

Тильда - это отличный инструмент для вашего бизнеса если вы:

самозанятые или у вас небольшой стартап, когда нет уверенности в бизнес-модели;

когда все, что требуется от сайта - это продавать или демонстрировать портфолио.

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

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

огромное количество подсказок, дружелюбный и интуитивно понятный интерфейс, пошаговые руководства – все это позволяет с легкостью создать сайт, не путаясь и не ошибаясь;

в Tilda множество шаблонов для ресурсов самой разной направленности: визиток, магазинов, лендингов.

Стоимость Tilda

Тариф Free

тариф Free не предполагает собственного доменного имени. Сайт разместится на поддомене, его имя будет выглядеть так: .tilda.ws. С одной стороны, на пользовательский опыт это не влияет, потому что большинство все равно переходит на сайт из контекстной рекламы или из поиска. С другой стороны, собственное доменное имя людям проще запомнить, да и доверия такие названия вызывают больше;

Тариф Personal

Тариф Business

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

создать до 5 сайтов;

экспортировать и скачать код на собственный сервер;

интегрировать сайт с WordPress.

Впрочем, в большинстве случаев такие возможности просто не нужны. Как минимум по цене, которую требует Tilda: 1000 рублей в месяц, 12 000 в год. За эти деньги проще воспользоваться CMS с открытым кодом.

Если бесплатный вариант подходит для фрилансеров, а тариф Personal – для авторов блогов, представителей e-commerce и малого бизнеса, то тарифный план Business не рекомендуется практически никому. Специалисты, которым может потребоваться такая функциональность, скорее воспользуются более дешевыми вариантами – движками и хостингами.

Планирование сайта

Для тех, кто не уверен в себе или не хочет тратить время, есть и другой вариант – использование шаблонов. Уже готовые страницы понадобится только заполнить собственным контентом. Но выделиться не получится: шаблоны используют сотни пользователей.

Результаты планирования. По итогам мозгового штурма у вас должны быть на руках сведения:

о цели и желаемой функциональности сайта;

внешнем виде и дизайне отдельных страниц.

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

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

Базовые настройки сайта на Tilda

Business неоправданно дорог, а Free для использования многих функций недостаточно, поэтому Personal – оптимальный вариант. Первые две недели – триал-версия, которая предоставляется бесплатно.

Дальше понадобится создать и настроить ресурс:

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

1. Подключение счетчиков

Первый вариант – зарегистрировать доменное имя в этих системах, получить коды счетчиков и вписать их в соответствующее поле в настройках Tilda. В Яндексе это делается так.

В Google Analytics – так.

Аналогичным образом это делается для Google Analytics. Сначала зарегистрируйтесь в сервисе.

Выберите подходящий счетчик.

2. Подключение вебмастерских панелей

Без этих инструментов отслеживать SEO-параметры и управлять продвижением намного сложнее, так что подключить их нужно.

Подключение платного домена к Tilda

Если вы выбрали вариант с собственным доменным именем, вам для начала понадобится его зарегистрировать, это делается на стороннем ресурсе, одном из многочисленных сайтов-регистраторов.

Как подключить домен к Tilda

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

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

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

Исходные данные

Разработка сайта проводилась с конца августа по октябрь 2019 года. Дополнительно около недели проводили дебагинг и работу по исправлению найденных ошибок. Над проектом работал один дизайнер и два маркетолога. Общее затраченное время на реализацию составило 184 часа.

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

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

Zero-блок

Зеро-блок является ключевой фишкой Тильды. Найти блок можно в левом главном меню со списком стандартных блоков. Располагается он в самом низу. С его помощью можно создавать и редактировать каждый отдельный элемент.

Все что нужно для работы с таким блоков это:

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

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

Пользовательский код

В Тильде можно адаптировать любой JavaScript или HTML-код, добавить CSS-стили и создать абсолютно кастомные решения.

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

Подключение кода происходит прямо на редактируемой странице. Просто используйте новый блок T123 и добавьте в пустую область ваш код. Блок поддерживает синтаксис HTML, JS и CSS.

К блокам и различным элементам можно подключать CSS-стили для всего проекта сразу. На уровне настроек сайта во вкладке Еще есть возможность задать пользовательский CSS.

Адаптивность и мобильная версия

Как я писал ранее, в некоторых случаях при разработке сайта придется отойти от стандартных решений и использовать нулевые блоки.

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

Десктоп;
Вертикальный планшет;
Горизонтальный планшет;
Вертикальный смартфон;
Горизонтальный смартфон.

Безусловно это минус, так как простая задача по сборке превращается в кропотливый труд с множеством ручной работы.

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

Имейте это ввиду при использовании zero-блоков.

Сквозные блоки

Очень важный элемент при сборке практически любого сайта на Тильде — сквозные блоки или alias-блоки. Создаются и редактируются в одном месте. Использовать их можно на всех или на отдельных страницах сайта.

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

Также есть возможность настроить сквозную шапку или подвал. Это можно сделать в стандартных настройках Тильды на уровне сайта. Перейдите во вкладку Шапка и подвал и выберите нужный блок, который будет отвечать за вывод Header и Footer.

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

Интеграция со сторонними сервисами

В Тильде предусмотрены богатые сторонние интеграции.

Например, можно настроить передачу лидов из форм в популярные CRM системы — Битрикс24 или AmoCRM, передавать данные в системы сквозной аналитики, например в Roistat. Существует также интеграция с сервисами почтовых рассылок или коллтрекинга.

Все это можно настроить во вкладке Формы на уровне настроек проекта.

Поисковая оптимизация

Несколько слов хотелось бы сказать про SEO на Тильде.

Довольно странно ведут себя различные сеошные софтины. Например, при анализе сайта Screaming Frog, программа вообще не находила ни одной страницы кроме главной. А те страницы, что все таки удалось определить выводили серверную ошибку 307, вместо привычной 200.

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

Добавлю, что для каждой отдельной страницы модно задать специальные настройки для социальных сетей — загрузить специальную картинку (бейджик) и уникальное описание, которая будет отображаться, если люди расшарят страницу.

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

Честно, я испытываю некоторые опасения по поводу ранжирования проекта в Яндекс и Google. Возможно, спустя несколько месяцев поделюсь своими наблюдениями и первыми результатами продвижения сайта, но пока писать о чем-либо очень рано.

Нельзя настроить разметку для всех страниц сайта автоматически.

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

К сожалению, в Тильде так сделать не получится.

Перенос и бэкопирование

Сайты на Тильде хранятся в облаке, но вы можете легко экспортировать проект на ваш хостинг. Однако данная опция становится доступна только на линейке тарифов Business, от 5 сайтов и больше.

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

Вот еще несколько моментов связанных с бэкопированием сайта:

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

Техническая поддержка

Следует сказать несколько слов про работу технической поддержки.

Ответ от специалиста приходит в течение 4-6 часов, иногда немного дольше. Но в целом ответы очень развернутые и внимательные.

Добавлю, что в большинстве случаев вам возможно и не придеться писать свои вопросы в поддержку. У Тильды очень крутая справка, которая дает ответы на 90% возникающих в процессе сборке вопросов.

Резюмируем

Тильда прекрасный инструмент для создания коммерческих landing page или небольших проектов до 20-30 страниц, не требующих регулярного обновления и добавлений новых материалов — создал и забыл.

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

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

Лучше выбрать коробочную CMS, например 1С-Битрикс или WordPress, очень упростите себе жизнь.

Для сборки нестандартных решений — Тильда точно не подойдет. Лучше подключите к работе группу программистов и выбирите подходящий фреймворк на каком-нибудь PHP или условном Ruby. Толко будет больше, уж поверьте.

Полезные ссылки

Поделюсь некоторыми полезными ссылками, которые значительно упростили мне процесс погружения в Тильду. Уверен, что помогут и вам.

Читайте также: