Продолжаем работу над нашим каталогом домов из бруса в Подмосковье, с использованием плагина интернет-магазина WooCommerce.
Начало смотрите видео Как создать каталог на WooCommerce
Продолжение в видео Как создать каталог на WooCommerce продолжение
Вместо Яндекс карты, в записях каталога (товарах) можно использовать карту OpenStreetMap
А для удобного взаимодействия с ней, я буду использовать Leaflet — открытую JavaScript-библиотеку для интерактивных карт.
Для этого мы должны установить дополнение в виде специального поля для плагина Advanced Custom Fields — Advanced Custom Fields: Leaflet Map Field
Устанавливаем дополнительное поле Leaflet Map Field.
И настраиваем его в плагине Advanced Custom Fields в разделе Группы полей, для нашей группы Характеристики домов WooCommerce
Теперь при добавлении или редактировании нового товара (записи каталога домов), появилось новое поле с картой OpenStreetMap.
Добавляем новый объект или редактируем уже существующий.
После этого необходимо организовать вывод карты на странице с описанием дома.
Для этого редактируем файл шаблона functions.php и проверяем результат.
Пример страницы с картой OpenStreetMap
В следующем видео, мы выведем все дома с полем Leaflet Map на общую карту