システムの更新情報をみる

ご利用中のSquare サービスに影響を及ぼす可能性のある問題が発生しています。詳細については、弊社のステータスページに随時更新いたします。

ホーム>コンテンツ

Square オンラインビジネスで埋め込みコードを使い外部コンテンツおよびウィジェットを追加する

[埋め込みコード] のセクションを使用すると、さまざまな追加機能をオンラインサイトに追加できます。数回のクリックでカスタムの連絡先フォームを作成できるほか、イベントの登録や予約サービスを追加したりGoogleカレンダーを表示することもできます。

この記事では、Google AnalyticsやFacebookなどではなく、イベントカレンダーや Googleマップを埋め込む方法について説明しています。ヘッダーコードの使用法についての詳細はこちらのウェブサイトのヘッダーにコードを追加をご覧ください。

設定方法はとても簡単です。

  1. 外部サイトから埋め込み可能なコードを取得のうえ、クリップボードまたはプレーンテキストファイルにコピーします。

  2. ウェブサイトの標準ページに埋め込みコードセクションを追加します。

  3. 外部サイトのコードを[埋め込みコード]セクションに貼り付け、外観を好みに合わせてカスタマイズします。

  4. 全ての来店者が利用できる新しいセクションを作成するには、ウェブサイトを公開

sos-embed-code-section-jp

設定するには、サイトの編集に移動しコードを追加したいページを選択して、左側の [セクションを追加する] をクリックします。 [埋め込みコード] をクリックし、右上の [追加] ボタンをクリックして、ページに追加します。埋め込みコードに使用できるレイアウトは複数あります。どれを選ぶかは、追加する内容や必要なスペースによって異なります。上のテキストを含むレイアウトでは埋め込み商品のスペースが広くなりますが、右側のテキストを含むレイアウトでは狭い領域になります。これは後で変更できるので、どれを選択すればよいかわからない場合は、現時点で最適そうなものをクリックしてください。

sos-embed-code-section-added-new-JP

画面左の [埋め込みコード] をクリックしてコードを追加し、セクションの外観をカスタマイズします。

設定では次のオプションを使用できます。左側の項目をクリックすると、オプションが展開され、ページの右側の対応する領域が強調表示されます。

レイアウト - セクション用に別のレイアウトスタイルを選択します。

タイトル - タイトルテキストのフォント設定、サイズ、色を変更します。切替スイッチでタイトルをオフにして、セクションに表示させないようにすることもできます。

説明 - タイトル下部の説明テキストのフォント設定、サイズ、色を変更します。こちらも必要がなければオフに切り替えます。

埋め込みコード - ここに外部サイトのコードを貼り付けて、ページのセクションに追加します。

セクションスタイル - セクションの配置(左や中央)を変更し、背景色や画像を設定します。

ep-embed-code-iframe

[埋め込みコード] セクションを使用してページに Googleカレンダーの追加Googleカレンダー を追加する例を示します。Googleはiframeと呼ばれる技術を使用して埋め込み可能なコードを自動的に生成し、直接リンクを介してカレンダーを表示します。これは外部のコードをウェブサイトに埋め込む際に使用する非常に一般的な方法ですが、他のほとんどの方法も大体同じように機能します。必要な作業は外部のサイトからコードをコピーして、[埋め込みコード] に貼り付けるだけです。

重要:無効なコードや不完全なコードを貼り付けると、ウェブサイトに問題が発生するおそれがあります。レンダリングされたコードが表示されない場合や、何か問題が見受けられる場合は、埋め込みコードフィールドに完全なコードがすべて含まれていることを再度ご確認ください。ウェブサイトを公開して、追加したコードが想定どおりに機能するかどうかも併せてご確認ください。たとえば、コード全体を貼り付けなかったり、誤って余分な文字を挿入したりすると、予期しない結果が発生する可能性があります。それでも原因がわからない場合は、ページから埋め込みコードセクションを削除して、もう一度公開してみてください。セクションを削除すると問題が解決する場合は、コードプロバイダーにお問い合わせの上、セクションの正しい使用方法をご確認ください。

埋め込みコードの使用から発生する問題については、外部連携を含む幅広い用途と潜在的な問題が絡んでいるため、詳細なトラブルシューティングはSquareより提供することができません。