ShareThis' Shopifyにツールをインストールする方法(ShareThis App付き)

当社のShopifyアプリを使えば、数回のクリックで簡単にシェアボタンやフォローボタンをウェブサイトに追加することができます。 

  1. に移動します。 ShareThis Share Buttonsアプリ をクリックし、アプリの追加ボタンを選択します。
  2. アプリをインストールし、4つのオプションの中から1つを選択します。
    • インラインシェアボタン。見出しや製品の近くにシェアボタンを設置すると視認性が高まる。 
    • 付箋シェアボタン。シェアボタンをウェブサイトの左または右のレールに固定し、訪問者がスクロールしながら共有できるようにします。 
    • Follow Buttons:あなたのウェブプレゼンスをトップのソーシャルメディアチャンネルに拡大します。 
    • 同意管理プラットフォーム。 ユーザーの同意設定を簡単に管理し、一般データ保護規則を含むEUのプライバシー規制に対応
  3. 使用したいShareThis ツールを選択し、ソーシャルチャンネル、サイズ、形状などを選択してボタンをカスタマイズします。
  4. Shopifyツールのオンとオフの切り替えスイッチをオンにしてから下にスクロールし、「更新」 ボタンをクリックして変更を保存してください。
    • インラインツールをインストールする場合、どちらかを選択することができます。

      注: インラインツールは、あなたのサイトで動作するようにコードの余分なスニペットを必要とします。インライン共有ボタンまたはフォローボタンをインストールしたい場合は、ツールを表示したい場所に上記のオプションに従って配置コードを追加する必要があります。

      テーマをカスタマイズする前に、まずバックアップを取ることをお勧めします。 けいめい をクリックしてテーマを複製し、変更を元に戻したい場合のバックアップコピーにします。


      カスタムリキッドブロックを使って商品ページにインラインShareThis ツールを追加する

      インラインボタンのコードを配置する際に、Shopifyのテーマエディタを使用すると、視覚的なガイドを持つことができます。商品ページに限ったことではありませんが、この説明と最後のビデオに従って、商品説明文にコードを配置することもできます。

      1. オンラインストアのダッシュボードに移動します。
      2. テーマ」をクリックし、「カスタマイズ」と書かれた緑色のボタンをクリックします。
      3. ライブプレビューをクリックして、ボタンを表示させたいページに移動します。
      4. ボタンを挿入したい場所にマウスを置くと、「セクションを追加」というラベルの付いた青い小さなボタンが表示されます。
      5. 一覧から「 Custom Liquid 」を選択します。
      6. 先ほど表示された左サイドバーの該当するプレースメントコードをコピーして貼り付けてください。
        1. Share Buttonsの配置コードです。
        2. Follow Buttonsの配置コード。
      7. 右上の「保存」をクリックします。

      ご参考までに、プレビューをご覧ください。


      テーマコードを編集して、商品ページにインラインShareThis ツールを追加する

      1. 左のナビゲーションバーで、「オンラインストア」>「テーマ 」を選択し、「アクション」>「 コードの編集」をクリックします。
      2. 左サイドバーで、Sectionsフォルダまでスクロールダウンし、main-product.liquidを選択します(古いテーマを使用している場合、Templatesに 移動してproduct.liquidファイルを探します)。次に、次のコードを見つけます。
        {{ product.description }}
        : Control + F で "description" という単語を検索できます(コードエディタ内で内容を検索できるように、必ずファイルの内側をクリックしてください)。セクション/エレメントは、最後に"}"文字で区切られます。

      3. 商品説明の上または下に、該当するプレースメントコードをコピー&ペーストしてください。
        1. Share Buttonsの配置コードです。
        2. Follow Buttonsの配置コード。

      ご参考までに、プレビューをご覧ください。


      インラインShareThis ツールをページやブログに追加する。

      1. 左のナビゲーションバーで、「オンラインストア」>「ページ」を選択します。次に、ボタンを表示させたいページをクリックします。 
      2. コンテンツ] セクションの[HTMLを表示する<>]ボタンをクリックします。
      3. ShareThis ツールを表示させたい場所に、下記のプレースメントコードをコピー&ペーストしてください。
        1. Share Buttonsの配置コードです。
        2. Follow Buttons配置コード