Shopify に Google マップを埋め込む方法とおすすめアプリ5選を紹介

Shopify

Posted at 2026-05-15

はじめに

2025 年現在、EC 市場は依然として成長を続けており、中でも Shopify を利用する事業者は増加の一途をたどっています。世界規模でのシェア拡大に伴い、日本国内でもショップ運営者が Shopify に注目し、オンラインビジネスをスピーディーに構築するケースが増えてきました。

そんな中、実店舗を持つ EC 事業者 にとって重要なテーマのひとつが 「ストアへのアクセス情報の提供」 です。特に Google マップの埋め込み を活用すれば、お客様が実店舗の場所を直感的に把握でき、来店促進やブランドの信頼性向上につながります。

しかし、Shopify のデフォルト機能だけでは、Google マップを美しくカスタマイズして埋め込む仕組みが十分に整っていません。 テーマのコード編集で対応することもできますが、レスポンシブ対応やデザインカスタマイズまで含めると、専門的な知識が必要になります。そのため、多くの事業者は アプリ を活用して、ノーコードで Google マップを埋め込めるようにしています。

この記事では、

Shopify に Google マップを埋め込む方法の概要
Google マップを埋め込むメリット・デメリット
Shopify で Google マップを埋め込み・表示 できる 5 つ のアプリ

をまとめてご紹介します。特に最初にご紹介する 「シンプル Google Maps 表示｜お手軽マップ埋め込み」 は、導入・設定ともにシンプルでわかりやすいため、約 5000 文字のボリュームで丁寧に解説します。ぜひ参考にしてみてください。

今回は、以下の記事を参考にしています。

Shopify に Google マップを埋め込むとは？

「Shopify に Google マップを埋め込む」 とは、オンラインストアのページ上に Google Maps のインタラクティブな地図を表示することです。お客様はストア上で直接地図を操作し、店舗の場所を確認したり、ルートを調べたりできます。

具体的には以下のようなユースケースがあります。

実店舗へのアクセス案内: 店舗の所在地を地図で視覚的に伝える
複数店舗のロケーション表示: チェーン店や取扱店舗の一覧を地図上にマッピング
イベント会場の案内: ポップアップストアや展示会の場所を表示
ピックアップポイントの表示: 店舗受取サービスの受取場所を案内

Google マップの埋め込みは、特にオンラインとオフラインを組み合わせた O2O（Online to Offline）施策 において非常に効果的です。

Shopify に Google マップを埋め込むメリットとデメリット

メリット

来店促進につながる
ストア上に地図を表示することで、お客様が実店舗の場所を直感的に把握できます。「近くにお店があるなら行ってみよう」という行動を促進し、実店舗への来客数アップが期待できます。
ブランドの信頼性が向上する
実在する店舗の場所を地図で明示することで、「実態のあるビジネスである」という安心感をお客様に与えられます。特に初めて購入を検討しているお客様にとって、信頼性の向上は購入の後押しになります。
ユーザー体験が向上する
お客様がわざわざ Google Maps アプリに切り替えて検索する手間がなくなります。ストア上で直接地図を確認できるため、スムーズなユーザー体験を提供できます。
SEO 効果が期待できる
ローカル SEO の観点から、店舗情報とともに地図を掲載することで、地域検索での露出が向上する可能性があります。Google が提供するコンテンツを埋め込むことで、ページの情報量も充実します。
問い合わせの削減につながる
「お店はどこにありますか？」「駐車場はありますか？」といった問い合わせを減らせます。地図上で場所が明確にわかれば、お客様自身で情報を得られるため、カスタマーサポートの負担軽減にもつながります。

デメリット

ページの読み込み速度に影響する可能性がある
Google Maps の埋め込みは外部リソースを読み込むため、ページの表示速度にわずかに影響を与える可能性があります。特にモバイル環境では、通信速度によって地図の表示に時間がかかることがあります。
API キーの管理が必要になる場合がある
一部のアプリでは Google Maps Platform の API キーが必要です。API キーの取得には Google Cloud のアカウント設定や請求設定が必要になるため、技術的なハードルがやや高くなることがあります。ただし、API キー不要のアプリも多数あります。
デザインの統一感を損なう可能性がある
デフォルトの Google Maps はカラフルな配色であるため、ストアのデザインテーマによっては統一感を損なう場合があります。グレースケールやセピアなどのフィルター機能を持つアプリを選ぶことで対処できます。

