ページに地図を挿入する

顧客が実際のストアのロケーションを簡単に探せるように、ウェブサイトに「Google マップ」ロケーションを追加できます。

この記事では、ウェブサイトにGoogleマップを埋め込む2つの方法を説明します：

• Google マップから埋め込む
• SHOPLINE管理画面の高度なページから埋め込む
• ショップビルダー

1. Google マップから埋め込む

ステップ 1

Google マップからストアをピン留めします。

ステップ 2

ピン留めしたい住所を確認し、共有をクリックします。

ステップ 3

地図を埋め込むタブをクリックし、希望の地図サイズ（大/中/小/カスタマイズ）を選択した後、リンクをコピーします。

ステップ 4

SHOPLINE管理画面で、[オンラインストアデザイン] > [ページ]に移動します。青いテキストページボタンをクリックし、ページタイトルを入力します。

ステップ 5

「ページコンテンツ」の下にあるHTML切り替えアイコンをクリックし、コピーしたコードを貼り付けます。追加をクリックして更新します。

注：HTML切り替えボタンをクリックした後、このフィールドの内容はHTML構文に変わります。詳細については、こちらのリンクを参照してください：テキストエディタからHTMLを表示。

ステップ 6

左側のバーのメニューナビゲーションタブに移動し、好みに応じてメニューにページを追加します（ページを上部と下部のメニューの両方に追加できます）。

2. SHOPLINE管理画面の高度なページから埋め込む

ステップ 1

SHOPLINE管理画面に移動し、[オンラインストアデザイン] > [ページ]に移動します。高度なページを追加し、希望のテンプレートを選択します。

ステップ 2

左側のビルドボタンをクリックし、ページタイトルを設定します。

バイリンガルのストアは、情報を再入力する手間を省くために、同時に第二言語を設定することをお勧めします。

ステップ 3

Google マップボタンをエディタにドラッグ＆ドロップします。

以下の画像は、Google マップをエディタにドラッグした後のレイアウトを示しています。

ステップ 4

ストアの住所を検索して確認します。

高度なページを通じて地図を埋め込む場合、サイズのカスタマイズはできません。

ステップ 5

地図のタイトルと説明も設定タブで設定できます。設定を保存するにはOKをクリックします。

ステップ 6

プレビューをクリックして、モバイル/タブレット/ウェブモードでページを表示します。右下の保存ボタンをクリックするのを忘れずに、その後ページの左上隅にある管理画面に戻るをクリックします。

ステップ 7

左側のバーのメニューナビゲーションタブに移動し、好みに応じてメニューにページを追加します（ページを上部と下部のメニューの両方に追加できます）。

3. ショップビルダー

*始める前に：

•  
  • ショップビルダーは現在、ウルトラシック、キングスマン、ヴァーム、フィリアのテーマテンプレートのみをサポートしています。
  • ショップビルダーを使用してページを作成した後、他のテーマテンプレートに切り替えてもページは表示されますが、編集できず、レイアウトが崩れる可能性があります。ページを公開する前にこれに注意してください。

ショップビルダーのパーツと設定について詳しくは、紹介をご覧ください。

ステップ 1

SHOPLINE管理画面に進み、> [オンラインストアデザイン] > [ページ]をクリックし、[高度なページ/編集]ボタンをクリックして高度なページの設定を開きます。

ステップ 2

パーツボタンをクリックします。

ステップ 3

「テキスト」パーツを選択します。

ページのカスタムリキッドの設定については、カスタムリキッド | ショップビルダーをご覧ください。