Shopify ストアに Google Maps の地図を簡単に埋め込めるアプリ「シンプル Google Maps 表示｜お手軽マップ埋め込み」をリリース
株式会社UnReact
福岡県の IT ベンチャー企業 株式会社 UnReact が、「シンプル Google Maps 表示｜お手軽マップ埋め込み」をリリースしました。
「シンプル Google Maps 表示｜お手軽マップ埋め込み」は、Shopify ストアに Google Maps の埋め込みコードを貼り付けるだけで、どのページにも地図を表示できるアプリ です。
本アプリは、2026年6月2日 10:00 に正式公開いたしました。
タイトルと説明文を入力すると地図とテキストが並ぶ2カラムレイアウトに自動で切り替わり、PC・スマホ別に地図の位置・高さ・幅を独立して設定できます。グレースケールやセピアなどのフィルター効果でストアのデザインに合わせたカスタマイズも可能です。
ノーコードでテーマに追加できます。料金は Basic Plan 月額 ＄9.99 で、7日間の無料体験が可能です。
▼ アプリストア
https://apps.shopify.com/ur-google-maps-store-locator?locale=ja
▼ ご利用ガイド
https://unreact.jp/shopify-apps/sa-155-ur-google-map-app/guide
■ Shopify とは
Shopifyは、世界175ヶ国100万ショップ以上で利用されているECプラットフォームです。低コストで本格的なネットショップを開設でき、豊富なデザインテンプレートやアプリによる機能拡張が可能です。日本でも多くのブランドやショップがShopifyを活用してオンラインストアを運営しています。
■ 「シンプル Google Maps 表示｜お手軽マップ埋め込み」について
[画像1:
https://prcdn.freetls.fastly.net/release_image/72693/310/72693-310-a636a95eefdd876c4dbeeff06972df97-1600x900.png?width=536&quality=85%2C75&format=jpeg&auto=webp&fit=bounds&bg-color=fff ]
シンプル Google Maps 表示｜お手軽マップ埋め込み
「シンプル Google Maps 表示｜お手軽マップ埋め込み」は、Shopify ストアに Google Maps を簡単に埋め込めるアプリです。Google Maps の「共有」から取得した埋め込みコードを貼り付けるだけで、テーマのどのページにも地図を表示できます。コーディングの知識は一切不要で、テーマエディタから直感的に設定できます。タイトルと説明文を入力すると、地図とテキストが横に並ぶ2カラムレイアウトに自動で切り替わるため、実店舗の住所や営業時間を地図と一緒に表示したいストアオーナーにぴったりです。PC・スマホそれぞれで地図の位置・高さ・幅を独立してカスタマイズでき、グレースケール・セピア・階調反転・色相変更などのフィルター効果にも対応しています。
主な特徴は以下のとおりです。
■ Google Maps の埋め込みコードを貼り付けるだけで地図を表示
[画像2:
https://prcdn.freetls.fastly.net/release_image/72693/310/72693-310-3d6ace68b35c7236ce3ed169047ebe1a-1600x900.png?width=536&quality=85%2C75&format=jpeg&auto=webp&fit=bounds&bg-color=fff ]
埋め込みコードの設定（左）と表示例（右）
Google Maps の「共有」→「地図を埋め込む」からコードをコピーして貼り付けるだけで、ストアに地図を表示できます。 テーマエディタの設定画面にコードを入力するだけなので、HTMLやCSSの知識がなくても問題ありません。実店舗やショールーム、ピックアップポイントなど、お客様に来店してほしい場所の地図を簡単に設置できます。
■ マップとテキストの2カラム表示に対応
[画像3:
https://prcdn.freetls.fastly.net/release_image/72693/310/72693-310-c847daf6d9b559e271f3d4379cf11289-1600x900.png?width=536&quality=85%2C75&format=jpeg&auto=webp&fit=bounds&bg-color=fff ]
コンテンツ設定項目（左）と表示例（右）
タイトルや説明文を入力すると、地図とテキストが横に並ぶ2カラムレイアウトに自動で切り替わります。 店舗の住所、営業時間、アクセス方法などを地図のすぐ隣に表示できるため、お客様にとってわかりやすいページ構成を実現できます。リッチテキストにも対応しているので、太字やリンクを含む説明文も設定可能です。
■ マップの見た目をノーコードでカスタマイズ
[画像4:
https://prcdn.freetls.fastly.net/release_image/72693/310/72693-310-6c4c4252f4510b3a05d7f5366396c719-1600x900.png?width=536&quality=85%2C75&format=jpeg&auto=webp&fit=bounds&bg-color=fff ]
スタイル設定項目（左）と表示例（右）
グレースケール・セピア・階調反転・色相変更などのフィルター効果を使って、地図の見た目をストアのデザインに合わせてカスタマイズできます。 落ち着いた雰囲気のストアにはグレースケール、レトロな印象のストアにはセピアなど、ブランドイメージに合った地図表示を実現できます。ズームボタンなどのUI要素を非表示にして、すっきりとした見た目にすることも可能です。
■ 色やテキスト、レイアウトを自由にカスタマイズ
[画像5:
https://prcdn.freetls.fastly.net/release_image/72693/310/72693-310-f2f1b17d766ee5e61a09fa731c761565-1600x900.png?width=536&quality=85%2C75&format=jpeg&auto=webp&fit=bounds&bg-color=fff ]
ノーコードの設定項目
タイトルや説明文の文字サイズ・色・文字揃え、ブロックの背景色など、デザインの細部までカスタマイズできます。 PC とスマホで別々の文字サイズを設定できるため、デバイスごとに最適な表示を実現できます。ブロックの余白や地図の幅もピクセル単位で調整可能で、ストアのデザインに完全にフィットする地図表示が可能です。
■ 1クリックでテーマに追加
[画像6:
https://prcdn.freetls.fastly.net/release_image/72693/310/72693-310-e7ec972d508d275c7f10bf70b721de2a-1600x900.png?width=536&quality=85%2C75&format=jpeg&auto=webp&fit=bounds&bg-color=fff ]
アプリ管理画面（上）と追加後の表示（下）
アプリの管理画面からテーマを選んで「テーマに追加」をクリックするだけで、簡単に地図ブロックをテーマに追加できます。 テーマエディタを開いて手動でブロックを探す手間がなく、初めての方でもかんたんに設置できます。手動でテーマに追加する方法にも対応しており、トップページ以外の任意のページにも地図を設置できます。
▼参考記事
-
Shopify に Google マップを埋め込む方法とおすすめアプリ5選を紹介-
Shopify に Google Maps を埋め込めるアプリ6選を紹介！-
Shopify に Google マップを埋め込む方法を徹底解説｜おすすめアプリも紹介-
【2026】ShopifyにGoogleマップを埋め込めるアプリおすすめ14選を紹介！
▼株式会社UnReact 会社概要
会社名: 株式会社UnReact
代表者: 西川信行
事業内容: EC制作事業・アプリ開発・教育事業
URL:
https://unreact.jp/プレスリリース提供：PR TIMES
記事提供：PRTimes
