Skip to content
PageBuilder
PageBuilder
Визуальный конструктор секций для MODX 3: черновик и публикация без перезаписи content ресурса
  • MODX 3
  • PHP 8.2
  • Vue 3
  1. Компоненты
  2. PageBuilder
  3. Каталог секций
  4. Pro
  5. Карта

Карта

Точка на карте по координатам или адресу. Iframe собирает MapEmbedResolver. Провайдер по умолчанию: Яндекс.Карты.

Карта

Отдельная карта

  • Координаты в поле map, iframe собирает resolver
  • Яндекс.Карты по умолчанию, провайдер меняется в коде пакета
  • Отдельно от текста контактов

Сценарии

  • На странице контактов: офис или шоурум
  • В блоке доставки: зона покрытия одной точкой
  • На странице события: место проведения

Примеры страниц

Точка на карте

Поле Точка на карте (map): координаты и масштаб. Заголовок секции необязателен.

Похожие секции

Параметры блока

ПараметрЗначение
keymap
СлойPro
Категориямедиа (media)
Chunkpagebuilderpro_map
Требованияpro

Поля в редакторе

Заполните поля в инспекторе секции на ресурсе. Описание типов полей: справочник типов.

Заголовок (title)

Тип text. Необязательное.

Карта (location)

Тип map. Обязательное. Точка на карте. На сайте. iframe через MapEmbedResolver.

Что видит посетитель

Iframe в блоке pb-map.

Данные секции

Пример JSON после сохранения секции. Для media, video и map значения на выводе могут быть обогащены:

json
{
  "title": "Заголовок секции",
  "location": {
    "lat": 55.751244,
    "lng": 37.618423,
    "embed_url": "https://yandex.ru/map-widget/v1/..."
  }
}

Шаблон chunk

Fenom chunk pagebuilderpro_map:

fenom
<section class="pb-section pb-section--map pb-map{if $cssClass} {$cssClass|escape}{/if}" data-pb-section="map"{if $id} id="pb-{$id|escape}"{/if}>
  <div class="pb-section__inner pb-map__inner">
    {if $title}
      <h2 class="pb-heading pb-map__title">{$title|escape}</h2>
    {/if}
    {if $map_embed_url}
      <div class="pb-map__embed">
        <iframe
          class="pb-map__frame"
          title="{$title|default:'Map'|escape}"
          loading="lazy"
          referrerpolicy="no-referrer-when-downgrade"
          src="{$map_embed_url|escape}"
        ></iframe>
      </div>
    {elseif $map_watch_url}
      <p><a class="pb-button" href="{$map_watch_url|escape}">{'pagebuilder_fe_map_open' | lexicon}</a></p>
    {/if}
  </div>
</section>

Связанные страницы