Shopify のデフォルト機能では Google マップを十分にカスタマイズできない

Shopify のテーマには、一部のテーマで地図セクションが標準搭載されています。しかし、標準機能には以下のような制約があります。

カスタマイズの自由度が低い: 地図の色味やフィルター、UI要素の表示/非表示などを細かく設定できない
レイアウトの選択肢が少ない: 2カラムレイアウトやPC/スマホ別の設定に対応していない場合が多い
API キーの設定が必要: 標準の地図セクションでは Google Maps API キーの設定が必要なテーマがある
複数ページへの設置が手間: 各ページごとに手動で設定する必要がある

このような制約を解消し、ノーコードで美しい地図表示を実現するためには、専用のアプリを導入するのがおすすめです。

Shopify に Google マップを埋め込めるアプリ5選

ここからは、Shopify に Google マップを埋め込めるアプリを 5 個ご紹介します。

シンプル Google Maps 表示｜お手軽マップ埋め込み

はじめに

「シンプル Google Maps 表示｜お手軽マップ埋め込み」は、Google Maps の埋め込みコードを貼り付けるだけで、Shopify ストアのどのページにも地図を表示できるアプリです。テーマエディタから直感的に設定でき、コーディングの知識は一切不要です。

月額 $9.99（7日間の無料体験あり）で利用でき、年払いで実質2ヶ月分無料になります。日本語に対応しており、日本のストアオーナーにとって使いやすいアプリです。

シンプル Google Maps 表示｜お手軽マップ埋め込み - Shopify App Store

できること

「シンプル Google Maps 表示｜お手軽マップ埋め込み」を使えば、以下のことが実現できます。

ストアに簡単に Google Maps の地図を埋め込める

Google Maps の「共有」から取得した埋め込みコードを貼り付けるだけで、ストアに地図を表示できます。API キーの取得や複雑な設定は不要で、テーマエディタの設定欄にコードを貼り付けるだけで完了します。市街地マップ・航空写真のどちらがデフォルトで表示されるかは、コードを取得したときに Google Maps で選択していた表示タイプによって決まります。

マップとテキストの2カラム表示ができる

タイトルや説明文を入力すると、地図とテキストが横に並ぶ2カラムレイアウトに自動で切り替わります。店舗の住所や営業時間などの情報を地図と一緒に表示できるため、お客様にとってわかりやすいページを作れます。説明文はリッチテキストに対応しているので、太字やリンクも使用できます。タイトル・説明文の両方が未設定の場合は地図だけの1カラム表示になります。

マップの見た目をノーコードでカスタマイズできる

グレースケール・セピア・階調反転・色相変更などのフィルター効果を使って、地図の見た目をストアのデザインに合わせてカスタマイズできます。例えば、モノトーンなデザインのストアにはグレースケールフィルターを適用することで、地図がストア全体のデザインに馴染みます。また、ズームボタンやストリートビューボタンなどのUI要素を非表示にして、すっきりとした見た目にすることも可能です。

色やテキスト、レイアウトを自由にカスタマイズできる

タイトルや説明文の文字サイズ・色・文字揃え、ブロックの背景色など、デザインの細部までカスタマイズできます。PC とスマホで異なる文字サイズや地図の高さを設定できるため、デバイスごとに最適な表示を実現できます。2カラム時の地図の幅もパーセント指定で調整可能で、テキストコンテンツとのバランスを自由に設定できます。

1クリックでテーマに追加できる

アプリの管理画面からテーマを選んで「テーマに追加」をクリックするだけで、簡単に地図ブロックをテーマに追加できます。テーマエディタを開いて手動でブロックを探す手間がありません。

アプリのインストール

アプリのインストールは以下の手順で行います。

1. Shopify 管理画面の左下にある「設定」をクリック

Shopify 管理画面にログインし、左下にある「設定」をクリックしてください。

2. 「アプリ」をクリックし、「Shopify App Store」へ移動

