Войди в свой аккаунт яндекса (к нему будет привязана эта карта, поэтому можешь сразу создать для клиента отдельный аккаунт яндекса для удобства)
Выбери "подключить API"
Выбери пункт "Javascript API и HTTP Геокодер"
Заполни форму на подключение и нажми "Продолжить" и затем "Перейти к API"
Открой настройки ключа по кнопке "Изменить"
В поле «Ограничение по HTTP Referrer» впиши доменное имя, на котором будет отображаться карта. Если у тебя поддомен Тильды, то пиши tilda.ws. Если подключен свой домен, то нужно прописать его, например - voron-dev.ru. Сохрани изменения.
6. Загрузи в любую галерею на любой страничке твоего сайта (лучше отдельной) изображение, которое должно заменять метку на карте (при наличии), кликни по нему ПКМ и выбери "скопировать ссылку на изображение"
7. Вставь эту ссылку в генератор и укажи размеры которые она должна иметь будучи меткой и остальные настройки
8. Задай координаты центра карты при запуске. Для этого перейди на https://yandex.ru/maps/и выбери нужное тебе здание/объект и скопируй его координаты. Масштаб можешь посчитать просто отдалив карту на максимум и дальше считай все клики на плюсик которые тебе понадобятся чтобы приблизить карту в нужное положение
9. Сгенерированный код поставь ниже зеро с html из п. 1 в блок т123
Если тебе нужно добавить в описание метки картинку, то в месте где должна быть картинка вставь вот этот код:
Сюда нужно вставить только ссылку на саму картинку которую ты можешь получить также как и ссылку на иконку (см. п. 6)
Сюда соответственно пропиши вместо ссылки на мой сайт свою ссылку, а вместо слова "ссылка" текст на который применится ссылка
Если тебе нужно добавить ссылку в описание метки, то в месте где должна быть ссылка вставь вот этот код:
После того как расставишь все метки нажми "Сохранить и продолжить", затем "Экспорт", выбери формат GEO JSON и скачай себе файл с метками
Открой его в простом блокноте, скопируй из него всё содержимое и вставь в поле "импорт меток из конструктора" в генераторе
- 3я версия api карты значительно быстрее и оптимизирована сама по себе, но не позволяет добавить поиск по карте и пробки/слои и настроить свою тему. Поэтому выбирай 2.1 только если тебе нужно что-то из этого отсутствующего в 3й версии функционала
- Если тебе нужно сделать 2 и более карты на странице или если ты делаешь карту под сайт с autoscale, то используй только 3ю версию api карты. Обрати внимание что если делаешь две и более карты на страничке, то нужно также включить последний чекбокс с названием "включи это если..."
- Имей в виду что после отправки формы в личном кабинете яндекса api ключ активируется не сразу (даже не смотря на то что он выдается тебе сразу). Поэтому чтобы активировать версию api 3 с этим ключем может потребоваться немного подождать пока яндекс обновит данные
- Обрати внимание что параметры нужно указывать прямо как написано для ориентира полупрозрачным. Именно в таком формате ожидает ввода генератор
- Лучше использовать в поле «Ограничение по HTTP Referrer» только твой подключенный домен, чтобы твой api-ключ нельзя было использовать с любого поддомена Тильды (т.е. сайт должен быть не .tilda.ws а например .ru .com и тд.)
Важно!
undefined
undefined
undefined
undefined
undefined
undefined
undefined
undefined
Отчистить поля
Загрузить сохраненные значения
undefined
Только для api версии 2.1
undefined
undefined
Только для api версии 3
undefined
undefined
Уверенным пользователям, которые каждый день зарабатывают на создании и верстке сайтов
~50 новых модификаций, которые планируем выпустить в течение года
Обновления библиотеки с учетом изменений Tilda
ИИ-помощник с базовыми моделями
Возможность голосовать за новые моды и закрытый чат (скоро)
undefined
~25 Pro-модификаций
Генератор CSS
Распознавание блоков
Показать блоки т123
Автосохранение Zero-блока
Подсветка кода в т123
undefined
undefined
~20 бесплатных модификаций
Темная тема для Tilda
Кнопки быстрой публикации
Настройки меню в редакторе
Никаких автоплатежей
123
Карта версии api 2.1 с поиском, метками и нормальной темной темой без шейпов и костылей:) Обрати внимание, если тебе нужно делать несколько карт на странице, то для этого подойдёт только api версии 3. Этот пример - исключение)
Примеры работы модификации
Также карта версии api 2.1, но со скрытым поиском и элементами управления + очень темной и черно-белой темой одновременно, для демонстрации вариативности
Примеры работы модификации 2
Карта версии api 3 позволяет задать цвета для поверхности, дорог, строений, водных объектов, поп-апа для меток и по умолчанию быстрее загружается (в 3 раза быстрее)
Примеры работы модификации 3
Также карта версии api 3 полностью совместима с autoscale