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

Ссылка на сам сервис: https://maplabel20171228.firebaseapp.com/
Это "альфа" версия, которой можно пользоваться. С помощью нее было сделано несколько карт для рабочих сайтов. Делали "для себя".
Если будет пользоваться популярностью, то наведем красоту, стабильность и сделаем платной :)
ПРИМЕР:
Мы позвоним вам сами и расскажем про построенные объекты!
Если будет желание посетить, то расскажем, как.
Как пользоваться:
1. Регистрация или вход (SignUp - Login)

Зарегистрироваться можно с помощью аккаунта Гугл или е-мейла.

Созданные карты привязываются к аккаунту. В других аккаунтах данные не видны.

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

2. Рабочее пространство

Разделено на 2 части.
Слева карта, на которой Вы размещаете объекты.

Справа, две вкладки: КАРТА и ОБЪЕКТЫ (параметры карты или параметры объекта(ов).

Чтобы увеличить карту воспользуйтесь кнопкой "во весь экран" карты.

Карта пока только Яндекс. Если нужна Гугл - пишите.

3. Вкладка КАРТА

Параметры, которые применяются ко всей карте.

Кнопки:
Новая карта - очищает и сбрасывает карту.
Загрузить карту - выбрать карту из ранее сохраненных и загрузить
Сохранить - сохраняет карту с именем указанным ниже
Удалить карту - выбрать карту из ранее сохраненных и удалить ее

Ширина и Высота:
Ширина и Высота карты при вставке в сайт. Единицы измерения: px, %, em, rem, vh, vl

Значок иконки и Цвет иконки:
Для отображения на карте.
Одинаковый значок для всех объектов.

Отредактируйте кнопку:
В "объекты" есть возможность встроить свою кнопку (говорят, увеличивает конверсию). См.ниже

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

... попробуйте поиграться с параметрами

Неочевидное:
Надпись и Ссылка - это параметры по-умолчанию. Для каждого объекта может быть заданы свои надпись и ссылка.

Для Тильды есть возможность по кнопке открывать pop-up с формой. Для этого в поле ссылка нужно прописать id блока (например вот так: #rec43545382). Поддерживается только блок BF502N


Кнопка "Получить код"

Формирует код для вставки в ваш сайт.

Для Тильды:
1. Добавьте в нужном месте блок HTML и сконфигурируйте его (ширину, отступы...)
2. Вставте код
(сохраните, опубликуйте страницу)

Неочевидное:
- если после вставки кода, Вы изменили объекты на карте, то достаточно просто обновить страницу сайта (после сохранения карты), получать код и вставлять его заново не нужно.
- если же вы повторно нажали кнопку "получить код", то его придется вставить в сайт, так как код доступа изменился.

4. Вкладка ОБЪЕКТЫ

Алгоритм добавления объекта:
1. Кнопка "Добавить объект"
! Объект добавляется в текущий центр карты

2. Заполнить поля по необходимости

3. Сохранить объект
Кнопка "Сохранить" - сохранит объект и очистит поля
Кнопка "Сохранить и создать" - сохранит объект, создаст новый и скопирует в него всю текущую информацию.
Кнопка "Очистить" - сбросит текущий объект и очистит все поля.

Чтобы удалить объект с карты - кнопка "Удалить объект".

Добавить картинку

1. Если вы хотите добавить картинку, которая храниться на вашем компьютере:
Кнопка "Выберите файл".
Файл будет загружен на сервер.

2. Картинка по URL:
Insert - Image
Файл будет храниться там же, где и был (например в Тильде)

Размер картинки:
Меняется Drag&Drop.
! НО реальный размер картинки не меняется, меняется только отображаемый размер. Для увеличения скорости загрузки картинок оптимизируйте и уменьшайте заранее.

Основной блок информации
Картинка и Кнопка добавляются в самый конец, после всего текущего содержания. Добавили, перетащили в нужное место.

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

Добавить кнопку:
- в редакторе кнопка отображается без стилей
- пропишите необходимые для объекта ссылку и надпись для кнопки или оставьте по-умолчанию

- Вернуться к редактированию объекта можно кликнув на него
- Объекты перетаскиваются мышью в нужное место
- Работает поиск по местам (кнопка "Найти" на карте)
- Координаты объекта можно задать вручную - поле "Координаты" и кнопка "Переместить"
- Иконку и стиль кнопки можно менять в любой момент на вкладке КАРТА. Изменения применятся ко всем объектам.

! Не забудьте сохранять карту (кнопка "Сохранить карту" на вкладке КАРТА).


Немного технической информации для тех, кому интересно: Vue.js + Firebase
Если нужно что-то добавить-изменить-исправить-создать - пишите.
comments powered by HyperComments
Made on
Tilda