設定画面の左メニューから「アプリ」をクリックし、画面上部の「Shopify App Store」ボタンをクリックして App Store に移動してください。

3. 検索窓にアプリ名を入力し、表示されたアプリをクリック

検索窓に「シンプル Google Maps 表示」と入力して検索し、表示されたアプリをクリックしてください。

4. アプリ詳細画面で「インストール」をクリック

アプリの詳細画面が表示されたら、「インストール」ボタンをクリックしてください。

5. 権限の確認とインストール完了

権限の確認画面が表示されるので、内容を確認し「インストール」をクリックしてインストールを完了してください。

テーマに追加

インストールが完了したら、テーマに地図ブロックを追加します。

アプリ管理画面から1クリックで追加

アプリの管理画面を開き、テーマのプルダウンから追加先のテーマを選択します。

「テーマに追加」ボタンをクリックすると、テーマエディタが自動で開きます。

テーマエディタで地図ブロックの表示位置や設定を確認し、「保存する」をクリックすれば完了です。

手動でテーマに追加する場合

トップページ以外のページに地図を追加したい場合は、手動で設定します。

テーマエディタの上部プルダウンから追加したいページを選び、「セクションを追加」→「アプリ」タブからブロックを追加します。

アプリの設定項目

テーマエディタから、以下の設定をカスタマイズできます。

Google Maps 埋め込みコード: Google Maps の「共有」→「地図を埋め込む」からコードをコピーして貼り付けます。

コンテンツ設定: タイトルと説明文を入力できます。入力すると自動で2カラムレイアウトに切り替わります。

レイアウト設定: PC/スマホ別に地図の位置（左右/上下）、高さ、幅を設定できます。2カラム時のコンテンツの上下位置も調整可能です。

スタイル設定: グレースケール・セピア・階調反転・色相変更のフィルター、タイトル/説明文の文字サイズ・色・揃え、ブロックの背景色を設定できます。

余白設定: ブロックの上下左右の余白、コンテンツ間のスペースをPC/スマホ別に細かく調整できます。

おわりに

「シンプル Google Maps 表示｜お手軽マップ埋め込み」は、Google Maps の埋め込みコードを貼り付けるだけで簡単に地図を表示でき、2カラムレイアウトやフィルター効果など豊富なカスタマイズ機能を備えたアプリです。日本語対応で、実店舗を持つ日本のストアオーナーにとって非常に使いやすい選択肢です。

Way: Google Maps Store Locator

アプリ概要

項目	内容
アプリ名	Way: Google Maps Store Locator
開発者	Effective Apps
価格設定	無料プランあり（1ロケーション）/ Basic $9.99/月 / Advanced $12.99/月 / Pro $19.99/月
主な機能・特徴	AI パワードのストアロケーター、フローティングウィジェット、ポップアップモーダル、CSV一括インポート、カスタムCSS対応
対応言語	英語
評価	★★★★★（4.9 / 99件）

ワンポイント解説

Way は、AI を活用したストアロケーター機能が特徴的なアプリです。無料プランでは 1 ロケーションまで利用でき、Google Maps をフローティングウィジェットとして表示できます。有料プランでは最大 1000 ロケーションまで対応し、CSV ファイルでの一括インポートにも対応しているため、多店舗展開している事業者にとって便利です。API キーが不要で、1クリックでインストールできる手軽さも魅力です。Built for Shopify 認定を取得しており、Shopify のガイドラインに準拠した高品質なアプリです。ただし、日本語には非対応のため、日本のストアで使用する場合は管理画面が英語になる点に注意が必要です。主に複数の実店舗を持つビジネスや、ディーラーネットワークを持つブランド向けのアプリと言えるでしょう。

SC Store Locator Map

アプリ概要

項目	内容
アプリ名	SC Store Locator Map
開発者	Shop Circle
価格設定	無料（1店舗）/ Starter $9.99/月 / Growth $19.99/月 / Pro $39.99/月
主な機能・特徴	ジオロケーション、リアルタイムナビゲーション、検索フィルター、Google オートコンプリート、顧客検索ヒートマップ
対応言語	英語、ドイツ語、フランス語、スペイン語、日本語、イタリア語、タイ語、トルコ語他
評価	★★★★☆（4.7 / 246件）

