この記事ではInstagram（インスタグラム）のフィードの埋め込みではなく、Instagramのアイコン & リンクをストアに表示する方法を紹介しています。
Instagramアカウントにフッターなどから誘導したい際におすすめです。
また、この記事で紹介する手動設定の方法と、弊社が提供するShopifyアプリを利用した2つの方法があります。
Instagramアイコンの用意が面倒な方や、その他のSNSアイコンも設定したい方はぜひShopifyアプリの利用をご検討下さい。
Instagramアイコンの埋め込み
Instagramのロゴパックをダウンロード
InstagramのアイコンをShopifyストアに表示する前に、公式サイトからロゴパックをダウンロードする必要があります。
Instagramのロゴをアップロード
上記URLからロゴパックのダウンロード後、pngの画像ファイルをShopifyにアップロードします。
アップロードは、「設定」→「ファイル」→「ファイルをアップロード」から行います。
以下のように、リンクコピーアイコンをクリックして、アップロードしたファイルのURLをコピーします。
Instagramアイコンをテーマに追加
また、Instagramアイコンのコードを追加するために「カスタマイズされたLiquid」を任意の場所に追加します。
以下のコードを編集し、ペーストします。
黒太字のInstagramのプロフィールURLと、アップロードした画像ファイルのURLはご自身のものに置き換えて下さい。
以下のコードでは大きさは36pxにしつつ、中央に表示されます。
<div style="text-align: center">
<a href="InstagramのプロフィールURL">
<img src="アップロードした画像ファイルのURL" width="36px">
</a>
</div>以下は完成形のコードの例になります。
<div style="text-align: center">
<a href="https://www.instagram.com/pafit_official/">
<img src="https://cdn.shopify.com/s/files/other_URL" width="36px">
</a>
</div>以下のように表示されることを確認します。
以上でインスタグラムアイコンの設定は完了となります。
Pafit Social Media Iconsについて
Pafit株式会社ではShopifyストアにLINE公式アカウントなどのチャットサービス、SNSへのリンクを設置するためのアプリを提供しています。
フリートライアルを提供していますので、ぜひお試し下さい。
Pafit Social Media Iconsのメリット
- SNSのチャットでカスタマーサポートを実現
- ストア訪問者様が使い慣れたSNSでお問い合わせ可能
- SNSアイコンとリンクをノーコードで設置可能
