Elementor Store Locator: WordPressに店舗マップを追加する

Elementor には 標準の store locator は ありません 。 店舗マップを 追加するには 、 地図を 表示したい ページで 、 ベンダーの embed code を HTML ウィジェットに 貼り付けるか 、 プラグインの shortcode を Shortcode ウィジェットに 貼り付けます 。 10 店舗でも 200 店舗でも 、 基本の 考え方は 同じです 。

Elementor は ページを 作るが 地図エンジンではない

Elementor は WordPress の 中で レイアウトを 作る ツールです 。 独自の 地図エンジンや geocoding engine は 付属しません 。 そのため locator は 必ず 別の ツールから 提供されます 。

その 別の ツールは 、 shortcode を 登録する WordPress プラグインか 、 すぐ 使える HTML snippet を 渡す SaaS widget です 。 Elementor は 前者には Shortcode widget を 、 後者には HTML widget を 用意しています 。

この ガイドは Elementor で 作った ページを 前提に しています 。 WordPress block editor を 使う 場合は 手順が かなり 違うため 、 別の ガイド を 見てください 。

プラグインと SaaS widget で 何が 変わるか

WordPress native の locator プラグインは 、 多くの場合 [store-locator] のような shortcode を 登録します 。 その shortcode を Shortcode ウィジェットに 入れると 、 プラグインが その 位置に 地図を 表示します 。 PHP や template を 編集する 必要は ありません 。

店舗データは 自分の WordPress database に 残ります 。 更新サイクルも 他の WordPress プラグインと 同じなので 、 あなた または hosting provider が plugin と core の update を 適用して 動かし続けます 。

SaaS locator は 違います 。 ベンダーで account を 作り 、 そこで 店舗を 登録し 、 生成された embed code を コピーします 。 多くは iframe か 短い script です 。 それを HTML ウィジェットに 貼り付けます 。

店舗データと 多くの 機能は ベンダーの server 側で 管理されます 。 あなたが 更新する plugin は ありません 。 自分の hosting への 追加負荷ではなく 、 外部 request が 1 つ 増える 形です 。

locator が ない 、 あるいは 壊れている 場合 、 その 訪問は 注文履歴に 出ません 。 購入が checkout ではなく 実店舗で 起きるからです 。

この リスクは Elementor でも 他の platform でも 同じです 。 だから 顧客から 苦情が 来た 後ではなく 、 公開前に テストする 価値があります 。

Elementor ページに 店舗マップを 追加する 手順

選ぶ ウィジェットに 関係なく 、 作業の 流れは 同じです 。

1. すべての 店舗名 、 住所 、 電話番号 、 営業時間を 1 つの spreadsheet に 集めます 。 多くの plugin と SaaS widget は CSV import に 対応しています 。
2. plugin 方式か SaaS widget 方式かを 決めます 。 plugin なら data は 自分の database に 残り 、 update は 自分側で 行います 。 SaaS widget なら data と 多くの locator 機能は vendor が host します 。
3. vendor account を 作成するか plugin を 有効化し 、 店舗を 追加 または import します 。
4. 店舗が 入ったら 、 ツールが 生成する shortcode または embed code を コピーします 。
5. Elementor editor で Shortcode ウィジェット または HTML ウィジェットを ページに 置き 、 コピーした 内容を 貼り付けます 。
6. 地図に 通常の content column より 広い 横幅が 必要なら 、 周囲の section または container を full width に 設定します 。
7. desktop と mobile で preview し 、 実店舗の 近くの 住所を 検索して pin と result が 正しいか 確認します 。

公開前に テストする 点

• 実際の 住所リストの すべてが 正しい pin に geocode されますか 。 変わった 表記や 郵便番号が 足りない 住所も 含めて 確認します 。
• widget に 自分の Google Maps API key と billing account が 必要ですか 。 それとも 独自の map provider が 含まれていますか 。 この 判断は 先に 詳しく 見ておく 価値があります 。
• Elementor site の caching plugin や minification plugin が 、 HTML ウィジェットから 出る script を 削除しませんか 。 clean preview だけでなく 、 cache を 有効に した 状態で テストします 。
• 解約する 場合 、 店舗リストを export できますか 。 それとも vendor dashboard の 中に 閉じ込められますか 。
• Google Maps API の 手順を 省ける widget が 必要なら 、 Progus Store Locator は ここで 説明した 両方の 方式で 使えます 。 plugin style の install なら shortcode 、 HTML ウィジェットなら embed code です 。 default map は API key なしで 動きます 。

公開できる 状態か 確認する

顧客に 機能を 告知する 前に 3 つ 確認します 。 すべての 住所が 正しい pin を 返すこと 、 partial postcode と full postcode の 両方で 検索できること 、 mobile data でも ページが 適切な 速度で 読み込まれることです 。

まとめ

store locator は 一度だけ 設定して 終わる タスクでは ありません 。 営業時間は 変わり 、 店舗は 閉じ 、 新しい dealer が 増えます 。 商品 catalog と 同じように 、 一度の 構築ではなく 担当者を 決めて 管理します 。

契約前に vendor の demo data ではなく 自分の 住所リストで テストします 。 きれいな demo と 表記が そろっていない 実データの 差で 、 多くの locator project は 止まります 。 Elementor site でも 事情は 同じです 。