ワンポイント解説

SC Store Locator Map は、Shop Circle が提供する高機能なストアロケーターアプリです。最大の特徴は 日本語を含む20カ国語に対応 している点で、日本のストアでもスムーズに利用できます。ジオロケーションによる現在地からの最寄り店舗検索や、Google オートコンプリートを使った住所検索など、お客様の利便性を高める機能が充実しています。無料プランでも1店舗まで利用可能で、有料プランでは最大2000店舗まで対応します。顧客の検索行動をヒートマップで可視化できる分析機能も備えており、マーケティングデータの収集にも活用できます。246件のレビューで 4.7 の高評価を獲得しており、多くのマーチャントに支持されている信頼性の高いアプリです。

Omnium Maps

アプリ概要

項目	内容
アプリ名	Omnium Maps
開発者	Develic Solutions
価格設定	Developer Access 無料（開発ストアのみ）/ Standard Access $4.99/月
主な機能・特徴	Google Maps 統合、1ページ1マップ制限なし、最大2000ロケーション、CSV インポート/エクスポート、6種類のテーマ、4種類のレイアウト
対応言語	英語
評価	★★★★★（5.0 / 24件）

ワンポイント解説

Omnium Maps は、シンプルさと機能性のバランスが取れたストアロケーターアプリです。月額 $4.99 という手頃な価格で、無制限のマップ作成（1ページ1マップ）と最大 2000 ロケーションに対応しています。6 種類のビジュアルテーマと 4 種類のレイアウトオプションが用意されており、ストアのデザインに合わせた地図表示が可能です。CSV インポート/エクスポート機能により、大量のロケーションデータの管理も効率的に行えます。自動配置、CSS セレクター、Liquid コードの 3 つの設置方法に対応しており、テーマとの統合の自由度が高いのも特徴です。Built for Shopify 認定を取得しており、24件のレビューで満点の 5.0 評価を維持しています。コストパフォーマンスを重視する方におすすめです。

Snap Locator: Store Finder

アプリ概要

項目	内容
アプリ名	Snap Locator: Store Finder
開発者	Seapixel
価格設定	無料（3ロケーション）/ UNLIMITED $9.99/月 / INSIGHTS $19.99/月
主な機能・特徴	Google Maps & Mapbox デュアルマッピング、オートコンプリート検索、ターンバイターン案内、ディーラー登録フォーム、AI サマリー自動生成、アナリティクス
対応言語	英語
評価	- （0件）

ワンポイント解説

Snap Locator は、Google Maps と Mapbox の両方に対応したデュアルマッピング機能が特徴のストアロケーターアプリです。無料プランでも 3 ロケーションまで利用でき、API キー不要でテーマアプリブロックとして設置できます。特筆すべきは ディーラー登録フォーム 機能で、小売パートナーが自らストアロケーションを申請し、オーナーが承認する仕組みを構築できます。AI によるロケーションサマリーの自動生成や、閲覧ヒートマップ・人気商品分析などのアナリティクス機能も備えています。画像ギャラリー、営業時間、連絡先、カスタムフィールドなど、ロケーション情報を充実させる機能も豊富です。リリースされたばかりのアプリですが、多機能で将来性のある選択肢です。

まとめ

今回は、Shopify に Google マップを埋め込めるアプリを 5 つご紹介しました。

実店舗を持つ Shopify ストアにとって、Google マップの埋め込みはお客様への情報提供と来店促進に直結する重要な施策です。それぞれのアプリに特徴がありますが、日本語対応 で ノーコード で簡単に設定でき、2カラムレイアウト や フィルター効果 など豊富なカスタマイズ機能を備えた 「シンプル Google Maps 表示｜お手軽マップ埋め込み」 が最もおすすめです。

単一の店舗で地図を埋め込みたい場合は「シンプル Google Maps 表示｜お手軽マップ埋め込み」、複数店舗のロケーターが必要な場合は「SC Store Locator Map」や「Way」も検討してみてください。

参考記事

You get articles that match your needs
You can efficiently read back useful information
You can use dark theme

What you can do with signing up