• Topic 主题 トピック Topic Topic
  • Sign in

カスタムコードアプリ

この記事では、カスタムコードというアプリを紹介します。このアプリを使用すると、以下のシナリオでストアページにコードを追加できます:

  1. カスタムHTMLやCSSコードを追加して、オンラインストアのマーケティング活動やストアフロントのスタイルを充実させる。
  2. Google Analytics、Facebook Pixel、その他の広告プラットフォームのトラッキングコードを追加する。

 

目次

 


 

コードの追加

カスタムコードを使用すると、複数のコードを一度に追加でき、それぞれのコードを独立して管理できます。以下が手順です:

  1. SHOPLINE管理パネルから、アプリに移動し、カスタムコードアプリを開きます。
  2. アプリのホームページで、コードを追加をクリックします。
    1.2.png
注意: カスタムコードは公開済みおよび未公開のテーマの両方に有効です。

 


 

コードの設定

2.png

カスタムコードの編集ページでは、構成アイテムのロジックに注意する必要があります。アイテムを追加するとすぐに効果が現れます。

  • コードコンテンツ: ページに配布されるコードスニペットを参照し、Handlebarsテンプレート言語をサポートします。
  • 表示オプション: コードが発行されるデバイスタイプを選択します。これにはデスクトップとモバイルデスクトップのみ、またはモバイルのみが選択できます。
  • 挿入位置: コードの挿入位置を選択します。 トップは、コードがページコンテンツより前に読み込まれることを意味し、ページ要素に依存しないコードに適しています。 ボトムは、ページコンテンツがコードより前に読み込まれることを意味し、読み込まれたページ要素を変更するのに適しています。
  • ページトリガー: コードの配布のためのページテンプレートを選択します。たとえば、カスタムページは、コードがすべてのカスタムページに配布されることを意味します。特定のリソースページにコードを配布したい場合は、Handlebarsテンプレート構文を使用できます。次のコードを参照してください: {{#if page.handle ‘===’ ‘custom page handle’}}ここにコードコンテンツ{{/if}}
注意: 異なるテーマテンプレートの機能は異なる場合があります。テーマ要素スタイルを最適化する際には、これらの違いを考慮してください。

 


 

コードの有効化/無効化

3.png

カスタムコードを追加すると、デフォルトで有効に設定されますが、必要に応じて変更できます。

  • 有効: コードはページで使用できます。
  • 無効: コードはページで使用されません。
他にご質問がございましたら、リクエストを送信してください

コメント