Продолжаем работу над нашим каталогом домов из бруса в Подмосковье, с использованием плагина интернет-магазина WooCommerce.
Начало смотрите в плейлисте Как создать каталог на WooCommerce
В этом видео, мы выведем все данные о домах на общую карту OpenStreetMap.
Выводить мы будем не все товары (дома), а только те, у которых есть поле Leaflet Map Field (location).
Скачать архив темы с изменениями отсюда
01:09 В начале мы удалим заголовок Магазин с главной страницы товаров
Для этого добавим строку кода в файл functions.php нашего шаблона WordPress.
Также мы добавим в него код, отвечающий за поддержку данных плагина интернет-магазина WooCommerce в нашем шаблоне.
04:46 Теперь создаем новый файл шаблона страницы page-osmmap.php на основе кода из файла page.php родительской темы Astra.
06:55 Создаем новую страницу «Дома на карте OpenStreetMap» и выбираем для неё наш шаблон OpenStreetMap New.
07:52 Выводим данные о всех товарах (домах) на нашу новую страницу.
10:56 Выводим только те данные, у которых есть поле Leaflet Map Field (location).
14:10 Организуем вывод карты OpenStreetMap с метками.
19:31 В балун, открывающийся при клике на метке, добавляем данные о расстоянии в км. от МКАД и цене.
26:10 Далее для ускорения загрузки карты, подключаем скрипт кластеризации Marker Clustering plugin for Leaflet https://github.com/Leaflet/Leaflet.markercluster
43:18 Выводим в балуне другие дополнительные параметры (площадь дома, площадь участка, этажность).
45:50 Выводим в балуне название категории товара (направление).
Посмотрите результат работы «Дома на карте OpenStreetMap»
В следующем видео мы выведем все остальные товары (дома) из каталога на Яндекс карту.